切换属性选择器CSS javascript

时间:2014-06-27 18:21:28

标签: javascript css svg

我想切换“fill:#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时,它说“Uncaught TypeError:无法读取属性'split'of undefined”...

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

更新1

我将尝试使用此库:https://github.com/Box9/jss

1 个答案:

答案 0 :(得分:0)

我可以通过将属性选择器放在我添加的类中来使用toggleClass。不是尝试将样式添加到现有属性选择中,而是更简单。

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