JQuery Attribute Manipulation

Question

When I search on the Internet about JQuery and I got the jquery cheat sheet. At there, I am very confused about how to use the following under which condition. Pls help me.

[attribute|=val]
[attribute*=val]
[attribute~=val]
[attribute$=val]
[attribute=val]
[attribute!=val]
[attribute^=val]
[attribute]
[attribute1=val1] [attribute2=val2]

What are the functions of these special character *, ~, $, !, ^? Thanks very much.

Answer 1

Refer to the attribute selectors:

• =: equals
• ^: starts with
• $: ends with
• !: not equals
• *: contains
• ~: contains word
• |: contains prefix
• [name]: has attribute name

Your last example can mean one of two things depending on whether it has a space in between or not:

• [attr1=foo][attr2=bar] means find elements that have an attribute attr1 with value foo and attr2 with value bar; but

• [attr1=foo] [attr2=bar] means find elements with attribute attr1 with a value of foo that have descendants with an attribute attr2 with value bar.

The space here makes an important semantic difference in the expression.