如何調用隱藏從jQuery的返回值選擇

我的DOM結構如下：如何調用隱藏從jQuery的返回值選擇

<div class="weather-Dashboard"></div> 
    Dashboard 
    <div class="weather-Charts"> 
     charts 
    </div> 
    <div class="weather-Statistics"> 
     Statistics 
    </div> 
    <div class="weather-Sites"> 
     Sites 
    </div>

我要選擇的每div DOM其類包含weather和使用jQuery隱藏起來。下面是我的JS代碼：

var e = $('div[class *= "weather"]'); 
e.each(function() { 
    console.log(this); 
    this.hide(); 
});

運行此代碼後我得到了以下錯誤：

Uncaught TypeError: this.hide is not a function

似乎this不是一個jQuery對象。我的代碼有什麼問題？我試過如果只有一個DOM匹配查詢，我可以調用e.hide()來隱藏dom。但是，如果存在多個DOM匹配項，則不起作用。

來源

2017-05-26 Zhao Yi

* 「如果只有一個DOM符合查詢條件，我可以調用e.hide（）隱藏DOM」 * - 你可以叫'e.hide（）'隱藏與選擇器匹配的所有元素。 – nnnnnn

問題是因爲this引用了一個沒有hide()方法的DOMElement。你需要一個jQuery對象第一包this：

var e = $('div[class*="weather"]'); 
e.each(function() { 
    $(this).hide(); 
});

但是你要注意，你並不需要一個each()循環在這裏 - 你可以直接在收集調用hide()：

$('div[class*="weather"]').hide();

來源

2017-05-26 09:07:23

內each()方法this引用DOM對象，hide()是一個jQuery方法，因此您需要將其轉換爲jQuery對象。

$(this).hide();

或者乾脆更新display樣式屬性。

this.style.display = 'none';

來源

2017-05-26 09:08:00

var e = $('div[class *= "weather"]'); 
 
e.each(function() { 
 
    $(this).hide(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="weather-Dashboard"></div> 
 
     Dashboard 
 
    <div class="weather-Charts"> 
 
    charts 
 
    </div> 
 
    <div class="weather-Statistics"> 
 
    Statistics 
 
    </div> 
 
    <div class="weather-Sites"> 
 
    Sites 
 
    </div>

來源

2017-05-26 09:08:41

如何調用隱藏從jQuery的返回值選擇

回答

相關問題