Question

我在下面有一些文字（16门课程）。我只需要隐藏这个文本，但无论我尝试使用jquery，我都无法隐藏它。有人可以提供任何帮助，所以我可以隐藏在这个文本上吗？

<div id="programAttributes">
    <div class="left" id="credits">
       <h3>Credits</h3>
       <h3 class="cost">48</h3>
       (16 Courses)
    </div>
    <div class="gutter12 left">&nbsp;</div>
    <div class="left" id="costPer">
       <h3>Cost Per Credit</h3>     
       <h3 class="cost">$300</h3>                            
    </div>
</div>

我想如果我能写出类似这样的东西可以解决问题，但我到目前为止还不成功。

$("#credits:not([class!=h3])").hide();

Answer 1

<强>用法

// hides in the whole document
hideText("(16 Courses)");

// only hide inside a specific element
hideText("(16 Courses)", $('#programAttributes'));

// make it visible again
showText("(16 Courses)");

[See it in action]

<强> CSS

.hiddenText { display:none; }

Javascript

// escape by Colin Snover
RegExp.escape = function(text) {
    return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
}

function hideText(term, base) {
  base = base || document.body;
  var re = new RegExp("(" + RegExp.escape(term) + ")", "gi");
  var replacement = "<span class='hiddenText'>" + term + "</span>";
  $("*", base).contents().each( function(i, el) {
    if (el.nodeType === 3) {
      var data = el.data || el.textContent || el.innerText;
      if (data = data.replace(re, replacement)) {
        var wrapper = $("<span>").html(data);
        $(el).before(wrapper.contents()).remove();
      }
    }
  });
}

function showText(term, base) {
  var text = document.createTextNode(term);
  $('span.hiddenText', base).each(function () {
    this.parentNode.replaceChild(text.cloneNode(false), this);
  });
}

Answer 2

您可以检查并删除这样的文本节点：

$("#credits").contents().filter(function() {
  if(this.nodeType == 3) 
    this.parentNode.removeChild(this);
});

You can test it here，这会使.contents()获取所有节点（包括文本节点），然后我们循环，如果它是文本节点（.nodeType == 3）然后我们删除它。

Answer 3

你可以将它包装在一个单独的范围内，然后执行：

$('#credits span').hide();

？

Answer 4

尝试在文本中包装文本，如下所示：

<div class="left" id="credits">
   <h3>Credits</h3>
   <h3 class="cost">48</h3>
   <span id="toHide">(16 Courses)</span>
</div>

然后你可以使用jquery：

$("#credits > span)").hide();

hide（）函数必须应用于DOM元素。

Answer 5

我会在文本周围使用标签标签，以便我可以使用jquery处理它。

Answer 6

这是textnode。循环通过所有父节点，如果它的类型是textnode，则隐藏它。另见：

How do I select text nodes with jQuery?

当没有类时，Jquery隐藏类

6 个答案:

[See it in action]