insertAdjacentHTML可以动态插入网页内容

时间:2021-12-06 19:38:33
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>insertAdjacentHTML插入新内容</title>
<script language="jscript">
var num = 0;
function addsome()
{
num++;
document.all.paral.insertAdjacentHTML("afterBegin","<h1>在文本前容器内插入内容"+num+"</h1>");
document.all.paral.insertAdjacentHTML("beforeEnd","<h2>在文本后容器内插入内容"+num+"</h2>");
document.all.paral.insertAdjacentHTML("beforeBegin","<h4>在文本前容器外插入内容"+num+"</h4>");
document.all.paral.insertAdjacentHTML("afterEnd","<h5>在文本后容器外插入内容"+num+"</h5>");
}
</script>
</head>
<body>
<div id="paral" style="fontsize:6;color='#ff00ff';border:1px red solid;">原来的内容</div>
<hr>
<input type="button" onclick="addsome()" value="点击我">
</body>
</html>