0

我正在尝试快速修复 wordpress 网站上损坏的内容。问题是其他人创造了汤三明治，我被困在修复它。我有一个元素显示在页面的两个不同部分。第一个是状态后表单，第二次出现是在页面上无限重复的评论添加部分。代码块适用于评论，但不适用于状态表单，所以我不想简单地隐藏它，直到我弄清楚如何 A）找到生成代码的地方，B）修复问题。

该元素具有在元素加载时动态应用的样式（假设为 javascript）。它开始是隐藏的，然后管道下方的某个地方显示它。

这是我的代码的样子，首先是有效的元素：

<div class="activity-comments">
  <div class="audio_controls fresh" style>
    ....
  </div>
</div>

被破坏的块：

<div id="whats-new-post-in-box">
  <div class="audio_controls fresh" style="display: block;">
    ...
  </div>
<div>

因此，在第一个块中，代码中没有样式，出于某种奇怪的原因，编写它的人无论如何都留下了样式标记，没有任何样式可应用（完全愚蠢且格式错误的代码）。但是在第二个元素中，即损坏的元素中，它有一个 display:block 在运行时动态写入。我试图弄清楚如何强制它显示：无。我尝试过 js，但不知何故我没有正确调用它（不知道如何调用嵌套元素，我只想要该嵌套 ID 中的 audio_controls 而不是其他类）。

有人对我有什么想法吗？

4

3 回答 3

5

你可以用 CSS 做到这一点：

#whats-new-post-in-box > .audio_controls.fresh {
    display: none !important;
}

样式规则可以!important覆盖内联样式规则（除非内联样式规则也是 !important）。

或者，在任何现代浏览器上使用 JavaScript ：

var list = document.querySelectorAll("#whats-new-post-in-box .audio_controls.fresh");
var n;
for (n = 0; n < list.length; ++n) {
    list[n].style.display = "none";
}

对于较旧的浏览器，这更痛苦：

var elm = document.getElementById("whats-new-post-in-box").firstChild;
while (elm) {
    if (elm.className &&
        elm.className.match(/\baudio_controls\b/) &&
        elm.className.match(/\bfresh\b/)) {

        elm.style.display = "none";
    }
    elm = elm.nextSibling;
}

显然，对于这两个 JS 解决方案，您需要在首先设置样式之后运行该代码......

于 2013-10-14T17:59:58.873 回答
0

很确定你可以为它编写一个 CSS 规则#whats-new-post-in-box .audio_controls并用!important.

于 2013-10-14T18:00:41.690 回答
0

另一种隐藏内部 div 的方法，这需要 jQuery：

$('div.audio_controls', $('#whats-new-post-in-box')).hide();

此代码选择所有具有audio_controls类的 div 元素，这些元素在 id 为的元素内whats-new-post-in-box，并隐藏它们。

于 2013-10-14T18:07:03.250 回答