1.document物件查找Html元素
以下表格是獲取Html元素的常用方法：
（1.）getElementById方法：回傳值是元素物件，如果沒有符合的條件物件，則回傳為null；
（2.）getElementsByTagName: 回傳值是陣列物件，如果沒有符合條件的物件，則回傳為空陣列
（3.）getElementsByName: 回傳的是指定標簽名的元素物件集合，如果無符合條件的物件，則回傳為空陣列，
（4.）getElementsByClassName: 回傳值為指定類名的元素集合，元素集合中的順序以其中在代碼中出現的次序排序，可通過下標方式來訪問指定的元素 （索引號從0開始）
2.Html新增的獲取元素方法
以下代碼作為案例復習：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div class="box">盒子1</div>
<div class="box">盒子2</div>
<ul>
<li>1111</li>
<li>2222</li>
</ul>
<script>
//使用getElementsByClassName方法回傳指定類名元素集合
var obj = document.getElementsByClassName('box');
console.log(obj);
//使用querySelector方法回傳指定選擇器第一個元素物件
// 切記 里面的選擇器需要加符號，這樣開發工具和網站會自動識別 如.box #box
var obj2 = document.querySelector('.box');
console.log(obj2); //回傳的是盒子1元素物件
//使用querySelectorAll方法回傳指定選擇器元素物件集合
var obj3 = document.querySelectorAll('li');
console.log(obj3);
</script>
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/352246.html
標籤：其他