JavaScript 7 to get visible window, page elements, access node way

To get visible window object

chrom *document.body

firefox *document.documentElement

Gets the scroll bar offsets

ele.scrollTop

ele.scrollLeft

To get visible window object

var bodyObj=document.documentElement||document.body;

var scrolltop=bodyObj.scrollTop;

Set the scroll bar offsets

bodyObj.scrollTop=123

scrollTop || scrollLeft // provided through the visual window object attribute obtaining offset scrollbar

    setInterval(function(){
        var scrollTop_=bodyObj.scrollTop;
        bodyObj.scrollTop=scrollTop_+10;
    },30);

Dom Operation

1 acquires web page elements (node ​​web page)

ele.getElementById ( 'id attribute value'); only return the first element (same page id values ​​of the two elements can not appear)

ele.getElementsByTagNam ( 'element name'); return all nodes to meet the requirements of the nodes in an array

ele.getElementsByName ( 'name attribute value of') returns all nodes compound required to form an array node

ele.getElementsByClassName ( 'class attribute value ") required to return Notwithstanding the composite node, the node in the form of an array

var box1 = document.getElementById ( 'box1' );
         var boxs = document.getElementsByClassName ( 'Box' );
         var box_tag = document.getElementsByTagName ( 'div' );
         var box_name = document.getElementsByName ( 'BOX3' );
         var Fbox document.getElementsByClassName = ( 'Fbox') [0 ];
         // getElement ............ method call parent element by acquiring element

  　　　　var box1_1=fbox.getElementsByClassName('box');

        var box1_2=fbox.getElementsByTagName('div');

The selector element acquires

querySelector (selector)

querySelectorAll (selector)

 // var boxs=document.querySelector('[name=box3]');
        var boxs=document.querySelector('#box1');
        // var boxs2=document.querySelectorAll('[name=box3]');
        var boxs2=document.querySelectorAll('#box1');

Gets siblings

nextSibling get the next node (node ​​contains text)

nextElementSibling get the next node (not including text)

previousSibling get on a node

previousElementSibling get on a node

Getting child nodes

laseChild Get the last child node elements, text nodes comprising

laseElementChild get the last element in the specified element node. Text nodes are ignored

firstChild Gets the first child element (including text)

firstElementChild Gets the first child element (ignores text)

Gets all the child nodes

childNodes Gets all child nodes of the specified element (comprising a non-element node)

children get all the specified elements (elements) child node

Get the parent element according to sub-elements

  console.log(fbox.parentNode);
    console.log(fbox.parentElement);