遍歷DOM時，如何檢查是否到達body元素？

Question

我正在使用類.ui-mobile-viewport從鏈接元素到最接近的元素遍歷DOM。 這可以是DIV或BODY元素。

我需要檢查它是哪個元素，但是卻無濟於事...這就是我正在嘗試的方法：

var targetViewport;

//循環將targetViewport設置為$（'div.ui-mobile-viewport'）或$（'body.ui-mobile-viewport'）

if ( targetViewport === $('body') ) {
   console.log("found a body");
   }

感謝幫助！

Answer 1

您可以嘗試使用jQuery的.closest()方法來代替自己進行遍歷。 因此，我認為您可以這樣做：

var x = $('thing-that-was-clicked').closest('.ui-mobile-viewport');
alert(x.is('body'));
alert(x.is('div'));

現在，您將.ui-mobile-viewport元素作為jQuery對象，可以對它運行任何所需的測試，例如檢查body或div如上面的代碼所示。

Answer 2

您不能比較jQuery集合...您必須實際比較它們的節點，因此假設targetViewport也包含一個jQuery集合，您可以執行此操作

if ( targetViewport[0] === document.body ) {
  console.log("found a body");
}

應該管用...

編輯：如果您喜歡jQuery方式（帶有附加功能調用）

if (targetViewport.is('body')) {
  console.log("found a body");
}

Answer 3

您可以簡單地訪問元素的nodeName。

if (targetViewport[0].nodeName.toUpperCase() === 'BODY') {

}

這樣一來，您無需為檢查執行任何CSS查詢，調用jQuery，並且它不依賴於任何庫。

Answer 4

if(targetViewport[0] === document.body)
if(targetViewport[0].nodeName === 'BODY')

Answer 5

您正在尋找.is()方法 ，該方法檢查a元素是否與選擇器匹配。

if (targetViewport.is('body'))