Dom内容汇总

      dom:
          获取节点：{
              1、document.getElementById(元素id):通过元素id找到节点
              2、document.getElementsByClassName(元素类名className): 通过class类名找到节点，返回的是一个集合
              3、document.getElementsByTagName(标签名):通过标签名找到节点，返回一个集合  标签名：如<a>\ <p>\ <div> ....
              4、document.getElementsByName(name名): 通过带有name属性的标签元素找到节点返回一个集合，
              5、document.querySelector():通过css选择器进行查找，id class 标签名，如果查找是多个，返回第一个标签元素
              6、document.querySelectorAll():通过css选择器进行查找，id class 标签名;返回的是一个集合
          }


          通过节点属性获取节点：{

              1、firstChild; 父元素.firstChild 获取父元素首个子节点 （包含文本节点 #test）

              2、lastChild：父元素.lastChild  获取父元素最后一个子节点 （包含文本节点 #test）

              3、childNodes：父元素.childNodes 获取父元素所有的子节点 （包含文本节点 #test）

              4、parentNode\parentElement：子节点.parentNode 通过子节点找到父元素

              5、previousSibling：兄弟节点.previousSibling 获取已知节点的前一个节点

              6、nextSibling：兄弟节点.nextSibling 获取已知节点的后一个节点

              7、ownerDocument:属性返回当前节点所在的顶层文档对象(document)

              8、textContent:属性返回当前节点和它的所有后代节点的文本内容  -- - - - 忽略当前节点内部的HTML标签

              9、nodeValue属性返回或设置当前节点的值，格式为字符串；一般只用于Text节点

              10、firstElementChild:返回第一个元素节点

              11、lastElementChild:返回最后一个元素节点

              12、children:返回所有子元素节点（集合）

          }


          创建元素节点：{

              1、createElement(): document.createElement(元素标签)  创建元素节点

              2、createAttribute():document.createAttribute(元素属性) 创建属性节点 <div class="hehehe"></div>

                  setAttributeNode():添加一个属性节点

              3、createTextNode():document.createTextNode(文本内容) 创建文本节点

          }

          判断节点子节点：hasChildNodes():表示当前节点是否有子节点

          插入节点：{

              1、appendChild(): 父元素.appendChild(所添加新节点) 向父元素末尾添加新元素

              2、insertBefore():父元素.insertBefore(所要添加的新节点，将被插入的节点位置) 如果第二个参数为null,所添加的
                  元素插入在末尾

          }

          替换节点：replaceChild（要插入的新节点，将被替换的旧节点）


          复制节点：cloneNode(): {
                  要被复制的节点.cloneNode(true):复制当前节点及所有子节点
                  要被复制的节点.cloneNode(false):仅复制当前节点
          }

          删除节点：removeChild(要删除的节点)：删除指定节点

          contains(): 返回boolean值 表示参数节点是否为当前节点的后代节点  document.body.contains(node);

          isEqualNode():返回boolean值 检查两个节点是否相等
          满足条件：{
              1、类型相同
              2、属性相同
              3、子节点相同
          }

          属性操作：{

              获取属性：getAttribute():

                          元素节点.getAttribute(元素属性名)

              设置属性：setAttribute()

                          元素节点.setAttribute(元素属性名,元素属性值)

              删除属性：removeAttribute()

                          元素节点.removeAttribute(元素属性名);

              检查是否存在的属性名称：hasAttribute()

                          元素节点.hasAttribute(元素属性名);
          }

          style属性{   // background-color --->  backgroundColor

              getPropertyValue(属性名):

              setProperty(属性名,属性值)

              removeProperty(属性名)

              cssText('style') 设置或删除样式

          }


          {  //
              textContent():获取元素的文本内容
              innerText():获取元素的文本内容
              innerHTML():获取元素内容（包含文本、标签元素）
          }


          innerWidth
          innerHeight
          clientWidth    var w= document.documentElement.clientWidth || document.body.clientWidth;
          clientHeight
          offsetWidth
          offsetHeight
          offsetParent
          offsetLeft
          offsetTop


          改变浏览器位置方法：效果是一样的
          1、location.assign('传递一个url');
          2、window.location = '传递一个url';
          3、location.href = '传递一个url'; <常用>


          reload():重新加载当前显示的页面。
          location.reload(false):  // 优先从本地缓存重新加载
          location.reload(true)://优先从服务器重新加载

          document.location.href //返回当前加载页面的URL。
          document.location.protocol // 返回页面使用协议http or https
          document.location.host // 返回主机名称与端口号
          document.location.hostname // 返回主机名称
          document.location.port // 返回url指定端口号，如果不存在则返回空字符串
          document.location.pathname //返回url中的目录或文件名
          document.location.search //返回url中的查询字符串，字符串以问好开始
          document.location.assign('http://www.google.com')// 跳转到另一个网址

?x=1&y=2




          var ss = setInterval(function(){},ms); // 设置定时器
          clearInterval(ss); // 取消定时器