改变HTML
1.改变HTML输出流
JavaScript可以创建动态的HTML内容。(注意:不要在加载文档后使用document.write(),这会覆盖文档。)
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>make HTML</title> </head> <body> <script type="text/javascript"> document.write(Date()); </script> </body> </html>
2.改变HTML内容
使用innerHTML改变文档中元素内容。
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>change HTML</title> </head> <body> <p id="demo">你好</p> <button type="button" onclick="change()">点我改变内容</button> <script> function change(){ document.getElementById("demo").innerHTML="你也好呀"; } </script> </body> </html>
3.改变HTML属性
//改变HTML属性语法 document.getElementById(id).attributte = new value;
<!DOCTYPE html> <html> <body> <img id="image" src="smiley.gif"> <script> document.getElementById("image").src="landscape.jpg"; </script> </body> </html>