个人笔记9-12

个人学习笔记_仅供个人参考（如有错误，望指正，谢谢）

1.Javascript数组

一维数组 

先声明Javascript数组 

var array=new Array(); 

赋值(2种方式) 

1.array[0]=”aa”; 

2.array.push(“aa”); 

一维数组的遍历方式： 

1.普通遍历 

for(var i=0;i

//先声明出一个一维数组
var array=new Array();
//借助循环(但这种借助循环的方式都伴随着赋值)
for(var i=0;i<array.length;i++){
array[i]=new Array();
}

1
2
3
4
5
6

//还有这种比较复杂的方式
var array=new Array();
array[0]=new Array();

1
2
3

//遍历输出
for(var i=0;i<array.length;i++){
for(var j=0;j<array[i].length;j++){
alert(array[i][j]);
}
}

1
2
3
4
5
6

2.Javascript获取元素的几种方式
通过id的名称获取

var idName=document.getElementById("<id名称>");
//返回相应的值
alert(idName.value);

1
2
3
通过name来获取

var names=document.getElementsByName("<name名称>");
//此时返回的是一个数组类型的对象，不能用for-in去遍历这个对象，否则出现的结果会加上underfined(因为for-in循环遍历会加上它本身的属性)
for(var i=0;i<names.length;i++){
alert(names[i].value);
}

1
2
3
4
5
通过className来获取

//与name获取类似，返回的也是一个数组类型的对象
var classNames=document.getElementsByClassName("<className名称>");

1
2
通过tagName(标签名称)来获取

//同上
var tNames=document.getElementByTagName("<tagName名称>");

1
2

3.Javascript dom 操作 

DOM：文档对象模型（document object model） 

2个属性：InnerHTML 和 InnerText 

innerHTML：比较霸道的添加html元素的属性（其余元素会全部覆盖）：

var div1=document.getElementById("div1");
div1.innerHTML("<font color='red'>asdas</font>")

1
2

innerText ：比较霸道的添加文本元素的属性（其余元素会全部覆盖）

var div1=document.getElementById("div1");
div1.innerText("asdsda");

1
2

2者若同时存在 取后者

appendChild()方法：

//获取父元素
var div1=document.getElementById("div1");
var element=document.createElement("input");
var text=document.createTextNode("asdadsas");
div1.appendChild(element);
div1.appendChild(text);
//自定义属性
element.setAttribute("aa","http://www.baidu.com");
alert(element.getAttribute("aa"));

1
2
3
4
5
6
7
8
9

4.父子节点 

父节点特征：有头有尾 

子节点特征：有头有尾也可以有头无尾 

根据子节点找父节点（parentNode）

//获取子节点句柄
var child=document.getElementById("<id名称>");
//获取父节点名称
var parent=child.parentNode;、
//输出父节点id名称
alert(parent.id);

1
2
3
4
5
6

根据父节点找子节点

//获取父节点句柄
var parent=document.getElementById("<id名称>");
var child=parent.childNodes;
//child是一个数组类型的变量，需要用到数组遍历
for(var i=0;i<child.length;i++){
alert(child[i].id);
}

1
2
3
4
5
6
7