- Trending Categories
- Data Structure
- Networking
- RDBMS
- Operating System
- Java
- MS Excel
- iOS
- HTML
- CSS
- Android
- Python
- C Programming
- C++
- C#
- MongoDB
- MySQL
- Javascript
- PHP
- Physics
- Chemistry
- Biology
- Mathematics
- English
- Economics
- Psychology
- Social Studies
- Fashion Studies
- Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Found 8895 Articles for Front End Technology
150 Views
The .not() is used to select all elements except an element, which can be specified.ExampleYou can try to run the following code to learn how to use .not() with jQuery selector.Live Demo $(document).ready(function(){ $("p:not(.myclass)").css("background-color", "red"); }); Heading This is demo text. This is another text.
401 Views
The empty( ) method remove all child nodes from the set of matched elements whereas the method remove( expr ) method removes all matched elements from the DOM.ExampleYou can try to run the following code to learn how to remove DOM elements in jQuery:Live Demo jQuery Example $(document).ready(function() { $("div").click(function () { $(this).remove( ); }); }); .div{ margin:10px;padding:12px; border:2px solid #666; width:60px;} Click on any square below:
1K+ Views
To enhance the performance of jQuery selector, you need to perform optimization. Here are some of the techniques:Cache SelectorCaching enhances the performance of the application. Cache your jQuery selectors for better performance. This can be done using the ID as your selector. For example, this caches the selector and stores it in variable.var $elm = $("#elm");Instead of using the jQuery ID selector, use the $elm variable:var $elm = $("#elm"); $elm.addClass(‘example’);Use ID selectorjQuery is a JavaScript library. In JavaScript, document.getElementById() is used to select the HTML element, which is the fastest way. Since jQuery is written on top of JavaScript, it ... Read More
759 Views
To get a DOM Element from a jQuery Selector, use the $('#element').get(0). This returns the DOM element.ExampleYou can try to run the following code to learn how to get a DOM Element from a jQuery Selector. For our checkbox example, get a DOM element like the following code:Live Demo $(document).ready(function(){ $(":checkbox").click(function() { if ($(this).is(":checked")) { alert("Checkbox checked!"); } }); });
2K+ Views
To write a jQuery selector for the label of a checkbox, use the for attribute of label element.ExampleYou can try to run the following code to learn how to write a jQuery selector for the label of a checkbox:Live Demo $(document).ready(function(){ $("label[for='mysubjects1']").css("background-color", "yellow"); $("label[for='mysubjects2']").css("background-color", "gray"); }); Subjects New Subjects
250 Views
To use jQuery selectors on custom data attributes, you can use contains, starts with, and ends with for the HTML data attributes.ExampleOther than that, you can try to run the following code to learn how to use jQuery selectors on custom data attributes using HTML5:Live Demo $(document).ready(function(){ //stored selector var group = $('ol[data-group="Subjects"]'); // starts with M var maths = $('[data-subject^="M"]',group).css('color','green'); // contains the string graph var graph = $('[data-subject*="graph"]',group).css('color','blue'); }); Maths Science Geography History
3K+ Views
For getting the id that begins or ends with a particular string in jQuery selectors, you shouldn’t use the wildcards $('#name*'), $('#name%'). Instead use the characters ^and $. The ^ is used is used to get all elements starting with a particular string. The $ is used is used to get all elements ending with a particular string.ExampleYou can try to run the following code to learn how to get id beginning and endingwith a particular string.Live Demo $(document).ready(function(){ $("[id$=new1]").css("background-color", "yellow"); $("[id^=myid]").css("background-color", "green"); }); Java HTML Ruby C++
1K+ Views
To get the elements with an ID that ends with a given string, use attribute selector with $ character.ExampleYou can try to run the following code to learn how to to use jQuery selector for the elements with an ID that ends with a given string. Let’s say we are going for elements with an ID ending with the string “new1”.Live Demo $(document).ready(function(){ $("[id$=new]").css("background-color", "yellow"); }); Java HTML Ruby
71 Views
To get the children of the $(this) selector in jQuery, use the find() method with each() method. Let us first see how to add jQuery:ExampleYou can try to run the following code to get the children of the $(this) selector:Live Demo jQuery Example // Set the click handler on your div $("body").off("click", "#mydiv").on("click", "#mydiv", function() { // Find the image using.find() and .each() $(this).find("img").each(function() { var img = this; }); }); #mydiv { vertical-align: middle; background-color: #Ffff76; cursor: pointer; padding: 20px; }
1K+ Views
Wildcard or regular expressions can also be used with jQuery selector for id of element.ExampleYou can try to run the following code to use wildcard or regular expressions with jQuery selector:Live Demo $(document).ready(function(){ $("[id^=sub]").css("background-color", "green"); }); Java HTML Ruby