javascript - 样式 html 元素后跟特定类

Question

我尝试设置以下代码元素的样式:

<code>
<span class="MathJax_Preview"></span>
...
</code>

采用这种风格:

code {font: inherit; font-size: 100%; background: inherit; border: inherit;}

但我只想为这个特定跨度类后面的那些代码元素设置样式。我想让所有其他代码元素保持不变。是否可以通过使用 css、javascript 或 jquery 来做到这一点？

Answer 1

使用 CSS，不可能基于子元素访问父元素。

在 Javascript 中，你可以这样做:

<script type="text/javascript">
  var spans = document.getElementsByClassName('MathJax_Preview');
  for(var i = 0; i < spans.length; i++) {
    if (spans[i].parentNode.tagName == "code") {
      spans[i].parentNode.setAttribute("style", "your style here");
    }
  }
</script>

请注意，如果您只需要这个，则不需要 jQuery。