選擇一個元素和它的兄弟姐妹

切換一個元素，它的兄弟姐妹可以如：選擇一個元素和它的兄弟姐妹

$(this).toggle(); 
$(this).prev().toggle();

，結合它們不起作用：

$(this,$(this).prev()).toggle();

如何既可以在同一時間選擇？

來源

2012-04-22 Gary

順便說一句，雖然這個問題已經answered by drinchev ，我想我會在閱讀這個問題之後，粘貼這個我剛纔做的快速實驗。雖然...它讓我驚訝：

$('#recipient').click(
    function(){ 
     var pair = [this, this.previousElementSibling]; 
     $(pair).toggleClass('red green'); 
    });

3210。

順便提一下，JS Perf loose comparison of the two selector approaches。

編輯添加一個IE-（到目前爲止我所知）友好更新，雖然我目前正在備馬所有瀏覽器都用它，而不是功能檢測（也，我終於明白了藍！=綠色）：

function pESibling(n){ 
    var nPS = n.previousSibling; 
    if (!n || nPS === null){ 
     return false; 
    } 
    else if (nPS.nodeType == 1){ 
     return nPS; 
    } 
    else { 
     return pESibling(nPS); 
    } 
} 

var that = document.getElementById('recipient'), 
    pair = [that, pESibling(that)]; 
$(pair).toggleClass('red green'); 
console.log(pair);

JS Fiddle demo

來源

2012-04-22 16:11:27

網絡的快樂！不，認真..！ =）長話短說[IE <9不'做'previousElementSibling']（http://www.quirksmode.org/dom/w3c_core.html#t84）。儘管如此，還是有一種古老而時尚的「if」方法。 =） – 2012-04-22 16:25:29

測試解決方案時，我犯了一個愚蠢的錯誤。雖然，不，'previousElementSibling'不會做到這一點，只需使用一個數組將會...'$（[$（this），$（this.prev（））]）''做到了！ – Gary 2012-04-22 16:26:55

有一個簡單的方法$（this）.prev（）。andSelf（）。toggle（）; – 2013-04-11 21:32:41

的jQuery 1.8+，使用.addBack()：

$(this).prev().addBack().toggle();

對於早期的jQuery版本，使用已棄用.andSelf()調用（請參閱demo）：

$(this).prev().andSelf().toggle();

來源

2012-04-22 16:04:30 drinchev

的*演示*是錯誤的。答案是在演示使用'parent（）'時使用'prev（）'，這不是OP想要的。 – Pang 2016-12-12 04:16:00

爲上一個兄弟姐妹和自我：

$(this).prev().andSelf().toggle();

所有的兄弟姐妹和自我：

$(this).parent().children().toggle();

來源

2012-04-22 16:48:50 Yuriy

也可以工作：

$(this).prev().add($(this)).toggle()

來源

2014-09-23 08:59:09 mtkopone

選擇一個元素和它的兄弟姐妹

回答

相關問題