DOM操作之--元素的创建,添加,删除

在页面创建元素

 

var t1 = document.createElement( "h1" );

t1.textContent = "这是通过js设置的标题" ;

document.body.appendChild(t1);

  // createElement创建一个元素对象，参数是要创建的元素名字，返回值是创建的元素对象

// 元素对象，appendChild方法表示为这个元素添加一个子元素，参数是要添加的子元素对象，被添加的子元素会排列在最后

创建ul与li
 

var ul = document.getElementById( "list" );

var l1 = document.createElement( "li" );

l1.textContent = "这里添加一个li" ;

ul.appendChild(l1);

 

插入元素

// 为元素对象添加一个子元素，插入到另一个元素之前，第一个参数表示要添加的元素对象，第二个元素表示添加在谁之前

ul.insertBefore(li, li2);

删除元素

// 元素对象.remove方法：从DOM对象中删除这个元素

// ul.remove();

 

// 删除元素对象的某个子元素

document.body.removeChild(ul);