JavaScript 一些 DOM 的知识点

// 为元素添加 2 个内嵌的 CSS 规则varele =document.getElementById("container");// 方法一ele.setAttribute("style","font-size:2em;color:green");// 方法二ele.style.cssText = "font-size:2em;color:green";// 方法三varsty = ele.style;sty.fontSize = "2em";sty.color = "green";

DOM Level 2 Style: ElementCSSInlineStyle.style()

  • 要获取一个元素的所有 CSS 属性,你应该使用 window.getComputedStyle()
// 单纯地调用这个方法,会和上面的 style 属性一样返回一个 CSSStyleDeclaration 对象window.getComputedStyle(ele);// 该方法返回经过叠加计算后的元素的实际样式window.getComputedStyle(ele).fontSize;window.getComputedStyle(ele).color;
  • document.styleSheets: 只读,返回一个由 StyleSheet 对象组成的 StyleSheetList,每个 StyleSheet 对象都是文档中链接或嵌入的样式表( 即内联样式和外联样式,不包括嵌在元素里的样式 )。
// 获取当前文档中样式表的数量document.styleSheets.length;// 禁用第一个样式表document.styleSheets[0].disabled =true;

DOM2 遍历

  • DOM2 中定义了两个用于辅助完成顺序遍历 DOM 结构的类型: NodeIterator TreeWalker 

  • document.createNodeIterator() : 返回一个 NodeIterator 对象