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>
12 Bom操作
学习js其实就是在学习三个方面的内容。
- js的基本语法。函数
- Dom操作。控制元素,对元素进行修改。
- Bom操作。对整个浏览器对象的操作。包括刷新,后退,地址栏的操作,窗口的弹出。
Bom:浏览器browser对象模型。
Bom操作的根对象是当前窗口的对象。Window。
Window.alert(“hello world”);
Window.οnlοad=function(){}
Window表示当前窗口对象。代码运行在哪个窗口中,window就表示谁。所以window对象调用方法时是可以省略的。Window.alert()=alert();