您的位置:首页 > Web前端 > JavaScript

【JavaScript】javaScript基础知识回顾

2015-08-20 13:32 666 查看
我们首先对JavaScript的基础进行回顾。

1.浏览器的对象树

总浏大纲,还是要先看浏览器的对象树:

如1.1浏览器的对象树.png

2.window对象常用方法

alert(‘信息’):      消息框

prompt(‘提示信息’,默认值): 标准输入框

confirm( ):      确认框

open( ):      打开一个新窗口

close( ):     关闭窗口

3.Form表单对象

访问表单的方式:

    *  document.forms

    *  document.表单名字

表单对象常用的属性

action <from action=”xxx”>表单提交的目的地址

method <form method=”xxx”>表单提交方式

name <form name=”xxx”>表单名称

例子1:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>js测试</title>

</head>
<body>
<form name="form1" action="test1.html" method="post">
<input type="text" name="username" value="zhang"/>
<input type="button" name="ok" value="保存1"/>
</form>
<form name="form2" action="test2.html" method="post">
<input type="text" name="username" value="zhang2"/>
<input type="button" name="ok2" value="保存2"/>
</form>

<script language="javascript">
//使用两种方式输出表单的action值/method值(使用表单的名称,使用表单数组forms)
//方法1
var formElement=document.form1;
alert(formElement.action);
alert(formElement.method);

//方法2
var formElement=document.forms[0];
alert(formElement.action);
alert(formElement.method);
</script>
</body>

</html>


测试结果成功输出表单的action值/method值javaScript定义函数的三种方式。

例子2:解决多个按钮提交表单的方法
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>js测试</title>

</head>
<body>
<form name="form1" action="" method="post">
患者姓名<input type="text" name="username" value="zhang"/>
<input type="button" name="ok" value="打印患者信息" onclick="printPerson()"/>
<input type="button" name="ok2" value="查询患者信息" onclick="selectPerson()"/>
</form>

<script language="javascript">
//通过javaScript函数方式访问printPerson.html和selectPerson.html
function printPerson(){
var forElement=document.forms[0];
forElement.action="printPerson.html";
forElement.method="post";
forElement.submit();
}

function selectPerson(){
var forElement=document.forms[0];
forElement.action="selectPerson.html";
forElement.method="get";
forElement.submit();
}
</script>
</body>

</html>


3.javaScript定义函数的三种方式

(1)正常方法
function print(msg){
document.write(msg);
}


对函数进行调用的几种方式: 

函数名(传递给函数的参数1,传递给函数的参数2,….)

变量 = 函数名(传递给函数的参数1,传递给函数的参数2,….)

对于有返回值的函数调用,也可以在程序中直接使用返回的结果,例如:alert("sum=“ + square(2,3));

不指定任何函数值的函数,返回undefined。

(2)构造函数方法  new Function();

//构造函数方式定义javascript函数 注意Function中的F大写

var add=new Function('a','b','return a+b;');

//调用上面定义的add函数

var sum=add(3,4);

alert(sum);

注:接受任意多个字符串参数,最后一个参数是函数体。如果只传一个字符串,则其就是函数体。

(3)函数直接量定义函数

//使用函数直接量的方式定义函数

var result=function(a,b){return a+b;}

 

//调用使用函数直接量定义的函数

var sum=result(7,8);

alert(sum); 

注:函数直接量是一个表达式,它可以定义匿名函数

三种定义函数方法测试:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>js测试</title>

</head>
<body>

<script language="javascript">
//方法1
//使用普通方法
function add1(a,b){
return a+b;
}

alert(add1(1,2));

//方法2
//构造函数方式定义javascript函数
var add2=new Function('a','b','return a+b');
alert(add2(3,4));

//方法3
//使用函数直接量的方式定义函数
var add3=function(a,b){
return a+b;
}
alert(add3(5,6));

</script>
</body>

</html>

以上就是Js的基础知识的大致回顾

转载请注明出处:http://blog.csdn.net/acmman/article/details/47806539
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: