第一种：使用 parent.appendchild()方法

HTML页面

<div id="div1"></div>

JS文件

        //第一步创建标签元素节点

        var elem=document.createElement("p");

        //第二步创建文本节点

        var content=document.createTextNode("Hello,BigSpinach!");

        //第三步将文本添加到所创建的标签中

        elem.appendChild(content);

        //第四步，将创建的元素添加到页面中

        document.getElementById("div1").appendChild(elem);

显示结果

第二种：使用innerHTML="html代码段"

HTML页面

<div id="div2"></div>

JS文件

 document.getElementById("div2").innerHTML="<p>hello div2！</p>";

显示结果

第三种：使用document.write("html代码段")的方法

HTML页面

<body></body>

JS文件

 document.write（"<p>hello div3！</p>"）;

显示结果

页面会打印出 hello div3！

第四种：使用jQuery创建HTML元素

HTML页面

 <div id="div4"></div>

JS文件

        //第一步：创建页面元素

        var $p=$("<p></p>");

        //第二步：设置属性和值

        $p.attr("name","250");

        //第三步：设置文本

        $p.text("hellow div4！");

        //第四步： 将创建的元素添加到指定位置

        $("#div4").append($p);

巴特西

创建HTML元素的方法

第一种：使用 parent.appendchild()方法

HTML页面

JS文件

显示结果

第二种：使用innerHTML="html代码段"

HTML页面

JS文件

显示结果

第三种：使用document.write("html代码段")的方法

HTML页面

JS文件

显示结果

第四种：使用jQuery创建HTML元素

HTML页面

JS文件

显示结果

最新文章

热门文章