标签对象的全局查找和局部查找

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>标签对象的全局查找和局部查找</title>
</head>
<body>
<div id="div1">hello div1
<div class="div2" name="star">hello div2</div>
<div class="div3">hello div3
<p>hello p2</p>
<p id="ppp">hello innerHtml</p>
<p class="ss">hello innerHtmlss</p>
<p name="ll">hello innerHname</p>
</div>
<p>hello p</p>
</div>
<!--1.寻找对象的方式-->
<script>
// 一:全局查找
//(1)通过ID
//(2)通过class
// var ele1=document.getElementsByClassName('div2');
// var ele2=ele1[0].nextElementSibling;
// alert(ele2.innerHTML);//hello div3
//(3)通过标签
// var tag=document.getElementsByTagName('p');
// alert(tag);//[object HTMLCollection]
// alert(tag[0].innerHTML);//hello p
// (4)通过name属性
// var nAme=document.getElementsByName('star');
// alert(name);//[object NodeList]
// alert([object NodeList])
// for(var i in nAme){
// console.log(nAme[i].innerHTML);//hello div2
// }
//二:局部查找
var el=document.getElementsByClassName('div3');
//1.局部查找可以通过标签查找
// var ret=el[0].getElementsByTagName('P');
// alert(ret[0].innerHTML);//hello p2
// alert(ret.length);//1
//2.局部查找不可以通过ID查找
//3.局部查找可以通过class查找
var ret=el[0].getElementsByClassName('ss');
alert(ret[0].innerHTML);//hello innerHtmlss
//4.局部查找不可以通过name属性查找




</script>


</body>
</html>
posted @ 2020-02-01 18:52  Stary_tx  阅读(412)  评论(0编辑  收藏  举报