Propriétés et méthodes publiques dans le DOM principal
Propriétés et méthodes publiques dans le DOM principal
Remarque?: La recherche de n?uds (marqueurs) dans le DOM principal commence à partir du n?ud racine de (html n?ud).
Accès aux n?uds
-
nodeName?: nom du n?ud.
nodeValue?: La valeur du n?ud. Seuls les n?uds de texte ont des valeurs, les n?uds d'éléments n'ont aucune valeur. La valeur de nodeValue ne peut être que du ? texte brut ? et ne peut contenir aucune balise HTML ou attribut CSS.
firstChild?: le 1er n?ud enfant.
lastChild?: le dernier n?ud enfant.
childNodes?: liste de n?uds enfants, qui est un tableau.
parentNode?: n?ud parent.
Comment trouver des balises
document.firstChild
document.firstChild.lastChild
document.body
Opérations d'attribut sur les n?uds
setAttribute(name, value)?: Ajouter un attribut à un n?ud.
getAttribute(name) : récupère la valeur d'un attribut de n?ud.
removeAttribute(name)?: Supprime l'attribut d'un n?ud.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>php.cn</title>
<script type="text/javascript">
window.onload = function(){
//查找body節(jié)點(diǎn)
var node_body = document.all.div1;
//查找img節(jié)點(diǎn)
var imgObj = node_body.firstChild;
//增加屬性
imgObj.setAttribute("src","https://img.php.cn/upload/course/000/000/009/580ae23c4a88a881.jpg");
imgObj.setAttribute("width","400");
imgObj.setAttribute("border","2");
imgObj.setAttribute("style","cursor:pointer;");
//刪除border屬性
imgObj.removeAttribute("border");
}
</script>
</head>
<body ><div id="div1"><img /></div></body>
</html>Création de noeuds
document.createElement(tagName) : Crée une balise HTML spécifiée, un n?ud
tagName : fait référence sans chevrons Le nom de la balise HTML.
Exemple?: var imgObj = document.createElement("img")
parentNode.appendChild(childNode)?: Ajoutez le n?ud créé à un n?ud parent.
parentNode représente le n?ud parent, et le n?ud parent doit exister.
childNode représente le n?ud enfant.
Exemple?: document.body.appendChild(imgObj)
parentNode.removeChild(childNode)?: supprimer un certain N?uds enfants sous le n?ud parent.
parentNode représente le n?ud parent.
childNode représente le n?ud enfant à supprimer.
Exemple?: document.body.removeChild(imgObj)
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>php.cn</title>
<script >
//網(wǎng)頁加載完成后
window.onload = function(){
//創(chuàng)建一個(gè)<img>標(biāo)記
var imgObj = document.createElement("img");
//增加屬性
imgObj.setAttribute("src","/upload/course/000/000/009/580ae23c4a88a881.jpg");
imgObj.setAttribute("width","400");
//將創(chuàng)建的圖片節(jié)點(diǎn)，掛載到某個(gè)父節(jié)點(diǎn)下
document.body.appendChild(imgObj);
}
</script>
</head>
<body>
</body>
</html> 
