Как скрыть класс с помощью javascript?

Question

У меня есть текст на странице, его в теге <h3>, который имеет класс ms-standardheader, но есть и другие тексты на странице с тем же классом в своем собственном теге <h3>. Я также знаю, что текст, который я хочу скрыть, это «Сессия».

С этим как я могу написать функцию javascript, чтобы скрыть только этот текст?

Вот изображение developtools от IE.

Answer 1

Я хотел бы предложить, если вы ограничены (как ваши метки предполагают) для небиблиотечного простого 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.

Ссылки:

• push().
• document.getElementsByTagName().
• element.className.
• node.nodeValue.
• indexOf().

Answer 2

Если у вас есть JQuery вы можете ввести следующее:

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

Answer 3

Не можете ли вы указать целевой элемент 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'; 
    } 
} 

Answer 4

вы должны попробовать это:

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/

Answer 5

Всегда пользуйтесь уникальным идентификатором, где это возможно. Если это невозможно, вам нужно вручную пересечь 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/