difference between ~= and *= in jquery
Few days back, i saw a SO question, that what is the difference between [attribute~=value] and [attribute*=value]?
*= is attributeContains selector , From jquery docs:Selects elements that have the specified attribute with a value containing a given substring. ~= is attributeContainsWord selector , From jquery docs:Selects elements that have the specified attribute with a value containing a given word, delimited by spaces. The attributeContains selector is for the string to be contained in the attribute value while attributeContainsWord selector is for string seperated with delimeted space. The official jquery examples clearly explain it. Attribute Contains Selector [name*="value"]HTML:<input name="man-news"> <input name="milkman"> <input name="letterman2"> <input name="newmilk"> $( "input[name*='man']" ).val( "has man in it!" );  Here is the fiddle demonstrating the Attribute Contains Selector [name*="value"] behavior Attribute Contains Word Selector [name~="value"]HTML:<input name="man-news"> <input name="milk man"> <input name="letterman2"> <input name="newmilk"> $( "input[name~='man']" ).val( "mr. man is in it!" ); OUTPUT:  Here is example demonstrating the behavior of Attribute Contains Word Selector [name~="value"] |
