使用 getComputedStyle().getPropertyValue() 获取边框值? (Mozilla、FF)

2023-12-05

在某些浏览器(即 Firefox)中getComputedStyle().getPropertyValue()不报告任何简写 CSS 的内容,例如border。是否有一种非特定代码的方式来获取这些速记 CSS 值?我考虑过制作一个速记 CSS 及其各自的速记 CSS 值的白名单。但我意识到这样做既会很痛苦,而且是不向前兼容的设计。


我想知道,你想用 a 做什么string like border: 1px solid #000?

假设你想重现一个元素border为了复制它copyStyle(el2, el, "border"):

// Copies a set of styles from one element to another.
function copyStyle(dest, source, shorthand) {
  var computed = window.getComputedStyle(source, null);
  for (var i = computed.length; i--;) {
    var property = camelize(computed[i]);
    if (property.indexOf(shorthand) > -1) {
      console.log(property)
      dest.style[property] = computed[property];
    }
  }
}

// prototype.js
function camelize(text) {
  return text.replace(/-+(.)?/g, function (match, chr) {
    return chr ? chr.toUpperCase() : '';
  });
}

可以以相同的方式比较两个元素的给定样式集是否匹配。除此之外,我真的看不到字符串的使用,如果你想用它来计算任何东西,应该解析它。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 getComputedStyle().getPropertyValue() 获取边框值? (Mozilla、FF) 的相关文章

  • 刷新页面后保留输入值

    我有一个带有输入字段的表单 该输入包含一个下拉菜单 从数据库中读取信息 如果用户输入值 并且当他到达下拉菜单时 他没有找到他想要的内容 他会转到另一个页面将此信息添加到下拉菜单 然后转到第一页继续输入信息 如果他转到另一个页面向下拉菜单添加
  • Javascript - 使数组索引 toLowerCase() 不起作用

    我试图将所有数组索引设置为小写字符串 但它不起作用 我在这里查看了其他答案并尝试了他们的解决方案 例如使用toString 添加之前toLowerCase但它不起作用 这很奇怪 我创建了一个问题的jsfiddlehere https jsf
  • jQuery数据表设置列设计和成功回调中的值

    我为我的数据表编写了以下代码 它用我的数据库中的内容填充表 如下所示 if datatable null datatable destroy datatable tableProducts DataTable pageLength 50 b
  • 如何针对 IE 进行优化?

    我有一个 JS 密集型应用程序 它在 IE 中运行缓慢 我将花费大约一周的时间来优化 IE 并且我想要一些关于尝试的方向 我发现这个线程引用Drip https ieleak svn sourceforge net svnroot iele
  • 如何从对象数组中删除所有重复项?

    This is a large array of objects e g let totalArray id rec01dTDP9T4ZtHL4 fields user id 170180717 user name abcdefg even
  • 从 ES6 模块导入函数表达式或函数声明有什么区别?

    据我了解 参见第 16 3 2 1 节 http exploringjs com es6 ch modules html ES6 允许函数 类导出操作数使用不同的语法 区别在于导出的函数是否需要在导入时解释为函数声明 在这种情况下 您可以编
  • 如何将查询参数添加到守卫中的路由并将其传递给 Angular 4 中的组件?

    我在我的 Angular 4 应用程序中使用路由保护 如果条件满足并返回 true 我想向路由添加一个查询参数 这是我一直在研究的代码 Injectable export class ViewGuardService implements
  • 使绝对定位的div扩展父div高度

    正如你在下面的 CSS 中看到的 我想要child2将自己定位在之前child1 这是因为我目前正在开发的网站也应该在移动设备上运行 在移动设备上child2应该位于底部 因为它包含我想要在移动设备上的内容下方的导航 为什么不是 2 个母版
  • 处理时区转换的 JavaScript 库

    是否有一个 JavaScript 库可以处理时区转换 并考虑 DST 规则和此类内容 我知道有类似的问题 但我见过的问题似乎都没有真正适合我的问题的答案 我想在时区 A 创建一个日期并能够对其进行操作 添加天数 小时等 然后将其转换为另一个
  • dc lineChart 单击时弹出数据点信息

    我正在尝试检测折线图数据点上的点击 Per this answer dc scatter plot binding onClick event https stackoverflow com a 22772340 1873386 I am
  • 如何检查侧边栏视图是否已经在主干中渲染?

    通常 用户通过主页进入网站 然后我在那里渲染侧边栏视图 接下来 用户单击链接 路由器呈现另一个视图并替换原始内容视图 侧边栏视图不会重新渲染 当用户在子页面上单击刷新时 侧边栏不会呈现 如何检查视图是否存在并且已渲染 划分责任并坚持下去 不
  • Webpack - 资产大小限制中的警告:以下资产超出了建议的大小限制 (244 KiB)

    当我在生产模式下运行 webpack 时 有资产规模限制 超出 的警告 我怎样才能运行而不出现这个错误 在我的项目中 我包含 css 并且我看到 webpack 构建中包含一些 node module 目录 但是如果我排除 css 的 no
  • Google 地图 Javascript v3 折线点击事件

    我正在尝试显示一张地图 其中有多条路线布置为折线 单击多段线时 我想显示特定于该线的数据 将数据与线关联不是问题 但无论单击哪条线 显示的数据都会与最近绘制的线关联 就好像每条新折线都会覆盖最后一条线一样 我有一个数据库 其中包含 gpx
  • 将屏幕宽度获取到 javascript 变量中并通过 ajax 将其发送到 php 页面以避免页面加载

    这是JS检测我的页面命名上的屏幕分辨率index html并将其发送到 php 以便可以使用以下方式检索值 GET 这是我的PHP文件命名的内容process php
  • GWT - css 中常量的问题

    我是 GWT 新手 我正在构建一个小型示例应用程序 我有几个 CSS 文件 我能够成功使用 ClientBundle 和 CssResource 将样式分配给 UiBinder 脚本中定义的元素 现在我想更进一步 使用 def css ru
  • 带有桌子的嵌套表

    我在应用了表排序器的表中嵌套了表 它在嵌套表中添加了排序标题 但是它们没有对行进行排序 并且抛出了JavaScript错误 我想拥有 嵌套表不可排序 巢表上的排序实际上可以工作 但不是现状 您的第一个选择要容易得多 使嵌套表不可排序 像这样
  • Intern JS - 如何在链式 Command 方法中使用 Promise.all()?

    我是用 Intern JS 编写测试的新手 并且一直在遵循他们的文档来使用对象接口 https theintern github io intern interface object and 页面对象 https theintern git
  • Jquery Ajax 调用返回 403 状态

    我有一个 jquery Ajax 调用来实现会话的 keepalive 这个 keepAlive 方法将每 20 分钟调用一次 function keepAlive ajax type POST url KeepAliveDummy asp
  • Kendo 刷新 (DropDownList.refresh()) 不起作用错误未定义

    我试图在另一个 DropDownList 更改后刷新下拉列表 但 Refresh 方法未定义错误正在升级 我尝试再次读取数据源 它显示它正在加载 但数据仍然相同 帮助解决这个问题请 Code DropDownList1 change fun
  • 为什么 phantomjs 不能在 MacOS Sierra 中工作?

    我们正在使用phantomjs 1 9 1 macosx phantomjs 2 0 0 macosx哪一个工作得很好OS X 埃尔卡皮坦更新后macOS 塞拉利昂它会引发以下错误 phantomjs 1 9 1 macosx phanto

随机推荐