Some useful JavaScript and jquery fragments to share _jquery

To add a CSS class to the specified element:

Changing the appearance and feel of elements by adding CSS classes is a very clean method, not adding inline styles. Using JQuery, it's easy to do:

$ (' #myelement '). addclass (' MyClass ');

To remove a CSS class from a specified element:

You might think that adding CSS classes is a lot of work, but we also need to know how to remove unwanted CSS classes. The following code can do this:

$ (' #myelement '). Removeclass (' MyClass ');

Detects whether a specified element has a CSS class:

If an application or Web site often involves adding or removing a CSS class for a specified element, it becomes useful to detect whether an element has a CSS class.

$ (ID). Hasclass (Class)

To switch CSS using jQuery:

As we can see, the CSS style of adding or removing elements using jQuery is very simple and convenient. But what if you want to completely remove the entire CSS file and attach a new style file (such as a common page color switch effect)? This is actually quite simple, as the following example shows:

$ (' link[media= ' screen ']. attr (' href ', ' alternative.css ');

Source: http://addyosmani.com/blog/50-jquery-snippets-for-developers/

Append HTML code to an element:

When you need to append some HTML content to an element, the Append () method saves time and effort:

$ (' #lal '). Append (' Sometext ');

Detects whether an element exists:

When working with JavaScript, we often need to check if an element exists. Using the jQuery and length attributes, it is very simple: if the length is 0, the page does not have the element, otherwise the page is used.

if ($ (' img '). length) {  log (' We found IMG elements on the page using ' img ');} else {  log (' No img elements found '); }

Source: http://jqueryfordesigners.com/element-exists/

Gets the parent element of the specified element:

Using the DOM you may need to know the direct parent element of an element. The closest () method will let you know:

var id = $ ("button"). Closest ("Div"). attr ("id");

Source: Http://stackoverflow.com/questions/545978/finding-the-id-of-a-parent-div-using-jquery

Gets the sibling of the element:

The siblings () method used to get the sibling of the element is a handy tool. As the following illustration shows, using this method is very simple:

$ ("div"). Siblings ()

To remove an option from the select list:
When you use a select list, you may need to update the content based on the user's actions. To remove an option from a select list, you can use the following code:

$ ("#selectList option[value= ' 2 ']"). Remove ();

Source: http://calisza.wordpress.com/2009/03/29/6-jquery-snippets-you-can-use-to-manipulate-select-inputs/

Gets the textual content of the list option:

This is useful when you need to quickly detect the options selected by the user from the Select menu.

$ (' #selectList: Selected '). Text ();

Apply the Zebra effect to the table (alternate color):

When using tables, for better readability, the alternate color style is a good solution. Using JQuery, it is easy to do this without any extra HTML tags.

$ ("tr:odd"). AddClass ("odd");

Source: http://web.enavu.com/tutorials/top-10-jquery-snippets-including-jquery-1-4/

To calculate the number of child nodes of an element:

If you want to see how many div child node elements The #foo element contains, the following code will let you know. Simple and effective!

 $ ("#foo > div"). Length 
 
 Source: http://tympanus.net/codrops/2010/01/05/ some-useful-javascript-jquery-snippets/