本文介绍了三种常用的DOM元素获取方法：使用document对象的方法如getElementById、getElementsByClassName等；利用document对象属性获取body和html元素；通过Element对象方法选取特定元素。这些方法是前端开发中频繁使用的技巧。
第一种（利用document对象方法）：
<body>
<div id="box">box</div>\
<div class="bar">bar</bar>
<div name="main">main</div>
<script>
//获取id为box的元素
console.log(document.getElementById('box'));
//获取所有class为bar 的元素
console.log(document.getElementsByClassName('bar'));
//获取所有 标签为div 的元素
console.log(document.getElementsByTagName('div'));
//获取所有 name为main 的元素
console.log(document.getElementsByName('main'));
</script>
</body>
第二种（利用document对象属性）：
var body = document.getElementsByTagName('body') [0]; //获取body元素
var html= document.getElementsByTagName('html') [0]; //获取html元素
console.log(document.body === body); //比较返回结果，输出结果:true
console.log(document.documentElement === html); // 比较返回结果,输出结果:ture
第三种（利用Element对象方法）：
<ul id="ul">
<li>PHP</li><li>JavaScript</li>
<ul><li>jQuery</li></ul>
</ul>
<script>
var lis =document.getElementById('ul').getElementsByTagName('li');
console.log(lis); //输出结果:(3) [li,li,ul]
</script>
扫一扫
648
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
