当前位置: 首页 > 面试题库 >

在JavaScript中获取元素样式表样式

利稳
2023-03-14
问题内容

我一直在使用getStylePro JavaScript Techniques的John Resig 函数来获取元素的样式:

function getStyle(elem, name) {
    // J/S Pro Techniques p136
    if (elem.style[name]) {
        return elem.style[name];
    } else if (elem.currentStyle) {
        return elem.currentStyle[name];
    }
    else if (document.defaultView && document.defaultView.getComputedStyle) {
        name = name.replace(/([A-Z])/g, "-$1");
        name = name.toLowerCase();
        s = document.defaultView.getComputedStyle(elem, "");
        return s && s.getPropertyValue(name);
    } else {
        return null;
    }
}

是否可以仅获取样式表指定的元素样式(如果样式未定义,则返回null)?

更新:

为什么我需要这样的野兽?我正在构建一个允许用户设置元素样式的小组件。一个可应用的样式是text-align- ,,left
-使用无样式元素默认。这使得无法确定元素是居中还是因为用户希望居中,还是因为这是默认样式而居中。center``right``getStyle``center


问题答案:

是否可以仅获取样式表指定的元素样式(如果样式未定义,则返回null)?

这实际上就是您所提供的例程所完成的。问题是,在大多数情况下,大多数样式 不是 未定义的-它们是由各个浏览器的内部样式表继承和/或定义的。

您可以花费大量的精力来遍历定义当前样式的 所有 规则,在文档当前视图中的 所有
样式表中,针对存在问题的元素对其进行评估,如果没有适用的话…并且如果没有应用于父项(或不继承此特定样式)…则认为它未定义。这将是缓慢的,
令人难以置信的 容易出错。我不建议尝试。

也许您最好退后一步,然后问您为什么会需要这样的东西?



 类似资料:
  • 本文向大家介绍原生javascript获取元素样式,包括了原生javascript获取元素样式的使用技巧和注意事项,需要的朋友参考一下 摘要:     我们在开发过程中经常会遇到通过js获取或者改变DOM元素的样式,方法有很多,比如:通过更改DOM元素的class。现在我们讨论原生js来获取DOM元素的CSS样式,注意是获取不是设置     在开始之前先说下获取最终应用在元素上的所有CSS属性对象

  • 本文向大家介绍javascript获取元素的计算样式,包括了javascript获取元素的计算样式的使用技巧和注意事项,需要的朋友参考一下 背景 使用css控制页面有4种方式,分别为行内样式(内联样式)、内嵌式、链接式、导入式。 行内样式(内联样式)即写在html标签中的style属性中,如 <div style="width:100px;height:100px;"></div> 内嵌样式即写在

  • 返回指定元素的CSS规则的值。 使用 Window.getComputedStyle() 获取指定元素的CSS规则的值。 const getStyle = (el, ruleName) => getComputedStyle(el)[ruleName]; getStyle(document.querySelector('p'), 'font-size'); // '16px'

  • 问题内容: 我想: 查找页面中所有元素的样式属性(例如:具有的所有元素) 更改所有属性(例如从到)。 您对此有何建议? 问题答案: 我的建议是尽可能避免这样做。而是使用类来分配颜色值,然后可以使用该类而不是颜色值来查找元素。 据我所知,没有可用于查询 特定 样式值的选择器(即使在CSS3中也是如此),这意味着循环遍历所有元素(或者看起来可以将其限制为具有属性的所有元素)并看着财产。现在,问题是,即

  • 问题内容: 我正在寻找一种从样式标签中设置了样式的元素中检索样式的方法。 在身体里 我正在寻找不使用库的直接javascript。 我尝试了以下操作,但始终收到空白: 我注意到,如果我已使用javascript设置了样式,但无法使用样式标签,则只能使用以上内容。 问题答案: 该属性仅让您知道在该元素中定义为内联的CSS属性(以编程方式或在元素的style属性中定义),应该获取计算出的style。

  • 问题内容: 是否可以使用JavaScript获取对象的所有样式?就像是: 问题答案: 在上一篇文章中,这是一个函数: 如何使用它: CSS: JS: