Given the following HTML:
<html>…<body><div ”one”><div ”two”><p><span>Some text</span></p></div></div></body></html> $(‘span’).parent() will select the <p> tag such that the element set in the jQuery object is [span]. $(‘span’).parents() will select all parent tags such that the element set in the jQuery object is [p, div.two, div.one, body, html]. So parent() will select the first parent element while parents() will select all elements straight up the DOM tree. Now jQuery has some great flexibility in that you could do that following: $(‘span’).parents().filter(‘div’) which would result in [div.two, div.one]. jQuery makes it even easier as the parent() and parents() methods support filtering built in so the above can be reduced to: $(‘span’).parents(‘div’) giving you [div.two, div.one]. Let’s continue with one more example, let’s say that you only need the first div in the parent DOM tree, jQuery to the rescue $(‘span’).parents(‘div:eq(0)’) will give you [div.two]
0 Comments
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Cross-Domain Ajax & JQuery</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script language="JavaScript"> $(document).ready(function() { $.getJSON('http://twitter.com/users/usejquery.json?callback=?', function(json) { //get information about the user usejquery from twitter api $('#twitter_followers').text(json.followers_count); //get the follower_count from the json object and put it in a span }); }); </script> </head> <body> Twitter Followers: <span id="twitter_followers">Loading...</span> </body> </html> In terms of functionality, there is no difference between the jQuery-x.x.x.js and jQuery-x.x.x-min.js (also called minified version). However this can play a vital role in the performance of the web page.
How it affects the performance? jQuery-1.4.4.js file size is 178 KB as against its minified version jQuery-1.4.4-min.js that is only 76.7 KB in size. So when your page loads in the client?s browser if you are not using minified version, it loads 178 KB file that takes more time to load than 76.7 KB. To select all elements in a page, we can use all selectors, for that we need to use *(asterisk symbol).
<script language="javascript" > $("*").css("border", "2px dotted red"); </script> JQuery is Java Script library or Java Script Framework which helps in how to traverse HTML documents, do some cool animations, and add Ajax interaction to any web page. It mainly helps programmer to reduce lines of code as huge code written in Java Script, can be done easily with JQuery in few lines.
Dollar Sign is nothing but it's an alias for JQuery. Take a look at below jQuery code
$(document).ready(function(){ }); Over here $ sign can be replaced with "jQuery " keyword. jQuery(document).ready(function(){ }); |