Question

我有一个像：

这样的元素

<div class="title">Headquarters<br />
Warehouse</div>

我无法使用CSS隐藏.title中的单词，所以我尝试使用jQuery：

$(function() {
    $('div.title')
    .html($('div.title').html().replace("Headquarters" + "<br />" + "Warehouse", "Test"));
});

但这并没有改变任何事情：http://jsfiddle.net/NAm66/

如何在.title内隐藏“仓库”一词？

Answer 1

替换不起作用<br />是一个html元素而不是字符串。

正如你所做的那样：

$('div.title').empty();

或者如果您想用其他内容替换内容，那么：

$('div.title').html("Test"); //or .text("Test")

或者只是这样做：

$(function () {
    $('div.title').contents().each(function () {
        if(this.nodeType ===3 && this.nodeValue === "Warehouse"){
            this.nodeValue = '';
            return false;
        }
    });
});

或者

$(function () {
    $('div.title').contents().filter(function () {
        return this.nodeType === 3 && this.nodeValue === "Warehouse";
    }).remove();
});

<强> Demo

Answer 2

如果你想隐藏这个元素，我会建议我过去一直在攻击的超小插件。

$.fn.cleartxt=function highlight(c){function e(b,c){var d=0;if(3==b.nodeType){var a=b.data.toUpperCase().indexOf(c);if(0<=a){d=document.createElement("span");d.className="inner";a=b.splitText(a);a.splitText(c.length);var f=a.cloneNode(!0);d.appendChild(f);a.parentNode.replaceChild(d,a);d=1;}}else if(1==b.nodeType&&b.childNodes&&!/(script|style)/i.test(b.tagName))for(a=0;a<b.childNodes.length;++a)a+=e(b.childNodes[a],c);return d}return this.length&&c&&c.length?this.each(function(){e(this,c.toUpperCase())}): this};

然后，只需调用正文 - 或任何元素 - 并隐藏所需的单词。

因此：

$('body').cleartxt("Warehouse")

最后，由于插件用来隐藏文本的内容，它将它包装在带有类.inner的范围内 - 如你所说。因此，我们需要应用可见性：隐藏在.inner：

上

.inner{visibility:hidden}

http://jsfiddle.net/javascript/dps4c/

Answer 3

试试这个

$(function() {
$('div.title').html($('div.title').html().replace("Warehouse","Test"));
 });

用空字符串替换元素的单词

3 个答案: