- 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 766 Articles for JQuery
677 Views
To get value from the first checkbox, which is not hidden, use the :visible selector. Following is the code −Example Live Demo >Document .notShown { display: none; } var v=$('input:checkbox:checked:visible:first').val(); console.log(v); To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.This will produce the following output displaying the visible value “second” in console −
2K+ Views
To store and retrieve arrays into and from data attributes, use the data() method in jQuery. Following is the syntax −var anyVariableName= $('#yourIdName).data('yourJavscriptArrayName');Following is the jQuery code −Example Live Demo Document var value = $('#test').data('details'); alert(value); To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.OutputThis will produce the following output −
196 Views
Cypress can work on JQuery objects and call its methods. Thus Cypress can act upon both Cypress and non- Cypress commands. Cypress is asynchronous in nature. It is handled by resolving promises for every Cypress command. This whole process is taken care of by Cypress internally and wrapped and hidden from the end user.However while dealing with JQuery methods, the promise cannot be resolved internally by Cypress and we need to manually resolve them with the help of the then() method in the code.Let us take the example of text() method which is a non-Cypress command and is based on ... Read More
101 Views
To add options to a , you need to use append(). Following is the JavaScript code −Example Live Demo Document Book TV var mySelection = new Option("Mobile", "Samsung Mobile"); $(mySelection).html("Samsung Mobile"); $("#selectCategory").append(mySelection); To run the above program, save the file name anyName.html(index.html) and right-click on the file and select the option open with live server in VS Code editor.Output
3K+ Views
For this, you need to use attr(). The attr() method can be used to either fetch the value of an attribute from the first element in the matched set or set attribute values onto all matched elements.Following is the JavaScript code −Example Live Demo Document $('#myURL').attr('value', 'http://www.facebook.com'); To run the above program, just save the file name anyName.html(index.html) and right click on the file and select the option open with live server in VSCode Editor.OutputLook at the above sample output the URL has been changed ... Read More
926 Views
Both bootstrap and jquery are used in web development and primarily for the frontend development. As code of bootstrap and jquery majorly executed at client end so also responsible for style and look and feel of the UI.Mostly every application is being developed on two platforms i.e backend and frontend in which backend is developed by high level language such as JAVA, DOT NET etc. while frontend has been developed by client end language such as BOOTSTRAP, JQUERY etc.Following are the important differences between Bootstrap and JQuerySr. No.KeyBootstrapJQuery1DefinitionBootstrap is basically a framework developed by Twitter used for frontend web development ... Read More
96 Views
The get() method in jQuery is used to get the DOM elements matched by the selector.SyntaxThe syntax is as follows −$(selector).get(index)Above, the index specifies which of the matching elements to get.Let us now see an example to implement the jQuery get() method −Example Live Demo $(document).ready(function(){ $("button").click(function(){ var res = $("li").get(2); $("span").text(res.innerHTML); }); }); Devices TV Laptop Headphone Earphone SSD 3rd li element OutputThis will produce the following output −Now, click on the button −ExampleLet ... Read More
123 Views
The each() method in jQuery is used to execute a function for each matched element.SyntaxThe syntax is as follows −$(selector).each(function(index, ele))Above, the index is the position of the selector, whereas ele is the current element.Let us now see an example to implement the jQuery each() method −Example Live Demo $(document).ready(function(){ $("button").click(function(){ $("li").each(function(){ alert($(this).text()) }); }); }); Devices TV Laptop Headphone Earphone SSD Get each element OutputThis will produce the ... Read More
281 Views
The length property in jQuery is used to get the number of elements in the jQuery object.SyntaxThe syntax is as follows −$(selector).lengthExampleLet us now see an example to implement the jQuery length property − Live Demo $(document).ready(function(){ $("button").click(function(){ document.getElementById("demo").innerHTML = "Count = " + $("li").length }); }); Devices TV Laptop Headphone Earphone SSD Count of li OutputThis will produce the following output −Click “Count of li” to get the number of li elements −
199 Views
To traverse and find ancestors of an element, jQuery has the following methods: parent(), parents() and parentsUntil()−parent() methodThe parent() method in jQuery is used to return the direct parent element of the selected element. Let us see an example −Example Live Demo div { width:600px; } .demo * { display: block; border: 2px solid yellow; color: blue; padding: 10px; margin: 10px; } $(document).ready(function(){ $("span").parent().css({"color": "blue", "border": "3px dashed blue"}); }); great-great-grandparent great-grandparent grandparent parent span OutputThis will produce ... Read More