????? ???? ??? ??? ????. 1. ID? ?? ?? ???? 2. ??? ??? ?? ?? ???? 4. CSS ???? ?? ?? ????

JavaScript?? ??? ??? ??? ???? ??? ?? ????. ??? ????? ???? ? ?? ?????.

1. ID? ?? ????

document.getElementById() ???? ???? ID? ??? ??? ? ????. ?:

javascript

var element = document.getElementById("myElementId");

2. ??? ???? ?? ????

document.getElementsByClassName() ???? ???? ??? ???? ??? ??? ? ????. ? ???? ???? ?? ??? ?????? HTMLCollection? ?????. ?:

javascript

var elements = document.getElementsByClassName("myClassName");  
var firstElement = elements[0]; // 獲取第一個匹配的元素

3. ?? ???? ?? ????

document.getElementsByTagName() ???? ???? ?? ???? ??? ??? ? ????. ? ???? ?? ???? ?? ??? ?????? HTMLCollection? ?????. ?:

javascript

var elements = document.getElementsByTagName("p"); // 獲取所有的<p>元素  
var firstParagraph = elements[0]; // 獲取第一個<p>元素

4. CSS ???? ?? ??? ?????

document.querySelector() ?? document.querySelectorAll() ???? ???? CSS ??? ??? ?? ??? ? ????. . querySelector()? ???? ???? ? ?? ??? ????, querySelectorAll()? ???? ???? ?? ??? NodeList? ?????. ?:

javascript

var element = document.querySelector(".myClassName"); // 獲取第一個具有指定類名的元素  
var elements = document.querySelectorAll("div > p"); // 獲取所有作為<div>元素直接子元素的<p>元素

5. ?? ?? ?? ?? ??? ?? ??? ?????.

??? ?? ??, firstChild, lastChild, parentNode ? ?? ??? ???? ??? ??? ?? ????. ??? DOM ??? ????? ?????. ?:

javascript

var parentElement = element.parentNode; // 獲取元素的父元素  
var firstChild = element.firstChild; // 獲取元素的第一個子節(jié)點（可能是元素或文本節(jié)點）  
var firstChildElement = element.firstElementChild; // 獲取元素的第一個子元素（忽略文本節(jié)點）

getElementsByClassName(), getElementsByTagName() ?? querySelectorAll()? ??? ? ?? ??? ?? ??? ?? ??? ????? ?? ?????. ??? ?? ? ??? ?? ??? ???? ?? ?? ???(?: ??[0])? ?? ??? ????? ???.

?? firstChild ? lastChild? ?? ??? ??? ? ???? ?? ??? ?? ??? ?? ??? ??? ?? ??? ??? ? ????. ?? ??? ????? firstElementChild ? lastElementChild? ?? ??? ??? ? ????.

? ??? ??????? ???? ??? ?? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!