JS-DOM节点属性
标签：对象 named tab strong getname stc list head lis
DOM属性
元素对象属性：
nodeType 节点类型
nodeName 节点名称
nodeValue 节点值
常用节点属性
| |
nodeType |
nodeName |
nodeValue |
| document/文档 |
9 |
# |
无 |
| Element/元素 |
1 |
元素标签的名字 |
null |
| attrbute/属性 |
2 |
属性名称 |
属性的值 |
| Text/文本 |
3 |
#text |
文本的值 |
| 注释节点 |
8 |
#comment |
注释内容 |
元素节点是没有nodeValue，里边内容属于文本对象
//例子如下
//
// test
//
//获取常用节点
//文档对象
console.log(document.nodeType+" "+document.nodeName+" "+document.nodeValue);
//元素对象
let divObj = document.getElementsByTagName("div")[0];
//获取元素对象，以div为例
console.log(divObj.nodeType+" "+divObj.nodeName+" "+divObj.nodeValue);
//属性对象
let attrs = divObj.attributes;
//获得该元素的属性节点集合（返回元素的属性的 NamedNodeMap）
console.log(attrs);
//显示属性类容
//取出该集合中的某个属性对象（对象）
//1.可以通过下标来获取
let idObj = attrs[0];
//2.NamedNodeMap提供的方法
let idObj = attrs.getNamedItem("id");
//通过名称
let idObj = attrs.item(0);
//通过下标
console.log(idObj.nodeType+" "+idObj.nodeName+" "+idObj.nodeValue);
idObj.nodeValue="new_one";
//可以通过属性对象的nodevalue来设置属性的值
console.log(divObj.id);
divObj.id="show_one";
//通过nodeValue来获取和设置属性的值比较麻烦。
//所以我们都是通过 点 操作符来 获取和设置 属性的值(前提是元素节点必须有该属性)
divObj.className="test_class";
console.log(divObj.className);
//使用classs属性时注意： 是 .classsName
//divObj.class="test_class"; 不能修改 必须使用 className
查询对象除了通过documen的六种方法找寻外
还可以通过元素之间的关系找寻
-
父节点/parentNode
-
子节点/chlidNode
第一个子节点/fristChild
最后一个子节点/lastChild
-
兄弟节点
下一个兄弟/nextSibiling
上一个兄弟/previousSibiling
JS-DOM节点属性
标签：对象 named tab strong getname stc list head lis
原文地址：https://www.cnblogs.com/-Archenemy-/p/12370118.html
文章来自：
搜素材网的
编程语言模块，转载请注明文章出处。
文章标题：
JS-DOM节点属性
文章链接：http://soscw.com/index.php/essay/75786.html
评论