Attributes of a tag are useful for passing extra information about the tag, or for interacting with JavaScript. A common HTML tag is the <a> anchor tag, which can have such attributes as href, rel, id, class, title, href lang. Selecting by attribute works well with form fields because you can search inputs by name, type, attribute, class, ID, and so on.
- Selecting Links That Contain a Specific Web Site Address
Using the wildcard with an attribute is a flexible and commonly used filter. The wildcard (*) can be used to search the DOM for any elements that contain a specific value. This selector is very fast: If you were to find all these elements manually, it could take hours. By using the wildcard attribute selector, you can achieve the same result in a matter of seconds.
- Selecting All Elements That End With a Specific Word
Similar to how the wildcard symbol works on attributes, you can use the dollar ($) symbol to select all elements that end with a specifi c string of text. In the following example, I have four divs with unique IDs to which I want to add a common class. Because all of my divs end in the word bird, I can use an attribute selector and select by the last word, as long as it is bird.
<!doctype html>
<html>
<head>
<style>
.bird {border:1px dashed #111;width:220px;margin:2px;}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></
script>
<script>
$(document).ready(function () {
$('div[id$="bird"]').addClass('bird');
});
</script>
<body>
<div id="yellow-bird"></div>
<div id="blue-bird"></div>
<div id="red-bird"></div>
<div id="white-bird"></div>
</body>
</html>
0 comments:
Post a Comment