标签:动态 value attr marked asc 举例 charset html dom 时间
HTML DOM 允许 JavaScript 改变 HTML 元素的内容。
JavaScript 能够创建动态的 HTML 内容:
今天的日期是: Sun Oct 14 2018 17:06:00 GMT+0800 (中国标准时间)
在 JavaScript 中,document.write() 可用于直接向 HTML 输出流写内容。
提示:绝不要使用在文档加载之后使用 document.write()。这会覆盖该文档。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <!--<meta charset="utf-8">--> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 6 <meta http-equiv="Content-Language" content="zh-cn" /> 7 <title>My test page</title> 8 9 </head> 10 11 <body> 12 <script> 13 document.write(Date()); 14 </script> 15 </body> 16 </html>
输出结果:Sun Oct 14 2018 17:15:26 GMT+0800 (中国标准时间)
修改 HTML 内容的最简单的方法时使用 innerHTML 属性。
如需改变 HTML 元素的内容,请使用这个语法:
1 document.getElementById(id).innerHTML=new HTML
举例(本例改变了p元素的内容):
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <!--<meta charset="utf-8">--> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 6 <meta http-equiv="Content-Language" content="zh-cn" /> 7 <title>My test page</title> 8 9 </head> 10 11 <body> 12 13 <p id="p1">Hello, world!</p> 14 <script> 15 var x = document.getElementById("p1"); 16 x.innerHTML = "New text!" 17 </script> 18 </body> 19 </html>
输出结果:New text!
如需改变 HTML 元素的属性,请使用这个语法:
1 document.getElementById(id).attribute=new value
举例(本例改变了 <img> 元素的 src 属性):
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <!--<meta charset="utf-8">--> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 6 <meta http-equiv="Content-Language" content="zh-cn" /> 7 <title>My test page</title> 8 9 </head> 10 11 <body> 12 13 <img id="image1" src=hello.jpg> 14 15 <script> 16 var x = document.getElementById("image1"); 17 x.src = "baidu.jpg"; 18 </script> 19 </body> 20 </html>
标签:动态 value attr marked asc 举例 charset html dom 时间
原文地址:https://www.cnblogs.com/zyjhandsome/p/9787008.html