(转)DHTML DOM 常用js函数整理

来源:互联网 发布:按键精灵手机助手 mac 编辑:程序博客网 时间:2024/05/19 09:11

1.测试是否是IE
var isIE = document.all && window.external; (据说是比较安全的做法)
2.event 对像(这个比较简单,只列出常用的属性)。
  event 对像保存的是上一次事件发生的状态,常用的属性有
   clientX、clientY   事件发生时鼠标指针的坐标。(返回值为数值)
   button 哪个鼠标按键被点击(IE:1|4|2   左|中|右,非IE:0|1|2  左|中|右) 
   altKey、ctrlKey、shiftKey     ;  哪个键被按下了
    srcElement、target  触发事件的节点(元素),前者为IE,后者为非IE。
   toElement、 fromElement 移入鼠标的元素、移出鼠标的元素(mouseover 和 mouseout 事件,只IE适用)
    relatedTarget   对于 mouseover 事件来说,该属性是鼠标指针移到目标节点 上时所离开的那个节点。对于 mouseout 事件来说,该属性是离开目标时,鼠标指针进入的节点。(非IE适用)
   x,y       事件发生的位置的 x 坐标和 y 坐标,它们相对于用CSS动态定位的最内层包容元素
   type      事件类型(mousemove,mouseover等)
3.获取节点
  oElement = document . getElementById ( sID )
  oElements = document . getElementsByName ( sName )
  arrElements = object . getElementsByTagName ( sTagName )
  oElements = object . tags ( sTagName ) sTagname 为标记名,如 "table"、"div"
  oElement = document . elementFromPoint ( iX , iY )    iX 、iY 提供的坐标是客户区坐标,客户区的左上角为 (0,0)。
  IE下还可以用 document.all.id 或 document.all("id")方法获取节点
   
4.节点(element)操作
  4.1 创建节点 oElement=document.createElement(节点类型)
  4.2 添加节点(把节点加入到DOM链)
     1. oElement = 父节点.appendChild (新创建的节点)
     2. 父节点.applyElement(新创建的节点,sWhere)
    其中sWhere取值为 outside|inside ; 
    outside:默认值。将 oElement 添加为 object 的父对象。
    inside:将 oElement 添加为 object 的子对象。
    但 oElement 将成为 object 的原所有子对象的父对象。
     3. oElement = object . insertAdjacentElement ( sWhere , oElement )   
       插入邻近节点,sWhere 取值
       beforeBegin : 将 oElement 插到 object 的开始标签之前。
       afterBegin  : 将 oElement 插到 object 的开始标签之后。但是在 object 的所有原有内容之前。
       beforeEnd   : 将 oElement 插到 object 的结束标签之前。但是在 object 的所有原有内容之后。
       afterEnd    : 将 oElement 插到 object 的结束标签之后。
     4. oElement = object . insertBefore ( oNewNode , oChildNode )   
插入到某个子节点(oChildNod)前面,oChildNode可为空,此时插入到最后一个子节点后面黄
  4.3 删除节点 
     1. 节点数组.remove(节点索引)   从节点数组中删除对应节点索引的对象。
     2.  object.removeNode(bRemoveChildren)  删除object节点,bRemoveChildren是否删除子节点
     3. object.removeChild(子节点) 删除子节点
  4.4 替换节点
     1. oElement = object . replaceNode ( oNewNode )
     2. oElement = object . replaceChild ( oNewNode , oChild )
  4.5 交换节点
     object . swapNode ( oNode )   object 与 oNode 交换
  4.6 复制节点
     oElement = object . cloneNode ( bCloneChildren )   bCloneChildren 是否包括子节点
   4.7 是否包含节点 
     bFound = object . contains ( oElement )   返回是否object包含oElement
  4.8 是否有子节点
     bChildNodes = object . hasChildNodes()
  4.9 Select下的Options操作
     添加   oSelect.options.add (option,iIndex)
5.节点属性操作
  object . setAttribute ( sName , vValue , iFlags )  sName,属性名;iFlags,0|1,是否区分大小写
  vAttrValue = object . getAttribute ( sAttrName , iFlags )   iFlags,0|1,是否区分大小写
  bSuccess = object . removeAttribute ( sName,iCaseSensitive )   iCaseSensitive,0|1,是否区分大小写
  object . clearAttributes ()   清除所有持久性属性
  object . mergeAttributes ( oSource , bPreserve )   从oSource复制所有可读写属性到object,若bPreserve为true不复制id,name
6.窗口操作
  popup . show ( iX , iY , iWidth , iHeight , oElement )
  oPopup = window . createPopup ( vArgs )
  popup . hide ()
   bConfirmed = window . confirm ( sMessage )
  oNewWindow = window . open ( sURL , sName , sFeatures , bReplace )
  vReturnValue = window . showModalDialog ( sURL , vArguments , sFeatures )
  vReturnValue = window . showModelessDialog ( sURL , vArguments , sFeatures )
  window . resizeBy ( iX , iY )
  window . resizeTo ( iWidth , iHeight )  
7.其它常用
  location . assign ( sURL ) 加载一个新的HTML文档到当前窗口。(同location="sURL")
  object . blur () 失去焦点
  object . focus () 焦点
  object . click () 模拟点击
  window . close () 关闭窗口
  bSuccess = object . execCommand ( sCommand , bUserInterface , vValue ) 执行命令,常用的命令有copy、paste、Delete、Cut、Unselect、SelectAll、SaveAs、print
另:
<div id='objtable'>
</div>
删除所有子节点
function resetMerchan(){
    var objt=document.getElementById(9;objtable');
    while(objt.firstChild)
    {
     objt.removeChild(objt.firstChild);
    }
    count=0;
    objt = null;
}

原创粉丝点击