Found 730 Articles for JQuery

jQuery Misc toArray() Method

AmitDiwan
Updated on 31-Dec-2019 09:14:34

139 Views

The toArray() method in jQuery is used to get all the DOM elements contained in the jQuery set, as an arraySyntaxThe syntax is as follows −$(selector).toArray()Let us now see an example to implement the jQuery toArray() method −Example Live Demo    $(document).ready(function(){       $("button").click(function(){          var arr = $("p").toArray()          for (var k = 0; i< arr.length; k++) {             alert(arr[k].innerHTML);          }       });    }); Devices This is demo text 1. This is demo text ... Read More

jQuery is() Method

AmitDiwan
Updated on 31-Dec-2019 09:11:50

293 Views

The is() method in jQuery is used to check whether one of the selected elements matches the value in parameter selectorEle.SyntaxThe syntax is as follows −$(selector).is(selectorElement, func(index, element))Above, selectorEle is a selector expression, element or jQuery object to match with the current set of the element. The func parameter is used to specify a function to run for the group of selected elements.ExampleLet us now see an example to implement the jQuery is() method − Live Demo div {    width:600px; } .demo * {    display: block;    border: 2px solid yellow;    color: blue;    padding: ... Read More

jQuery removeProp() with Examples

AmitDiwan
Updated on 31-Dec-2019 08:18:43

196 Views

The removeProp() method in jQuery is used to remove a property set by the prop() method.SyntaxThe syntax is as follows −$(selector).removeProp(property)Above, the parameter property is the name of the property to remove.ExampleLet us now see an example to implement the jQuery removeProp() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          var $val = $("div");          $val.prop("font-size", "1.6em");          $val.append("Property value = " + $val.prop("font-size"));          $val.removeProp("font-size");          $val.append("Property removed successfully...");       });    }); Adding ... Read More

jQuery data() with Examples

AmitDiwan
Updated on 31-Dec-2019 08:15:54

623 Views

The data() method in jQuery is used to attach data to or gets data from selected elements.SyntaxThe syntax is as follows −$(selector).data(name) $(selector).data(name, value)Above, the name is the name of data to retrieve for the 1st syntax.For the 2nd syntax, the name is the name of data to set, whereas value is the value of data to set.ExampleLet us now see an example to implement the jQuery data() method − Live Demo    $(document).ready(function(){       $(".button1").click(function(){          $("div").data("student", "Jack Sparrow");          alert("Student Name = " +$("div").data("student"));       }); ... Read More

jQuery index() with examples

AmitDiwan
Updated on 31-Dec-2019 08:13:05

271 Views

The index() method in jQuery is used to return the index position of specified elements relative to other specified elements.SyntaxThe syntax is as follows −$(selector).index()ExampleLet us now see an example to implement the jQuery index() method − Live Demo    $(document).ready(function(){       $("li").click(function(){          document.getElementById("demo").innerHTML = $(this).index();       });    }); Devices TV Laptop Headphone Earphone SSD Index = OutputThis will produce the following output −Now, to get the index of any of the list items, just click on it as shown below. We clicked “Headphone” here −

jQuery toggleClass() with Examples

AmitDiwan
Updated on 31-Dec-2019 08:10:40

292 Views

The toggleClass() method in jQuery is used to toggle between adding or removing one or more classes from selected elements.SyntaxThe syntax is as follows −$(selector).toggleClass(classname, func(index, currentclass), switch)Above, class name specifies one or more class names to add or remove, whereas func is a function that returns one or more class names to add or remove.ExampleLet us now see an example to implement the jQuery toggleClass() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          $("p").toggleClass("demo");       });    }); .demo {    background-color: orange;    color: white;   ... Read More

jQuery removeData() with Examples

AmitDiwan
Updated on 31-Dec-2019 08:07:33

143 Views

The removeData() method in jQuery is used to remove the data set with the data() method.SyntaxThe syntax is as follows −$(selector).removeData(name)Above, the name parameter is used to specify the name of the data to remove.ExampleLet us now see an example to implement the jQuery removeData() method − Live Demo    $(document).ready(function(){       $(".button1").click(function(){          $("div").data("student", "Jack Sparrow");          alert("Student Name = " +$("div").data("student"));       });       $(".button2").click(function(){          $("div").removeData("student");          alert("Student Name = " +$("div").data("Jack Sparrow"));       }); ... Read More

jQuery replaceAll() with Examples

AmitDiwan
Updated on 31-Dec-2019 08:01:41

245 Views

The replaceAll() method in jQuery is used to replace selected elements with new HTML elements.SyntaxThe syntax is as follows −$(content).replaceAll(selector)Above, the content parameter is the content to insert, whereas the selector specifies which elements to be replaced.ExampleLet us now see an example to implement the jQuery replaceAll() method − Live Demo    $(document).ready(function(){       $("button").click(function(){          $("New Heading").replaceAll("h2");       });    }); div {    margin: 10px;    width: 60%;    border: 2px dashed orange;    padding: 5px;    text-align:justify; } Demo Heading 1 Demo ... Read More

jQuery Effect show() Method

AmitDiwan
Updated on 31-Dec-2019 07:58:16

360 Views

The show() method in jQuery is used to display the hidden element.SyntaxThe syntax is as follows −$(selector).show(speed, easing, callback)Above, the parameter speed is the speed of the show effect, whereas easing is the speed of the element in different points of the animation. The callback function is a function that executes after the show() method completes.Let us now see an example to implement the jQuery show() method −Example Live Demo    $(document).ready(function(){       $(".btnhide").click(function(){          $("p").hide();       });       $(".btnshow").click(function(){          $("p").show();       }); ... Read More

jQuery element ~ siblings Selector

AmitDiwan
Updated on 31-Dec-2019 07:46:45

153 Views

The element ~ siblings selector in jQuery is used to select all elements that are siblings of the specified "element".SyntaxThe syntax is as follows −("ele ~ siblings")Above, the parameter ele is any valid selector, whereas siblings are the siblings of the ele parameter.ExampleLet us now see an example to implement the jQuery element ~ siblings selector − Live Demo    $(document).ready(function(){       $("div ~ p").css("color", "orange");    }); div {    border:1px solid black;    padding:10px; } Demo Heading This is demo text. span outside p element This is demo text. ... Read More

Advertisements