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():把字符串拆分成数组。
JavaScript学习笔记(二),js内置对象,Dom操作和Bom操作_js内置对象
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源码分析成一个模型图,这个图形就被称为文档结构模型。
JavaScript学习笔记(二),js内置对象,Dom操作和Bom操作_全选和全不选_02
//获取到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其实就是在学习三个方面的内容。

  1. js的基本语法。函数
  2. Dom操作。控制元素,对元素进行修改。
  3. Bom操作。对整个浏览器对象的操作。包括刷新,后退,地址栏的操作,窗口的弹出。

Bom:浏览器browser对象模型。
Bom操作的根对象是当前窗口的对象。Window。
Window.alert(“hello world”);
Window.οnlοad=function(){}
Window表示当前窗口对象。代码运行在哪个窗口中,window就表示谁。所以window对象调用方法时是可以省略的。Window.alert()=alert();