标签：null get nts before font 官方文档 graph 1.5 lib
DOM入门方法实例1
<!DOCTYPE html> <html> <body> <p id="intro">Hello World!</p> <p>本例演示 <b>getElementById</b> 方法！</p> <script> x=document.getElementById("intro"); document.write("<p>来自 intro 段落的文本：" + x.innerHTML + "</p>"); </script>
</body> </html>
DOM入门方法实例2
<!DOCTYPE html> <html> <body> <p id="intro">Hello World!</p>
<script> var txt=document.getElementById("intro").innerHTML; document.write(txt); </script>
</body> </html>
nodeName 属性规定节点的名称。
注释：nodeName 始终包含 HTML 元素的大写字母标签名。
nodeValue 属性规定节点的值。
nodeType 属性返回节点的类型。nodeType 是只读的。
getElementsByTagName() 返回带有指定标签名的所有元素。
node.getElementsByTagName("tagname");
实例：
<!DOCTYPE html> <html> <body> <p>Hello World!</p> <p>DOM 很有用！</p> <p>本例演示 <b>getElementsByTagName</b> 方法。</p> <script> x=document.getElementsByTagName("p"); document.write("第一段的文本: " + x[0].innerHTML); </script> </body> </html>
如果您希望查找带有相同类名的所有 HTML 元素，请使用这个方法：
document.getElementsByClassName("intro");
上面的例子返回包含 class="intro" 的所有元素的一个列表：
修改 HTML DOM 意味着许多不同的方面：
<html> <body> <p id="p1">Hello World!</p> <script> document.getElementById("p1").innerHTML="New text!"; </script> </body> </html>
<html> <body> <p id="p2">Hello world!</p> <script> document.getElementById("p2").style.color="blue"; </script> </body> </html>
<div id="d1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("This is new."); para.appendChild(node); var element=document.getElementById("d1"); element.appendChild(para); </script>
<html> <body> <input type="button" onclick="document.body.style.backgroundColor=‘lavender‘;" value="Change background color" /> </body> </html>
在本例中，由函数执行相同的代码：
<html> <body> <script> function ChangeBackground() { document.body.style.backgroundColor="lavender"; } </script> <input type="button" onclick="ChangeBackground()" value="Change background color" /> </body> </html>
<div id="div1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var parent=document.getElementById("div1"); var child=document.getElementById("p1"); parent.removeChild(child); </script>
<div id="div1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("This is new."); para.appendChild(node); var parent=document.getElementById("div1"); var child=document.getElementById("p1"); parent.replaceChild(para,child); </script>
<div id="div1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("This is new."); para.appendChild(node); var element=document.getElementById("div1"); element.appendChild(para); </script>
<div id="div1"> <p id="p1">This is a paragraph.</p> <p id="p2">This is another paragraph.</p> </div> <script> var para=document.createElement("p"); var node=document.createTextNode("This is new."); para.appendChild(node); var element=document.getElementById("div1"); var child=document.getElementById("p1"); element.insertBefore(para,child); </script>
资料来源：http://www.w3school.com.cn/htmldom/index.asp
标签：null get nts before font 官方文档 graph 1.5 lib
原文地址：http://www.cnblogs.com/haoyangblog/p/6681754.html
