使用javascript隱藏divs

我想隱藏沒有與他們使用JavaScript相關的ID的div。例如，在共享點.ms-globalbreadcrumb中沒有ID。使用javascript隱藏divs

frame = document.getElementById('frame1'); 
frame.contentWindow.document.getElementById('ctl00_PlaceHolderGlobalNavigation_PlaceHolderGlobalNavigationSiteMap_GlobalNavigationSiteMap').style.display='none';

上面的代碼適用於具有ID的部分，但我不知道如何爲其他沒有ID的DIV實現此功能。

感謝，

來源

2011-05-19 elmander

如果你能找到在DOM的div，那麼你應該能夠隱藏起來。例如，如果一個父/祖父母等的div有一個ID，你可以沿着DOM樹走下去，直到找到你想要隱藏的元素。

var elem = document.getElementById("topelement"); 
var elem2 = elem.firstChild.firstChild; 
elem2.style.display = "none";

JQuery有很多選擇器讓這種事情變得簡單。

來源

2011-05-19 12:45:26

使用標準化訪問DOM的東西可以讓你的生活變得更加輕鬆，因此相同的代碼（對於所有內容（表單，事件，對象屬性等）在所有瀏覽器中都可以工作。使用JQuery它只是：

$('div').hide();

隱藏所有div ...並有一個巨大的'selectors'範圍縮小選擇範圍。

來源

2011-05-19 12:46:25 sje397

案例1
如果你想隱藏，沒有ID的所有div，那麼你就必須循環的所有div並隱藏他們基於該標準。（找到與.getElementsByTagName()的div）

var alldivs = document.getElementsByTagName('div'); 
for(var i = 0; i < alldivs.length; i++) {  
     alldivs[i].style.display = "none"; 
    }

案例2
如果你想基於一類找到的元素，就像在你的榜樣的.ms-globalbreadcrumb然後（找到的元素與.getElementsByClassName()類）

var allbyclass = document.getElementsByClassName('ms-globalbreadcrumb'); 
for(var i = 0; i < allbyclass.length; i++) {  
     allbyclass[i].style.display = "none"; 
    }

（的getElementsByClassName將爲IE的預IE9版本）

例如用這兩種情況下在http://jsfiddle.net/gaby/H3nNr/

建議

使用jQuery其允許各種selectors和複雜不起作用traversing的DOM找到你想要的東西..

案例1中的jQuery將$('div:not([id])').hide();
案例2中的jQuery將$('.ms-globalbreadcrumb').hide();

來源

2011-05-19 12:48:10

我使用jQuery 1.5.1分鐘JS使用您提供它似乎並沒有掩蓋它的代碼。任何想法爲什麼？ – elmander 2011-05-19 13:02:21

@elmander，我在jquery examplew中出錯。情況1的例子會隱藏所有的div，而不是沒有'id'的。現在我修復它只選擇那些沒有'ID'。 – 2011-05-19 13:06:21

@elmander，也要確保你在處理div，因爲我們特別針對這些例子中的那些。如果dom中的元素是「span」，它將不會選擇它們。 – 2011-05-19 13:08:10

所以那裏有其他的方法可以使用您可以通過標記名或類讓他們

document.getElementsByClassName 
document.getElementsByTagName

他們返回您需要迭代的元素列表

所以你的例子shud是

var ellements = frame.contentWindow.document 
    .getElementsByClassName("ms-globalbreadcrumb"); 
for(i in ellements) { 
    ellements[i].style.display = "none"; 
}

來源

2011-05-19 12:50:38 megakorre

使用javascript隱藏divs

回答

相關問題