如何用JS選擇DOM元素?
getElementById
getElementById() 方法可返回對指定 ID 的第一個對象的引用。
document.getElementById(id)
<input type="text" id="test">
<input type="text" id="test">
<input type="button" value="Show me" onclick="ShowValue()">
<script language="javascript">
function ShowValue(){
var v=document.getElementById("test").value;
alert(v);
}
</script>
但通常網頁，相同的ID只有一組，所以要注意一下！
querySelector
querySelector() 方法只返回匹配指定選擇器的第一個元素
// 取得id 為demo的第一個元素
document.querySelector("#demo");
// 取得css為 example的第一個元素
document.querySelector(".example")
使用class =“example”獲取文檔中的第一個<p>元素：
document.querySelector("p.example");
獲取文檔中第一個<p>元素，其中父元素是<div>元素。
document.querySelector("div > p");
獲取文檔中具有“target”屬性的第一個<a>元素：
document.querySelector("a[target]");
querySelectorAll
獲取文檔中 所指定的 所有元素
以下是取得css為 example的所有元素
var x = document.querySelectorAll(".example");
下例是取得所有有attribute data-src的iframe元素：
let matches = el.querySelectorAll('iframe[data-src]');
主要是做我的學習筆記
偶而心血來潮寫個幾篇~
若有問題~可以寫信或在下方留言~感謝
