如何使用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隱藏類？

回答

相關問題