如何從HTML DOM完全隱藏div？

我在我的頁面有2個div，每個div都有class a，b。我也有2個網址如何從HTML DOM完全隱藏div？

www.site.com/a
www.site.com/b

目標：我想隱藏div與b上課的時候我在現場/ a ，反之亦然。

目標是將它們完全從DOM中隱藏起來。我不知道該怎麼做。

我已經試過

var lastSegment = location.pathname.split('/').pop(); 

if (lastSegment === 'a') { 

    $(".a").removeClass("hidden"); 

} else { 

    $(".b").removeClass("hidden"); 

}

CSS

.hidden { 
    display: none!important; 
    visibility: hidden!important; 
}

HTML

<div class="a hidden"> // Logic </div> 
<div class="b hidden"> // Logic </div>

結果

我可以看到兩者的div當我做檢查的元素。

任何幫助/提示/在此建議，將通過多添加和刪除類的讚賞

來源

2015-07-18 ihue

如果您已經在使用jQuery，則最簡單的方法就是使用$（.a）.hide（），而不是手動操作類和css。 – doldt

如果您不想在DOM中使用div，那麼您爲什麼要在標記中使用它？ – Amit

你是否在文件加載後運行js？ –

jQuery的.detach()正在這樣做。

的.detach（）方法是一樣的一個.remove（），不同之處在於.detach（）保持與移除的元件相關聯的所有的jQuery的數據。此方法在稍後將已移除的元素重新插入到 DOM中時非常有用。

來源

2015-07-18 22:05:28 knitevision

你不能擺脫對DOM。有多種方法可以解決這個問題。

使用Javascript完全添加/刪除div。不要同時渲染。

if(lastSegment === "a") { 
    $(".target").append('<div class="a">Link A</div>'); 
} 
else { 
$(".target").append('<div class="a">Link B</div>'); 
}

用暗影DOM - ShadowDom元件未被檢查元素，除非使埋藏在內心深處的設置圖標一些設置可見。

教程：http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/ 感謝

來源

2015-07-18 21:21:48

我真的不明白你的答案。你能告訴我更多關於這個「完全使用Javascript添加/刪除div，不要同時渲染」。？ – ihue

你的第二個完全失去了我。 – ihue

我編輯了答案..謝謝 –

你可以試試這個

if (lastSegment === 'a') { 

    $(".a").removeClass("hidden"); 
    $(".b").addClass("hidden"); 

} else { 

    $(".a").addClass("hidden"); 
    $(".b").removeClass("hidden"); 


}

來源

2015-07-18 21:23:30 abs

所以你建議，我應該添加'隱藏'類，因爲我去的基礎上的網址，正確的。 – ihue

這會從DOM中移除嗎？ – ihue

不，這不會刪除表單DOM。需要使用.remove（）方法將其刪除 – abs

這裏：

var lastSegment = location.pathname.split('/').pop(); 

    if (lastSegment === 'a') { 
     $(".b").remove(); 
    } else { 
     $(".a").remove(); 
    }

您可以使用remove（）函數完全刪除它。

來源

2015-07-18 21:24:04

真的，我們可以做到這一點。如果它有效，那將會很棒。 – ihue

該死的，夥計，你救了我的命。這是工作！確認!! – ihue

如何從HTML DOM完全隱藏div？

回答

相關問題