使用id名表示标签，不够严谨。在html语法中，id名随便起，可以是js中的关键字，但是在js中使用id代表标签，就不能使用关键字，所以我们需要一种更加严谨的方式获取标签。
方法一：通过id名来获取 - 方法 - document.getElementById('id名')
<body>
<button id="var">按钮</button>
</body>
<script>
var a = document.getElementById('var')
console.log(a);
</script>
</html>
方法二：通过标签名来获取 - 方法 - document.getElementsByTayName('标签名') - 获取到的是一个集合，集合中会将当前页面中所有当前标签都获取到，哪怕只有一个，也是集合。获取到的集合，要取下标来做。
<body>
<button id="var">按钮</button>
<button id="aa">按钮</button>
<button id="bb">按钮</button>
</body>
<script>
var a = document.getElementsByTagName('button')
console.log(a);
console.log(a[0]);
for(var i=0;i<a.length;i++){
a[i].onclick = function(){
console.log(111)
}
}//三个按钮利用下标通过循环都绑上了点击事件
</script>
方法三：通过类名来获取 - 方法 - document.getElementsByClassName('类名') - 获取到的也是集合
<body>
<input type="text" class="text1">
<input type="text" class="text2">
<input type="text" class="text3">
<input type="text" class="text1">
</body>
<script>
var text = document.getElementsByClassName('text1')
console.log(text)
</script>
方法四：通过标签的name属性 - 方法 - document.getElementsByName('name属性的值')
<body>
<input type="text" name="user">
<input type="text" name="sex">
<input type="text" name="sex">
<input type="text" name="user">
</body>
<script>
var sex = document.getElementsByName('sex')
console.log(sex)
</script>
方法五：通过css选择器来获取一个标签 - 方法 - document.querySelector('css选择器') - 获取到满足css选择器的第一个标签
<body>
<input type="text" class="text1">
<input type="text" class="text2">
<input type="text" class="text3">
<input type="text" class="text1">
</body>
<script>
var text1 = document.querySelector('.text1')
console.log(text1) //只输出一个<input type="text" class="text1">
</script>
方法六：通过css选择器来获取所有满足css选择器的标签们 - 方法 - document.querySelectorAll(css选择器)
<body>
<input type="text" class="text1">
<input type="text" class="text2">
<input type="text" class="text3">
<input type="text" class="text1">
</body>
<script>
var text1 = document.querySelectorAll('.text1')
console.log(text1);
//输出：
//0: input.text1
//1: input.text1
//length: 2
//[[Prototype]]: NodeList
</script>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
