直接查询和间接查询
直接查询
function testGetElementById(){
var elem=document.getElementById("num1");//按id查询
console.info(elem.value);
console.info(elem.name);
console.info(elem.type);
}
//testGetElementById();
function testGetElementsByName(){
var arr=document.getElementsByName("hobby");//按name查询
console.info(arr.length);
for (var i=0;i<arr.length;i++){
console.info(arr[i].value);
}
}
//testGetElementsByName();
function testGetElementsByTagName(){
var arr1 = document.getElementsByTagName("option");
console.info(arr1.length);
for(var i in arr1)
console.info(arr1[i].innerHTML);
}
//testGetElementsByTagName();
间接查询
function testParentNode(){
var elem=document.getElementById("num1");
console.info(elem.parentNode);//父节点访问
console.info(elem.parentNode.parentNode);
console.info(elem.parentNode.parentNode.parentNode);
}
//testParentNode();
function testChildNodes(){
var elem=document.getElementById("123");
console.info(elem.length);
console.info(elem);
var nodes=elem.childNodes;//访问孩子节点,自动生成一个数组
/*for(var i in nodes){
var item=nodes[i];
console.info(item.nodeName+""+item.nodeType);
}*/
for(var i in nodes){
var item=nodes[i];
if(item.nodeType==1){
console.info(item);
}
}
}
//testChildNodes();
function testSibling(){
var p2=document.getElementById("p2");
console.info(p2);
console.info(p2.previousSibling);//查找前一个兄弟节点的文本
console.info(p2.previousElementSibling);//查找前一个兄弟节点的标签的所有元素
console.info(p2.nextSibling);//查找后一个兄弟节点的文本
console.info(p2.nextElementSibling);//查找后一个兄弟节点的标签的所有元素
}
testSibling();