如何使用javascript隐藏类？

我在页面上有文字，它的<h3>标签有ms-standardheader的类别，但页面上还有其他文字，在<h3>标签中有相同的类别。我也知道我想隐藏的文字是'会话'。如何使用javascript隐藏类？

有了这个我怎么写一个javascript函数来隐藏这个文本？

这里是来自IE的开发工具的图像。

enter image description here

2012-03-29 sneaky

我上面加一个pictire给你看。另外我还没有尝试过任何东西，因为我不知道该怎么尝试。 – sneaky 2012-03-29 18:09:01

我建议，如果你限制（如您的标签建议）以非图书馆普通的JavaScript，以下：

var h3s = document.getElementsByTagName('h3'), 
    classedH3 = []; 

for (var i = 0, len = h3s.length; i < len; i++) { 
    if (h3s[i].className.indexOf('ms-standardheader') > -1) { 
     classedH3.push(h3s[i]); 
    } 
} 

for (var i = 0, len = classedH3.length; i < len; i++) { 
    if (classedH3[i].firstChild.nodeValue == 'the text to hide'){ 
     classedH3[i].style.display = 'none'; 
    } 
}

JS Fiddle demo。

参考文献：

来源

2012-03-29 18:07:52

这会出错。你不能在* NodeList *上调用'getElementsByClassName'。 – Quentin 2012-03-29 18:08:28

这没有奏效。 – sneaky 2012-03-29 18:16:56

它不会;不知何故，当我写出答案时，我的思绪就会滑落。在JS小提琴中测试时，我可能会记得光明的一面。但是......也许不是。谢谢！ =）@sneaky：看到现在编辑的答案。它应该可以工作，但如果您使用的是IE，可能需要进行调整。 – 2012-03-29 18:17:58

如果您有jQuery的你可能会输入：

$("h3.ms-standardheader:contains('Session')").hide();

来源

2012-03-29 18:06:46

不幸的是我没有jquery。 – sneaky 2012-03-29 18:09:19

所以你必须自己执行搜索。一见钟情，bfvaretto的代码似乎是正确的。 – 2012-03-29 18:12:54

胡？为什么这会倒退？我是第一个回答，我做出了正确的回答，这是怎么回事？ – 2012-03-30 07:15:24

你不能给目标元素一个ID吗？这会让事情变得更简单。否则，你必须去通过所有<h3>元素，直到你找到你想要隐藏的一个：

var headings = document.getElementsByTagName("h3"); 
for(var i=0; i<headings.length; i++) { 
    var contentElement = headings[i].getElementsByTagName('nobr'); 
    var content = ""; 
    if(contentElement.length) { 
     content = contentElement[0].textContent ? contentElement[0].textContent : contentElement[0].innerText; 
    } 
    var content = contentElement.length ? contentElement[0].childNodes[0].nodeValue : ''; 
    if(headings[i].className == 'ms-standardheader' && content == 'Session') { 
     headings[i].style.display = 'none'; 
    } 
}

来源

2012-03-29 18:08:35 bfavaretto

我添加了上面的图片，可能会让你改变代码你放，正弦这没有工作。此外，我不能编辑页面，我只能添加CSS和/或JavaScript到它... – sneaky 2012-03-29 18:12:30

@sneaky，是的，请尝试更新的代码上面 – bfavaretto 2012-03-29 18:24:43

它仍然无法正常工作。 ;（我只是没有看到什么问题... – sneaky 2012-03-29 18:28:27

你应该试试这个：

window.onload = function() 
    { 
     getElementByClass('ms-standardheader'); 
    } 

window.getElementByClass = function(theClass){ 

var allHTMLTags=document.getElementsByTagName('*'); 

    for (i=0; i<allHTMLTags.length; i++) { 
     if (allHTMLTags[i].className==theClass) { 
       var content = allHTMLTags[i].innerHTML; 
       var search = /session/; 
       if (search.test(content)) 
        { 
        alert(search); 
        allHTMLTags[i].style.display='none';  
        } 
      } 
     } 
}

见演示：http://jsfiddle.net/3ETpf/18/

来源

2012-03-29 18:38:38 Jigs

这没有工作 – sneaky 2012-03-29 18:51:21

始终在可能的情况下赞成独特的ID。如果不可能，那么你必须手动遍历DOM来找到你正在寻找的元素。以下是使用getElementsByTagName()的示例。

var i, header, headers = document.getElementsByTagName('h3'); 

for (i = 0; i < headers.length; i += 1) { 
    header = headers[i]; 
    if (header.className === 'ms-standardheader' && 
      (header.textContent || header.innerText) === 'Session') { 
     header.style.display = 'none'; 
    } 
}

见：http://jsfiddle.net/whP5z/

来源

2012-03-29 18:41:42

大声笑没有工作... – sneaky 2012-03-29 18:52:41

如何使用javascript隐藏类？

回答

相关问题