JavaScript
与html结合的方式:
-
只需要在head标签或者body标签中,使用script标签来书写JavaScript代码即可
<head> <script type="text/javascript"> alert("hello JavaScript");//它可以接收任何类型的参数,这种参数就是警告框提示的信息 </script> </head>
需要另外创建一个JavaScript文件,然后
<head> <script type="text/javascript" src="JavaScript文件.js"> </script> </head>
-
JavaScript里的变量类型:
数值类型:number
字符串类型:string
对象类型:object
布尔类型:object
函数类型:function
JavaScript里面的特殊值:
undefined:未定义,所有js变量未赋予初始值的时候,默认都是undefined
null:空值
NAN:全称是:not a number
-
typeof()函数可以取到变量类型
-
关系运算:
==等于
===全等于
-
这几种情况参与逻辑运算被定义为假: 0,null,””(空串),undefined
-
数组元素类型可以不同,会自动扩容,没有赋值的部分类型是undefined
-
//定义无参数函数 function fun(){ alert("fun函数被调用了"); } //调用 fun(); //定义有参函数 function fun(a,b)//不需要定义类型 {} //还有一种定义方式: var fun=function(a,b){}
-
函数不支持重载
-
函数中的隐形参数
var fun=function(){ alert(arguments);//arguments是隐形参数,用来查看参数个数 }
-
创建对象
var obj={ age:18, fun:function(){ alter(this.age); } };
-
注册事件
unload事件 function onloadfun(){} <body οnlοad="onloadfun();"></body> //静态注册onload事件(浏览器解析完之后就会自动触发的事件) <head> window.οnlοad=function(){}; //动态注册的onload事件 </head> onclick事件 function fun(){} <body> <button οnclick="fun();">按钮1</button>//静态注册onclick事件 <button id="btn01">按钮2</button> </body> <head> window.οnlοad=function(){ var btnobj=document.getElementById("btn01"); btnobj.οnclick=function(){//动态注册onclick事件 ... } } </head> 同理还有onblur(失去焦点事件) onchange(内容改变,主要用于选择按钮,内容改变会有提示) onsubmit(表单提交事件,验证所有表单是否合法) <οnsubmit='return false'>//如果不合法可以将参数设置为false 动态注册: window.οnlοad=function(){ //获取标签对象 var obj=document.getElemtById("from1"); //如果不合法就阻止提交 return false; }
-
DOM文本对象模型
<head> <script type="text/javascript"> function click(){ var username=Obj=document.getElementById("username"); //获取对象 } <body> 用户名:<input type="text" id=username> <button οnclick="click()">校验</button>
-
正则表达式:
//两种正则表达式对象的写法 var patt=/内容/; var patt=new RegExp(内容); //[字母或者数字]表示要求字符串中是否包含 var patt=[a-z];//[0-9]等等 var str="asdasd"; alert(patt.test(str));//会返回true /\w/ 是否包含任意数字,字母,下划线 /字符*/ 表示是否包含0个或者多个字符 /字符?/ 表示包含0个或者1个 /字符{3}/ 表示是否包含连续三个字符 /字符{3,6}/ 表示是否包含连续三个字符,至少3个最多6个 /字符$/ 表示必须以字符结尾 /^字符/ 表示字符串必须以字符开头
-
将标签插入到文本框
<head> var usernameobj=getElementById("username");//获取对象 usernameobj.innerHTML="验证成功" </head> <body> 用户名:<input type="text" id="username" value="asd"> <span id="username" ></span> </body>
-
<html> <head> <script type="text/javascript"> function checkAll() { var hobbies = document.getElementsByName("hobby"); for (var i = 0; i < hobbies.length; i++) { hobbies[i].checked = true; } } function checkNo() { var hobbies = document.getElementsByName("hobby"); for (var i = 0; i < hobbies.length; i++) { hobbies[i].checked = false; } } function checkReverse() { var hobbies = document.getElementsByName("hobby"); for (var i = 0; i < hobbies.length; i++) { if (hobbies[i].checked) hobbies[i].checked = false; else hobbies[i].checked = true; } } </script> </head> <body> 用户名:<input type="text" οnblur="onblurFun()" /><br /> 密码: <input id="password" type="text" /><br /> <input type="checkbox" name="hobby" value="cpp" checked="checked" />C++ <input type="checkbox" name="hobby" value="java" />java <input type="checkbox" name="hobby" value="js" />js <br /> <button type="button" οnclick="checkAll()">全选</button> <button type="button" οnclick="checkNo()">全不选</button> <button type="button" οnclick="checkReverse()">反选</button> </body> </html> //getElementsByName
-
<html> <head> <script type="text/javascript"> var inputs=document.getElementsByTagName("input");//按照指定标签名来进行查询并且返回集合 alert(inputs) </script> </head> <body> 用户名:<input type="text" οnblur="onblurFun()" /><br /> 密码: <input id="password" type="text" /><br /> <input type="checkbox" name="hobby" value="cpp" checked="checked" />C++ <input type="checkbox" name="hobby" value="java" />java <input type="checkbox" name="hobby" value="js" />js <br /> <button type="button" >全选</button> <button type="button" >全不选</button> <button type="button" >反选</button> </body> </html>
-
document三个对象查询优先使用Id,然后是name,最后是标签.以上三个方法需要在页面加载之后才能查询
-
create element
<html> <head> <script type="text/javascript"> window.onload = function () { var obj = document.createElement("div"); // obj.innerHTML = "我爱你"; var ne=document.createTextNode("我爱你"); document.body.appendChild(ne); }; </script> </head> <body> 用户名:<input type="text" οnblur="onblurFun()" /><br /> 密码: <input id="password" type="text" /><br /> <input type="checkbox" name="hobby" value="cpp" checked="checked" />C++ <input type="checkbox" name="hobby" value="java" />java <input type="checkbox" name="hobby" value="js" />js <br /> <button type="button">全选</button> <button type="button">全不选</button> <button type="button">反选</button> </body> </html>