1）创建标签

基本语法

var 变量名 = document.createElement(“标签”);

功能

创建一个标签。
通过 createElenemt()方法可以创建、、

等标签。

2）添加标签

基本语法

var 变量名 = document.createElement(“标签”);
父级元素.appendChild(变量名);

功能

向父元素对象添加最后一个子元素。

示例

   function addElement(){
            index++;
            var obj = document.getElementById("div1");
                    var descDiv = document.createElement('p');
            obj.appendChild(descDiv);
            //p标签样式
            var cssStr = "width:400px;height:30px;margin-bottom:10px;background-color:#FFFF99;border:1px solid black;line-height:30px;";
            descDiv.style = cssStr;
            //p标签文本
            descDiv.innerHTML = index+' 这是p标签';
    }
    1、创建并添加p标签
            var obj = document.getElementById("div1");  获取id为div1的元素
            var descDiv = document.createElement('p');  创建p标签
            obj.appendChild(descDiv);  将p标签添加的id为div1的标签中
    2、设置p标签样式
            var cssStr = "width:400px;height:30px;margin-bottom:10px;background-color:#FFFF99;border:1px solid black;line-height:30px;";  编写样式
            descDiv.style = cssStr;  设置p标签的样式
            descDiv.innerHTML = index+' 这是p标签';  设置标签的文本内容

3）删除标签

基本语法

父级元素.removeChild(子元素);

功能

删除指定元素中的指定的子元素。

示例

  1、给p标签添加点击事件
      descDiv.onclick = function(){
                dell(descDiv);
        };
      descDiv.onclick = function()  给p标签添加点击事件
      dell(descDiv);  执行删除函数
    2、设置删除函数
        function dell(p){
            var obj = document.getElementById("div1");
            obj.removeChild(p);
        }
        var obj = document.getElementById("div1");  获得id为div1的元素
        obj.removeChild(p);  删除指定的p标签