如何使用js动态生成html代码

JavaScript022

如何使用js动态生成html代码,第1张

所谓动态生成html代码就是源文件代码中原来没有内容或者需要重新改变此处的要显示的文字或内容,需要用JavaScript代码来实现。动态生成是一种很常见常用的方法。

用innerHTML写入html代码:

<div id="zd"></div>

‘即为向id为zd的标签写入内容

<script>document.getElementById("zd").innerHTML="这里即为要写入的代码"</script>

说明:

innerHTML:向对象插入内容。

1、在浏览器地址栏输入代码获取js动态生成的HTML内容。

js动态生成的HTML内容无法在网页源文件中查看,但可以通过在浏览器地址栏敲入以下Javascript代码查看Body元素包含的内容:

javascript:document.write(document.body.innerHTML.replace(/</g, "<").replace(/>/g, ">"))

下面的js代码可以查看某个层包含的内容:

javascript:document.write(document.getElementByIdx_x('div1').innerHTML.replace(/</g, "<").replace(/>/g, ">"))

注意:谷歌浏览器时,在javascript控制台输入:去掉"javascript:"的文字即可。

2、写js代码查看生成的html文件

div对象.innerText = div对象.innerHTML