javaScript 操作节点(Element)、设置css样式
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
操作节点(Element):
firstElementChild跟firstChild的区别在于, 有Element代表元素,firstElementChild是元素选择器,非元素他是不会选择到的,如文本节点之类的。而firstChild是所有都选择所有节点,包括文本。IE8以上的不支持元素选择器。下面是节点的类型↓
元素节点-1 属性节点-2 文本节点-3 注释节点-8 document-9 DocumentFragment-11这个可以通过节点类型(nodeType)来获取,后期一般用这个来判断该对象是什么类型
节点的常用四个属性:
nodeName → 元素的标签名,以大写形式表示,只读。
nodeName 属性指定节点的节点名称。
如果节点是元素节点,则 nodeName 属性返回标签名。
入股节点是属性节点,则 nodeName 属性返回属性的名称。
对于其他节点类型,nodeName 属性返回不同节点类型的不同名称。
nodeValue → 获取Text节点或Comment节点的文本内容,可读写nodeType 该节点的类型,只读。返回的会根据不同类型返回不同的数值(数值在上面有写)
设置CSS样式:
当我们获取到当前标签或对象时, 可以通过.style后再点出其需要设置的样式,如div. style. backgroundColor="#fff000"
上面这个代表着 直接在页面内设置样式
还可以 通过更改其所属的class来更改其样式(等于直接换了一个css的类选择器一样)
div .className="类选择器的名称";
获取CSS样式:
var catchCSS= div.style.backgroundColor; ←这代表获取当前div的背景颜色,注意:这 只能获取到内联样式的,外部样式无法获取。若是出现IE8以前的版本上面的获取方法会有 兼容性问题。所以可以采用下面的方法进行获取
var catchCSS=div. currentStyle.backgroudColor;
CSS样式中的 display除了可以改变元素为行内元素或者块元素以外,还能将该 对象隐藏(none)
下面是代码例子:
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
7 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)