上一篇文章谈到了两种获取样式的方法。
1.通过直接访问样式对象
2.通过getAttribute方法
这两种方法都不能获得用户代理或样式表设置的样式值。今天,我将讨论一种跨浏览器获取所有DOM相关样式值的方法。
一、跨浏览器方式
currentStyle对象是一个特定于IE的对象。它包含一个元素的所有支持的和可用的CSS属性的***。它需要camel表示格式的值。
例如:fontFamily而不是font-family
所以,在这里,如果是支持这个对象的浏览器调用,就用CSSPROP。
从代码中可以看出,其他浏览器使用window.getComputedStyle方法。也可以通过
document . default view . getcomputedstyle访问该方法,该方法接受两个参数,一个元素和一个伪元素,后者通常是空(或一个空string ””)。
二。获取属性的优先级
其实它可以获取所有DOM相关的样式属性,所以肯定有优先级的问题。
<style> #elem{font-size:23px;}</style><input id ="elem" style="font-size:18px;"/>elem.style.fontSize = '12px';console.log(getStyle(elem, "fontSize", "font-size"))// 输出12px
当同时在几个地方设置一个属性时,总是会从头开始使用getStyle方法,这一点要高度关注。
getStyle值的优先级为:
1.动态设置
2.内嵌设置
3.样式表设置
4.浏览器的默认设置
本文来自长街旧人投稿,不代表舒华文档立场,如若转载,请注明出处:https://www.chinashuhua.cn/24/506307.html