JavaScript Tutorial/DOM Node/Introduction
Содержание
Get node name
<source lang="javascript">
<html> <head> <title>The Node</title> <script type="text/javascript"> function outputNodeProps(nd) {
var strNode = "Node Type: " + nd.nodeType; strNode += "\nNode Name: " + nd.nodeName; strNode += "\nNode Value: " + nd.nodeValue; if (nd.style) { var clr = "red"; nd.style.backgroundColor=clr; strNode += "\nbackgroundColor: " + clr; } alert(strNode);
} </script> <body onload="outputNodeProps(document)">
Header
</body> </html></source>
Get node type
<source lang="javascript">
<html> <head> <title>The Node</title> <script type="text/javascript"> function outputNodeProps(nd) {
var strNode = "Node Type: " + nd.nodeType; strNode += "\nNode Name: " + nd.nodeName; strNode += "\nNode Value: " + nd.nodeValue; if (nd.style) { var clr = "red"; nd.style.backgroundColor=clr; strNode += "\nbackgroundColor: " + clr; } alert(strNode);
} </script> <body onload="outputNodeProps(document)">
Header
</body> </html></source>
Get node value
<source lang="javascript">
<html> <head> <title>The Node</title> <script type="text/javascript"> function outputNodeProps(nd) {
var strNode = "Node Type: " + nd.nodeType; strNode += "\nNode Name: " + nd.nodeName; strNode += "\nNode Value: " + nd.nodeValue; if (nd.style) { var clr = "red"; nd.style.backgroundColor=clr; strNode += "\nbackgroundColor: " + clr; } alert(strNode);
} </script> <body onload="outputNodeProps(document)">
Header
</body> </html></source>
InnerText and InnerHTML
innerText returns only the text portions.
innerHTML returns the HTML code for all elements and text.
The following table lists the different values for innerText and innerHTML based on certain code.
Code innerText innerHTML
"Hello world" "Hello world"
"Hello world" "Hello world"
"" ""