dom兼容性问题3 元素操作

/*
var oLi = document.createElement('li');
 
   oUl.appendChild( oLi );
 
};
 
createElement('') : 创建一个dom元素
 
appendChild() : 往一个节点的现有子节点后面追加一个新的子节点。
 
  父级.appendChild( 子节点 );
 
insertBefore()
 
createElement('') : 创建一个dom元素
 
appendChild() : 往一个节点的现有子节点后面追加一个新的子节点。
 
  父级.appendChild( 子节点 );
 
insertBefore() ： 往一个节点的指定现有子节点前面插入一个新的子节点。
 
  父级.insertBefore( 准备插入的子节点，插入到哪个子节点的前面 );
 
removeChild() : 从一个节点里面删除指定的子节点。
 
  父级.removeChild( 准备要删除的子节点 );
 
replaceChild() : 用一个节点替换掉另一个节点里面的指定子节点。
 
  被替换元素的父级.replaceChild( 用来替换的节点，被替换掉的子节点 );
 
  被替换的元素必须是真实存在的节点元素。
 
cloneNode() :  复制一个节点。
 
    被复制的节点.cloneNode( boolean );
      boolean : 指定是否复制所有子孙节点。
        true : 复制所有子孙节点。
        false : 只复制节点本身。
 
    温馨提醒：cloneNode() 只会复制dom结构，而不会复制事件或者通过js添加的属性等。
  appendChild() / insertBefore() / replaceChild() ： 如果操作的对象是一个已经存在在页面中的元素，则是直接移动元素，而并非复制元素。
 
exp:
var oDiv1 = document.getElementById('div1');
var oDiv2 = document.getElementById('div2');
var oBox = document.getElementById('box');
 
document.onclick = function(){
 
    //oBox.appendChild( oDiv1 );
   // oBox.appendChild( oDiv1.cloneNode() );
    //oBox.insertBefore( oDiv1 , oDiv2 );
    oBox.replaceChild( oDiv1 , oDiv2 );
 
};
 
appendChild() / insertBefore() / replaceChild() ： 如果操作的对象是一个已经存在在页面中的元素，则是直接移动元素，而并非复制元素。
 
-----------------------------------------------------
class封装函数
function hasClass( obj , sClass ){
 
  var aClass = obj.className.split(' ');
 
  if( !obj.className )return false;
 
  for(var i=0; i<aClass.length; i++){
    if( aClass[i] == sClass )return true;
  }
 
  return false;
 
}
 
function removeClass( obj , sClass ){
    var aClass = obj.className.split(' ');
 
    if( !obj.className ) return;
 
    for(var i=0; i<aClass.length; i++){
 
      if( aClass[i] == sClass ){
 
        aClass.splice( i , 1 );
        obj.className = aClass.join(' ');
        return;
 
      }  
 
    }
 
}
 
function addClass( obj , sClass ){
 
    var aClass = obj.className.split(' ');
 
    if( !obj.className ){
      obj.className = sClass;
      return;
    }
 
    for(var i=0; i<aClass.length; i++){
      if( aClass[i] == sClass ) return;
    }
 
    obj.className += ' ' + sClass;  
 
}
//获取
 
function getByClass( sClass , parent ){
  var aEles = (parent||document).getElementsByTagName('*');
  var arr = [];
 
  for(var i=0; i<aEles.length; i++){ //查看每一个元素是否满足要求
    var aClass = aEles[i].className.split(' ');
 
    for(var j=0; j<aClass.length; j++){ //查看元素的每一个className
      if( aClass[j] == sClass ){
        arr.push( aEles[i] );
        break;
      }
    }
 
  }
 
  return arr;
 
}
 
*/