How to find all button inputs and mark them using jQuery ?
jQuery is a small and fast JavaScript library with a motto: “Write Less And Do More“. To use JQuery you can either download the jquery library on your local machine or include the jquery library in your HTML code.
Keep in mind that before learning JavaScript you have a basic knowledge of HTML, CSS, and JavaScript.
Note: In jQuery button is an extension and not part of the CSS specification. You cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method by using the jquery button.
For better performance: First select the elements using a pure CSS selector and then use .filter(“:button”).
Approach: In this article, we will learn about how to find all button inputs and mark them using javascript. To complete this task by using: button selector in your code.
:button selector: It is used to select all button elements and elements of the type button.
Syntax:
$(":button")Example:
HTML
<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8" /> <style> textarea { height: 35px; } div { color: red; } fieldset { margin: 0; padding: 0; border-width: 0; } .marked { background-color: yellow; border: 3px red solid; } </style> <script src= </script> </head> <body> <h1 style="color: green">GeeksforGeeks</h1> <h3>How to find all button inputs and mark them using jQuery? </h3> <form> <fieldset> <input type="button" value="Input Button" /> <input type="checkbox" /> <input type="file" /> <input type="hidden" /> <input type="image" /> <input type="password" /> <input type="radio" /> <input type="reset" /> <input type="submit" /> <input type="text" /> <select> <option>Option</option> </select> <textarea></textarea> <button>Button</button> </fieldset> </form> <div></div> <script> var input = $(":button").addClass("marked"); $("div").text("Number of button found - " + input.length + "."); // Prevent the form from submitting $("form").submit(function (event) { event.preventDefault(); }); </script> </body></html> |
Output: You can notice that all the button inputs are marked.
Please Login to comment...