HTML DOM属性
HTML DOM属性
属性是节点（HTML元素）的值，您可以获取和设置。
属性的使用是不需要有括号的，直接：ele.innerHTML 获取属性值 ele.innerHTML="<h1></h1>" 设置属性值
下面列出常用的一些属性：
innerHTML属性：
innerHTML 属性可用于获取或改变任意 HTML 元素，包括 <html> 和 <body>。
<div id="mydiv1">hello,<b>mydiv1</b></div>
<script>
var mydiv1=document.getElementById("mydiv1");
var html=mydiv1.innerHTML;//获取mydiv1中的html代码
document.write(html);//输出到页面上
</script>nodeName 属性：
nodeName 属性规定节点的名称。
- nodeName 是只读的
- 元素节点的 nodeName 与标签名相同
- 属性节点的 nodeName 与属性名相同
- 文本节点的 nodeName 始终是 #text
- 文档节点的 nodeName 始终是 #document
注释：nodeName 始终包含 HTML 元素的大写字母标签名。
<div id="mydiv1">hello,<b>mydiv1</b></div>
<script>
var mydiv1=document.getElementById("mydiv1");
var nodeName1=mydiv1.nodeName;//DIV
var nodeName2=mydiv1.firstChild.nodeName;//#text
var nodeName3=mydiv1.getAttributeNode("id").nodeName;//id
var nodeName4=document.nodeName;//#document
document.write(nodeName1+"<br>"+nodeName2+"<br>"+nodeName3+"<br>"+nodeName4);//输出到页面上
</script> nodeValue 属性
nodeValue 属性规定节点的值。
- 元素节点的 nodeValue 是 undefined 或 null
- 文本节点的 nodeValue 是文本本身
- 属性节点的 nodeValue 是属性值
<div id="mydiv1">hello,<b>mydiv1</b></div>
<script>
var mydiv1=document.getElementById("mydiv1");
var nodeName1=mydiv1.nodeValue;//null
var nodeName2=mydiv1.firstChild.nodeValue;//hello,
var nodeName3=mydiv1.getAttributeNode("id").nodeValue;//mydiv1
var nodeName4=document.nodeValue;//null
document.write(nodeName1+"<br>"+nodeName2+"<br>"+nodeName3+"<br>"+nodeName4);//输出到页面上
</script> nodeType 属性
nodeType 属性返回节点的类型。nodeType 是只读的。
比较重要的节点类型有：
| 元素 | 1 |
| 属性 | 2 |
| 文本 | 3 |
| 注释 | 8 |
| 文档 | 9 |
<div id="mydiv1">hello,<!--注释--><b>mydiv1</b></div>
<script>
var mydiv1=document.getElementById("mydiv1");
var nodeName1=mydiv1.nodeType;//1
var nodeName2=mydiv1.firstChild.nodeType;//3
var nodeName3=mydiv1.getAttributeNode("id").nodeType;//2
var nodeName4=document.nodeType;//9
var nodeName5=mydiv1.firstChild.nextSibling.nodeType;//8
document.write(nodeName1+"<br>"+nodeName2+"<br>"+nodeName3+"<br>"+nodeName4+"<br>"+nodeName5);//输出到页面上
</script> 相关推荐
星星有所不知 2020-10-12
zuncle 2020-09-28
huaoa 2020-09-14
北京老苏 2020-08-17
luvhl 2020-08-17
Kakoola 2020-07-29
drdrsky 2020-07-29
书虫媛 2020-07-08
liaoxuewu 2020-07-08
SIMONDOMAIN 2020-07-08
爱读书的旅行者 2020-07-07
tianzyc 2020-07-04
Vue和React是数据驱动视图，如何有效控制DOM操作?能不能把计算，更多的转移为js计算？因为js执行速度很快。patch函数-->patch,对比tag,对比tag与key,对比children
Lophole 2020-07-04
Lophole 2020-06-28
liaoxuewu 2020-06-26
ApeLife技术 2020-06-26
北京老苏 2020-06-25
Lophole 2020-06-14