Found 10711 Articles for Web Development

How to find all siblings of currently selected object in jQuery?

Amit D
Updated on 09-Dec-2019 10:42:17

587 Views

To find all siblings of currently selected object in jQuery, use the siblings() method. The siblings( [selector] ) method gets a set of elements containing all of the unique siblings of each of the matched set of elements.Here is the description of all the parameters used by this method −selector − This is optional selector to filter the sibling Elements with.ExampleYou can try to run the following code to learn how to find all siblings:Live Demo           jQuery siblings() method                              $(document).ready(function(){             $("p").siblings('.selected').addClass("highlight");          });                              .highlight {             background:yellow;          }                             Hello       Hello Again       And Again            

What do you understand by jQuery Traversing Siblings?

David Meador
Updated on 09-Dec-2019 10:58:06

63 Views

jQuery traversing siblings  is traverse to find siblings of an elements using jQuery. To traverse sideways in DOM tree, use the following methods:siblings(): This returns all the siblings elements of the selected element.next(): This method returns the next sibling element of the selected element.nextAll(): This method returns all next sibling element of the selected element.nextUntil(): The nextUntil() method returns all next sibling elements between two given arguments.prev():This method returns the previous sibling element of the selected element.prevAll(): This method returns all previous sibling element of the selected elementprevUntil():The prevUntil() method returns all next previous sibling elements between two given arguments.Let’s ... Read More

What is the difference between jQuery.children( ) and jQuery.siblings( ) in jQuery?

David Meador
Updated on 17-Dec-2019 10:23:52

286 Views

jQuery children() methodThe children( [selector] ) method gets a set of elements containing all of the unique immediate children of each of the matched set of elements.Here is the description of all the parameters used by this method −selector − This is an optional argument to filter out all the childrens. If not supplied then all the childrens are selected.ExampleYou can try to run the following code to learn how to work with jQuery children() method:Live Demo           jQuery children() method                          $(document).ready(function(){   ... Read More

What is the difference between jQuery.bind() and jQuery.live() methods in jQuery?

David Meador
Updated on 09-Dec-2019 11:01:57

136 Views

jQuery.bind() methodThe bind() method in jQuery attaches one or more event handlers for the selected elements.Note: The jQuery bind() method deprecated in jQuery.ExampleYou can try to run the following code to learn how to work with bind() method in jQuery:Live Demo $(document).ready(function(){     $("div").bind("click", function(){         alert("Hello World!");     }); }); Click me! I am an alert! jQuery.live() methodThe live( type, fn ) method binds a handler to an event (like click) for all current - and future - matched element. It can also bind ... Read More

How to add the previous element to current jQuery selection?

David Meador
Updated on 09-Dec-2019 10:59:39

479 Views

To add the previous element to current jQuery selection, use the insertBefore() method.ExampleYou can try to run the following code to learn how to work with insertBefore() method:Live Demo $(document).ready(function(){     $("button").click(function(){         $("Demo text").insertBefore("p");     }); }); Insert This is a paragraph.

What is the difference between jQuery.html( ) and jQuery.append( ) methods in jQuery?

David Meador
Updated on 09-Dec-2019 11:05:28

164 Views

jQuery.html() methodThe html() method gets the html contents (innerHTML) of the first matched element. This property is not available on XML documents.ExampleYou can try to run the following code to learn how to work with jQuery.html() method in jQuery:Live Demo           jQuery html() method                          $(document).ready(function() {             $("div").click(function () {                var content = $(this).html();                $("#result").html(content);             });   ... Read More

What is the difference between jQuery.map() and jQuery.each() Functions in jQuery?

David Meador
Updated on 09-Dec-2019 11:12:13

240 Views

jQuery map functionThe map method translates a set of elements in the jQuery object into another set of values in a jQuery array which may, or may not contain elements.ExampleYou can try to run the following code to learn how to work with jQuery.map() method:Live Demo           jQuery Map Method                              $(document).ready(function(){                         var mappedItems = $("li").map(function (index) {                var replacement = ... Read More

How to traverse Data Object Model (DOM) nodes using jQuery?

David Meador
Updated on 18-Dec-2019 07:11:56

244 Views

jQuery traversing is used to find elements based on what is their relation twith other elements. You need to begin with one selection and move ahead till you the reach the elements you want.jQuery is a very powerful tool which provides a variety of DOM traversal methods to help us select elements in a document randomly as well as in sequential method.Let’s filter out the elements by traversing. The filter( selector ) method can be used to filter out all elements from the set of matched elements that do not match the specified selector(s).ExampleThe selector can be written using any ... Read More

What is the difference between jQuery.map() and jQuery.grep() Functions in jQuery?

David Meador
Updated on 17-Dec-2019 10:21:43

378 Views

The jQuery map function translates a set of elements in the jQuery object into another set of values in a jQuery array which may, or may not contain elements. The grep() function is used to find an element of an array. The difference is we use $.grep to filter an array and $.map to apply a function to each item in the array.jQuery map functionThe map method translates a set of elements in the jQuery object into another set of values in a jQuery array which may, or may not contain elements.The following are the parameters of jQuery.map() method:callback − ... Read More

How to filter object array based on attributes in jQuery?

David Meador
Updated on 18-Dec-2019 07:10:59

1K+ Views

To filter object array based on attributes in jQuery, use the map() method with JSON.ExampleYou can try to run the following code to learn how to filter object array based on attributes in jQuery,Live Demo $(document).ready(function(){    $(document).ready(function(){     var json ={"DEPARTMENT": [             {                 "id":"1",                 "deptemp":"840",                 "shares":"1100",                           },             {                 "id":"2",                 "deptemp":"1010",                 "shares":"1900",                   }, {                 "id":"1",                 "deptemp":"350",                 "shares":"510",             },             {                 "id":"2",                 "deptemp":"575",                 "shares":"1900",             }]};            json.DEPARTMENT = $.map(json.DEPARTMENT,function(val,key) {               if(Number(val.deptemp) = 500) return val;            });         for(var i in json.DEPARTMENT)        $("p").html("Department Employees: "+json.DEPARTMENT[i].deptemp+" ,  Shares:"+json.DEPARTMENT[i].shares)     }); });

Advertisements