6、 js内置的对象
6.1 数组
<script type="text/javascript"> //声明出数组,并附上初始值 //var arr=[1,2,3]; var arr=new Array(); //js的长度可以变化,把4放入到数组里面。 arr.push(4); arr[1]=1; /*for(var i=0;i<arr.length;i++){ console.log(arr[i]); }*/ //这种for循环,循环到的i值是数组的下标,而不是元素值 for(var i in arr){ console.log(arr[i]); } </script>
或者我们先创建出数组对象,再往数组里面放元素:
var arr=new Array();
arr.push(2);
arr[1]=1;
6.2 字符串
常见的方法:
indexOf():获取字符串的下标
subString():截断字符串。
Trim():去除左右空格
Split():把字符串拆分成数组。
6.3 日期
<script type="text/javascript"> var d=new Date();//系统当前时间 alert(d); var y=d.getFullYear();//获取四位的年 var m=d.getMonth();//获取月份,月份从0开始,要得到当前月份需要+1 var day=d.getDay();//获取到星期几 alert(day); </script>
6.4 Json
Json就是Js中的对象。Ajax会用到json。
var person={属性名:属性值,属性名:属性值,函数名:function(){函数体}};
<script type="text/javascript"> //定义json对象 var stu={ name:"zhangsan", age:20,//属性 study:function(){ console.log("------good good study----------"); },//对象的方法 say:function(){ console.log("----------你好,我叫"+this.name+"-------"); } }; stu.say();//调用say方法 var a=stu.age;//调用age属性 console.log(a); </script>
7. Dom操作
通过js代码,
操作元素(html的标签)的属性,增加或者修改属性值,或者修改元素的内容。
Dom:document object model(文档对象模型)。
浏览器在解析html文档的时候,会把html源码分析成一个模型图,这个图形就被称为文档结构模型。
//获取到dom模型上面的dom元素。
var obj=document.getElementById(“元素的id值”);
Dom操作案例:
通过按钮实现复选框的选中和不选中
<script type="text/javascript"> function test(){ var name = document.getElementsByName("f"); for(var i=0;i<name.length;i++){ name[i].checked=document.getElementById("ch").checked; } } </script> </head> <body> <div style="margin:0 auto;width: 400px;height: 200px;" id="test" > <input type="checkbox" id="ch" onclick="test()"/>全选<br/> <input type="checkbox" name="f">西瓜<br/> <input type="checkbox" name="f">苹果<br/> <input type="checkbox" name="f">香蕉<br/> <input type="checkbox" name="f">橘子<br/> </div> </body>
鼠标移入移出文字背景色变化效果特效
<script type="text/javascript"> function test(obj){ obj.style="color:red"; } function test2(obj) { obj.style="color:black"; } </script> </head> <body> <div style="margin:0 auto;width: 400px;height: 200px;" id="test" > <br/> <h1 onmouseover="test(this)" onmouseout="test2(this)" id="t1">张山</h1> <h1 onmouseover="test(this)" onmouseout="test2(this)" id="t2">李四</h1> <h1 onmouseover="test(this)" onmouseout="test2(this)" id="t3">王五</h1> <h1 onmouseover="test(this)" onmouseout="test2(this)" id="t4">赵柳</h1> <h1 onmouseover="test(this)" onmouseout="test2(this)" id="t5">马起</h1> </div> </body>
8. Bom操作
学习js其实就是在学习三个方面的内容。
- js的基本语法。函数
- Dom操作。控制元素,对元素进行修改。
- Bom操作。对整个浏览器对象的操作。包括刷新,后退,地址栏的操作,窗口的弹出。
Bom:浏览器browser对象模型。
Bom操作的根对象是当前窗口的对象。Window。
Window.alert(“hello world”);
Window.οnlοad=function(){}
Window表示当前窗口对象。代码运行在哪个窗口中,window就表示谁。所以window对象调用方法时是可以省略的。Window.alert()=alert();