aを選択する方法：特定のセレクタにないホバー

Question

aの要素に特定のIDがないものを使用したいと思います。たとえば、のは、これが私のHTMLであるとしましょう：

今

<div id="boat"> 
    <a href="#">I'm in a boat! ☻</a> 
</div> 
<a href="#">☹</a> 

、のは私だけボートではありませんa要素のスタイルにしたいとしましょう。私はa:hover:not(#boat a)と似た何かを期待していましたが、悲しいかな、そうではありません。私がしたいことを私がすることができる方法はありますか？

Answer 1

それがに来ますjQueryセレクタa:hoverは、CSS疑似クラス:hoverが適用されているすべてのa要素を選択します（つまり、現在マウスで覆われているa要素）。

これは、代わりにこれを試して、あなたが話している要素を選択し、選択プロセスであり、ないスタイリング選択：

$('a:not(#boat a)') 

DEMO：http://jsfiddle.net/marcuswhybrow/AMWhU/

をホバーした場合jQueryの効果は、あなたが選択した後であればいつものようにイベントをバインドするだけです。

Answer 2

リンクではないことdiv#idは.closest('div#id').length === 0を持つことになりますし、0が偽であるため、これらのリンクのスタイルを次のように、あなたはそれらの反対側に選択することができ以内：

$('a').hover(function(e){ 
    if (!$(this).closest('div#boat').length) { 
     // YOUR CODE HERE 
    } 
}); 

Here's an example.

Answer 3

無効な属性セレクタ（ '！='）を使用できるようです。 （主に）あなたの元のHTMLを考える：JavaScriptコンソールで

<script src="/Users/kburton/Downloads/jquery-1.4.4.min.js"> 
    </script> 
<div id="boat"> 
    <a href="#">I'm in a boat!</a> 
</div> 
<div id='car'> 
    <a href="#">I'm in a car!</a> 
</div> 
<a href="#">I'm not in the boat!</a> 

、ランニング：

$('[id!="boat"] > a') 

は、アンカーの子で、IDが 'ボート' を持たないすべてのノードを検索します。