切換顯示：沒有JavaScript的所有標記（沒有jQuery）沒有類：是否有可能？

我讀過類似的職位，但我只找到一處說，添加類到HTML做我想做什麼，所以，基本上我有一個按鈕，當我要點擊它隱藏所有代碼的HTML代碼，以及我再次點擊它顯示它們。由於我在頁面中有很多代碼標籤，因此需要爲每個代碼添加一個類。我一直這樣一些事情切換顯示：沒有JavaScript的所有標記（沒有jQuery）沒有類：是否有可能？

if(document.getElementsByTagName("CODE").style.display === "block"){ 
document.getElementsByTagName("CODE").style.display = "none" 
}

和一些解決這個問題，所有類似的代碼，但他們都要麼讓我的瀏覽器崩潰或無法正常工作。我的問題是，是否真的必須使用類名稱並檢查它可以比較的類名稱，因爲我在代碼上面「做了」，所有標籤的顯示內容？（也許循環與每個元素for循環，我也試過，沒有結果。）我嘗試了每一個可能的事情，到目前爲止我還有一些知識（即時通訊仍在學習javascript）。我真的想知道，如果我正在嘗試做一些真正先進的事情，或者我不知道如何做到這一點。

謝謝你，我希望有wasnt這樣一個問題，我讀過的所有建議的人，沒有（除了一個是說要用類）的是這樣的。

他們都建議加課，所以我覺得像我嘗試做一些真正是不可能的。我還沒有進入jQuery，所以請不要談論它，謝謝。（首先我必須學會良好的JavaScript）

來源

2013-06-02 Elias Zan

document.getElementsByTagName（），作爲功能提示名稱，返回元素的數組，所以你需要遍歷它使檢查和設定值 – ekstrakt

你必須通過document.getElementsByTagName("CODE")結果迭代，這是一個類似數組的變量。這是一個jQuery功能，可讓您將.css()寫入對象列表並將它們全部處理完畢。你需要像

ar = document.getElementsByTagName("code"); 
for (i = 0; i < ar.length; ++i) 
    ar[i].style.display = "none";

如果你需要切換code知名度，使用此代碼

ar = document.getElementsByTagName("code"); 
for (i = 0; i < ar.length; ++i) 
{ 
    if(ar[i].style.display != "none") //the element is visible 
    { 
     ar[i].style.display = "none"; 
    } 
    else 
    { 
     ar[i].style.display = "block"; //If you need to make it block explicitly, otherwise "" 
    } 
}

注意，style.display財產最初是空的，默認爲inline爲code標籤，但可以明確地設置爲其他值。將其重置爲''會導致恢復狀態。

如果您需要更改的知名度來回無顯示模式的修改，你需要保存先前的模式（code標籤不僅可以在block模式顯示）。可以做這樣的：

ar = document.getElementsByTagName("code"); 
for (i = 0; i < ar.length; ++i) 
{ 
    if(ar[i].style.display != "none") //the element is visible, "" or "blocK" or some other value 
    { 
     ar[i].saved_display = ar[i].style.display; //Save the display mode to a new property of the tag 
     ar[i].style.display = "none"; //And hide the element 
    } 
    else 
    { 
     if (typeof ar[i].saved_display === "undefined") //It's the first time we see the element. Display it in default mode 
     ar[i].style.display = ""; 
     else 
     ar[i].style.display = ar[i].saved_display; //We know how the element was shown before we hid it, restoring 
    } 
}

來源

2013-06-02 22:07:13 Aneri

從技術上講，這是一個類似數組，而不是一個數組。不同之處在於大多數數組方法不存在。 –

'ar = document.getElementsByTagName（「code」）;對於（i = 0; i

我修改了我的答案。是的，從技術上講，'getElementsByTagName'的結果是不是一個數組和缺乏在這裏最有用的方法--' forEach（）'。 – Aneri

由於Aneri說，getElementsByTagName返回NodeList，您可以通過指數迭代。

注意，顯示財產只有當它被明確設置的值，它不會繼承CSS的值，所以你應該做類似下面的，這將隱藏所有代碼元素，如果他們的顯示器不是招」牛逼被設置爲無並顯示出來，如果它具有：

var element, elements = document.getElementsByTagName("CODE"); 

for (var i=0, iLen=elements.length; i<iLen; i++) { 
    element = elements[i]; 

    // If element hasn't been hidden, hide it 
    if (element.style.display == '') { 
    element.style.display = 'none'; 

    // Otherwise show it 
    } else { 
    element.style.display = ''; 
    } 
}

請注意，您應該返回將顯示值「」（空字符串），這樣的元素返回到其默認或繼承的值，這可能不是「阻止」。

此外，子元素將隱藏，如果他們的父元素有顯示：無。

來源

2013-06-02 22:21:33 RobG

謝謝，我選擇了另一個人，因爲他是第一個，但你的答案也是有效的。我受到CSS因素的欺騙。下次我會分析一切，試圖解決問題。非常感謝你。 –

您可以只爲BODY或HTML元素添加一個班級，並通過如下方式將所需樣式添加到此班級中。上下文選擇器。例如：

HTML.hide-code CODE {display: none; }

來源

2013-06-02 22:36:08

切換顯示：沒有JavaScript的所有標記（沒有jQuery）沒有類：是否有可能？

回答

相關問題