javascript - 切换属性选择器 CSS javascript

标签 javascript css svg

我想切换“填充:#000;”来自 CSS 属性“svg [id^='_']”。

通常我会使用这样的东西,但我不能使用它,因为“svg [id^='_']”不是元素,对吧?

pub.toggleClass = function(el, className) {
  if (el.classList) {
    el.classList.toggle(className);
  } else {
    var classes = el.className.split(' ');
    var existingIndex = classes.indexOf(className);

    if (existingIndex >= 0)
      classes.splice(existingIndex, 1);
    else
      classes.push(className);

    el.className = classes.join(' ');
  }
};

当我尝试 toggleClass 时,它说“未捕获的类型错误:无法读取未定义的属性‘split’”...

我试过这样做:document.styleSheets[1].addRule("svg [id^='_']", 'fill: #000;'); 但是它不能跨浏览器工作,也不能切换...我这么说是因为我觉得有一种更简单的方法可以做到这一点..

更新 1

我要试试这个库:https://github.com/Box9/jss

最佳答案

我可以通过将属性选择器放在我要添加的类中来使用 toggleClass。与其尝试将样式添加到现有的属性选择中,不如这样简单得多。

.monotone [id^='_'] {
    fill: #000;
}

关于javascript - 切换属性选择器 CSS javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24458529/

相关文章:

javascript - 返回 JSON 响应

javascript - 有没有办法触发调用另一个模块中存在 "might"的方法?

php - 将新值附加到 formData 对象时遇到问题

javascript - 添加onclick javascript时html中的输入标签不发送POST变量

html - 如何在客户端重写从服务器获取的 svg 文件?

javascript - 查找网站图标 - 当不在默认位置时

css - 相同的 CSS 规则在按钮和标签上的作用不同

html - 有没有办法使用 CSS 或 HTML 更改表单中字段的大小?

django - 如何在 Wagtail CMS 中为 ImageChooserBlock 添加矢量图像支持?

jquery - 半六边形悬停效果