js小功能

获取非行内样式（兼容问题）

  function getStyle(obj,attr){             //获取非行间样式，obj是对象，attr是值

        if(obj.currentStyle){                //针对ie获取非行间样式

            return obj.currentStyle[attr];

        }else{

            return getComputedStyle(obj,false)[attr];   //针对非ie

        };

    };

 

 

offsetWidth／offsetHeight／offsetLeft／offsetTop

 

    offsetParent：获取元素的最近的具有定位属性（absolute或者relative）的父级元素。如果都没有则返回body

 

    offsetLeft：获取元素相对具有定位属性的父级元素的左侧偏移距离

 

    offsetTop：获取元素相对就有定位属性的父级元素的顶部偏移距离

 

    scrollLeft/scrollTop：滚动条最顶端和窗口中可见内容的最顶端之间的距离

 

    clientWidth/clientHeight：元素视窗宽度/高度

 

    offsetWidth/offsetHeight：元素实际宽度/高度

DOM元素的基本操作（增／删／改／查）

    查询：选择器；

 

    创建：createElement()  配合  appendChild()    将创建好的元素，插入到某个标签内的最后

 

    删除：removeChild()  配合  parentNode

                元素.remove()    直接删除当前元素

 

    document.body.removeChild(div)；

 

    修改: outerHTML

    oh1.outerHTML = "<h2>" + oh1.innerHTML +"</h2>"

    

 

    补充：创建文本节点createTextNode(“hello”)

         使用方式同createElement()

childNodes／过滤空白节点

    通过 对象.childNodes 获得所有子节点的集合

 

    节点属性 nodeType 返回值为数值

                节点类型(nodeType)    节点名字(nodeName)    节点值(nodeValue)

       元素节点         1                  标签名                 null

       文本节点         3                  #text                 文本

       注释节点         8                 #comment             注释的文字

       文档节点         9                 #document              null

       属性节点         2                  属性名                属性值

 

  DOM中的选择器

 

    1.getElementById(id)        //获取指定元素的ID元素

    

    2.getElementsByTagName()    //获取相同元素的节点列表，通过标签名选择元素，返回值是一个数组

 

    3.getElementsByName()       //通过name值获取元素，返回值是数组，通常用来获取有name的input的值

 

    4.getElementsByClassName()  //通过class名获取元素，返回值是数组n

 

frames对象：包含当前页面所有的框架信息。

             frames.length;                  //返回当前页面的框架数量

             frames[0].location;             //修改第一个框架的地址

screen对象：包含当前显示屏信息

             screen.width/height             //屏幕总宽高度

             screen.availWidth/availHeight   //屏幕的宽高（不包括任务栏）