JavaScript DHTML/Node Operation/innerHTML
Содержание
Get the paragraph tag and set its innerHTML value
<source lang="html4strict">
<html> <head>
<title>the date</title>
</head> <body>
<script type = "text/javascript"> var today = new Date(); var then = new Date(); then.setFullYear(3000,1,1); var diff = then.getTime() - today.getTime(); diff = Math.floor(diff / (1000 * 60 * 60 * 24)); var dateLoc = document.getElementById("dateField"); dateLoc.innerHTML = diff + " days"; </script>
</body> </html>
</source>
"innerHTML" Example
<source lang="html4strict">
<html> <body>
Sample Text inside a p element
<button onclick="alert(myP.innerHTML);">InnerHTML</button> <button onclick="alert(myP.innerText);">InnerText</button> </body> </html>
</source>
Modifying Elements after Page loads
<source lang="html4strict">
<html> <head> <title>Modifying Elements after Page loads</title> <script type="text/javascript"> function changeDiv() {
var elem1 = document.getElementById("elem1");elem1.innerHTML = "
Hello World
";} </script> <body onload="changeDiv();">
Paragraph text.
</body> </html>
</source>
Switch html with assigning the innerHTML
<source lang="html4strict">
<html> <head> <title>Overflow</title> <style type="text/css">
- div1 { width: 700px; height: 150px }
- div2 { width: 600px; height: 100px; overflow: auto }
</style> <script type="text/javascript"> function switchContent() {
var div1 = document.getElementById("div1").innerHTML; var div2 = document.getElementById("div2").innerHTML; document.getElementById("div1").innerHTML = div2; document.getElementById("div2").innerHTML = div1;
} </script> </head> <body>
<a href="javascript:switchContent();">Switch</a>
p1
Smaller item.
</body> </html>
</source>