JavaScript是一種強大的編程語言，它在Web開發中扮演著至關重要的角色。很多時候，在Web開發中我們需要獲取一個div元素，但是這個元素通常會被其他元素覆蓋，導致無法獲取到真實的div。本文將介紹如何通過JavaScript獲取真實的div，并進行詳細的說明。

在使用JavaScript獲取真實的div之前，我們需要了解一些基本的概念。首先，我們需要搞清楚什么是DOM。DOM是文檔對象模型（Document Object Model）的縮寫，它表示HTML頁面或XML文檔的樹形結構。通過DOM，我們可以使用JavaScript來操作HTML頁面或XML文檔中的元素。

// 獲取id為myDiv的元素
var myDiv = document.getElementById("myDiv");    
// 獲取id為myDiv的元素中的子元素a的href屬性值
var aHref = myDiv.getElementsByTagName("a")[0].href;

上面的代碼使用了getElementById和getElementsByTagName方法來獲取元素。但是，在一些情況下，獲取到的元素可能不是我們想要的元素。例如：我們需要獲取某個div中的文本內容，但是該div被其他元素（例如：浮動層、遮罩層等）覆蓋，導致獲取到的div并不是真正的div。這時，我們就需要使用一些技巧來獲取真實的div。

下面是一個示例，展示如何獲取真實的div：

// 獲取到所有的div元素
var divs = document.getElementsByTagName("div");
//循環遍歷每個div元素，判斷是否為真實的div元素
for (var i = 0; i< divs.length; i++) {
var div = divs[i];
var position = window.getComputedStyle(div, null)["position"];
if (position === "relative" || position === "absolute" || position === "fixed") {
//此div為真實的div元素
console.log(div);
}
}

上面的代碼首先通過getElementsByTagName方法獲取到所有的div元素，然后通過循環遍歷每個div元素，判斷是否為真實的div元素。在判斷過程中，我們可以使用getComputedStyle方法來獲取div元素的樣式屬性，然后根據position屬性的值來判斷該元素是否被覆蓋。

除了上面的方法外，還有一些其他的技巧可以幫助我們獲取真實的div元素。

第一種技巧是使用CSS屬性z-index。通過設置元素的z-index值來控制元素的層疊順序。例如，我們可以設置一個很大的z-index值來保證該元素始終位于頂部。

div {
z-index: 9999;
}

第二種技巧是使用JavaScript事件的冒泡機制。我們可以通過事件的冒泡來獲取真實的div元素。例如：

//獲取id為myDiv的元素
var myDiv = document.getElementById("myDiv");
//添加click事件到文檔對象上
document.onclick = function(event) {
var target = event.target || event.srcElement;
//判斷是否為myDiv元素
while (target) {
if (target == myDiv) {
console.log("clicked on myDiv");
break;
}
target = target.parentNode;
}
};

上面的代碼添加了一個click事件到文檔對象上，當用戶點擊頁面時，會自動觸發該事件。在事件處理函數中，我們可以通過event.target或event.srcElement來獲取鼠標點擊的元素，然后通過循環遍歷該元素的parentNode節點，判斷是否為myDiv元素。

總之，獲取真實的div元素是一項比較常見的操作，也是一個非常有用的技能。通過多種技巧的結合，我們可以輕松地獲取到真實的div元素，并進行相應的操作。希望大家在開發中能夠掌握這些技巧并靈活運用。