如果我這樣定義 DIV
<div id='myDiv' style='display:none;'>inner stuff</div>
我可以檢查它的當前顯示值
document.getElementById('myDiv').style.display;
這將回傳一個字串 == 'none'。
但是，如果我通過一個類設定我的顯示樣式，上面的陳述句會回傳一個長度為零的字串。
<style>
.myDivStyle {display:none;}
</style>
<div id='myDiv' class='myDivStyle'>inner stuff</div>
<script>
var x = document.getElementByID('myDiv').style.display == ''; // returns true
</script>
事實上，DIV 在這兩種情況下都是隱藏的，但在后一種情況下，我如何測驗它是否從 javascript 代碼中隱藏（例如 display=none）？
uj5u.com熱心網友回復：
您可以使用getComputedStyle獲取元素上使用的樣式，而不僅僅是樣式屬性。
var styles = getComputedStyle(document.getElementById('myDiv'));
var display = styles.getPropertyValue('display')
console.log(display);.myDivStyle {display:none;}<div id='myDiv' class='myDivStyle'>inner stuff</div>uj5u.com熱心網友回復：
使用window.getComputedStyle獲得的元素的CSS屬性和CSSStyleDeclaration.getPropertyValue獲得的價值display屬性：
<style>
.myDivStyle {display:none;}
</style>
<div id='myDiv' class='myDivStyle'>inner stuff</div>
<script>
var x = window.getComputedStyle(document.getElementById('myDiv')).getPropertyValue("display")
console.log(x)
</script>uj5u.com熱心網友回復：
我通常HTMLElement.hidden用于處理 div 的可見性。為了獲得狀態，您可以像這樣訪問屬性：
var x = document.getElementByID('myDiv').hidden
它將回傳一個布林值，指示元素是否隱藏。
uj5u.com熱心網友回復：
您可以使用以下代碼進行檢查。
if(document.querySelector('.myDivStyle').offsetParent == null)
{
// means element is hidden
}
或者您也可以檢查該元素是否具有導致元素隱藏的特定類。例如
document.querySelector('.hidden').classList.contains('myDivStyle')
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/361478.html
標籤：javascript dom
上一篇：您可以使用輸入值旋轉元素嗎？