Found 766 Articles for JQuery

What is the difference between text() and html() in jQuery?

David Meador
Updated on 14-Feb-2020 05:18:33

353 Views

jQuery comes with a lot of methods to manipulate attributes. These are DOM related methods. The attributes include, text() and html() too,text() – This method sets or returns the text content of elements selected.html() – This method sets or returns the content of elements selected.ExampleYou can try to run the following code to learn how to manipulate attributes with text() and html() methods −Live Demo $(document).ready(function(){    $("#button1").click(function(){       alert("Using text()- " + $("#demo").text());    });    $("#button2").click(function(){       alert("Using html()- " + $("#demo").html());    }); }); This is demo text. Text HTML

How to get text contents of all matched elements using jQuery?

David Meador
Updated on 14-Feb-2020 05:15:22

308 Views

To get the text contents of all matched elements using jQuery, use the text() method. You can try to run the following code to get text contents of all matched elements using jQuery −ExampleLive Demo           The Selector Example                          $(document).ready(function() {            $("#button1").click(function(){              var content = $("#pid2").text();              alert(content);            });          });                            .red {          color:red;        }        .green {          color:green;        }                         This is first paragraph.       This is second paragraph.       Get    

How to get content of div which contains JavaScript script blocks?

Ricky Barnes
Updated on 27-Jun-2022 06:49:00

2K+ Views

To get the content of div which contains JavaScript script blocks, use the html() method. You can try to run the following code to get the content. With html(), get the content of div, which includes the JavaScript script.ExampleLive Demo                            $(document).ready(function(){            $("#button1").click(function(){              alert($("#demo").html());              });          });                                This is demo text.                       This is JavaScript                        Get    

How to get innerHTML of a div tag using jQuery?

Ricky Barnes
Updated on 14-Feb-2020 05:11:51

3K+ Views

To get the innerHTML of a div tag in jQuery, use the class with innerHTML. You can try to run the following code to learn how to get innerHTML of a div tag using jQuery −ExampleLive Demo  $(document).ready(function(){    $("#button1").click(function(){      var one = $('.a').innerHTML;      alert(one);    });  });    Value one    Get

How to replace innerHTML of a div tag using jQuery?

Ricky Barnes
Updated on 14-Feb-2020 05:10:41

2K+ Views

To replace innerHTML of a div tag, use the html() method. The dot notation calls the html() method to replace the inner html with  the parameter placed between, i.e. Demo here. The html() here modifies the .innerhtml.ExampleYou can try to run the following code to to replace innerHTML of a div tag using jQuery −Live Demo          $( document ).ready(function() {        $('.myclass').html('Demo');      });  Hello World

What does html() method do in jQuery?

Ricky Barnes
Updated on 14-Feb-2020 05:09:35

82 Views

The html() method sets or returns the content of elements selected. jQuery has a some methods to manipulate attributes, including the html() method. These are DOM related methods. The attributes include, text() – This method sets or returns the text content of elements selected.html() – This method sets or returns the content of elements selected.val() – This method sets or returns the value of form fields.ExampleYou can try to run the following code to learn how to work with html() method −Live Demo $(document).ready(function(){     $("#button1").click(function(){         alert("Using text- " + $("#demo").text()); ... Read More

How to toggle between two classes in jQuery?

Ricky Barnes
Updated on 14-Feb-2020 05:07:17

650 Views

To toggle between two classes in jQuery, use the addClass() and removeClass() method. You can try to run the following code to toggle between two classes in jQuery −ExampleLive Demo                          $(document).ready(function(){           $("a").click(function(){              $("a.active").removeClass("active");              $(this).addClass("active");           });          });                      .active {             font-size: 22px;            }                     One       Two       Click any of the link above and you can see the changes.    

How to remove all CSS classes using jQuery?

Ricky Barnes
Updated on 06-Dec-2019 10:33:52

4K+ Views

To remove all classes, use the removeClass() method with no parameters. This will remove all of the item's classes.ExampleYou can try to run the following code to remove all CSS classes using jQuery:Live Demo           jQuery Selector                          $(document).ready(function() {            $("#button1").click(function(){              $("p").removeClass();            });          });                              .red { color:red; }          .blue { color:blue; }                         This is first paragraph.       This is second paragraph.       Remove    

How to check if an element has a class in jQuery?

Alex Onsman
Updated on 14-Feb-2020 05:05:27

356 Views

The hasClass() method is used to check if an element has a class in jQuery. jQuery is a JavaScript library introduced to make development with JavaScript easier. It reduces the development timeExampleYou can try to run the following code to check if an element has a class in jQuery −Live Demo                          $(document).ready(function(){             $("button").click(function(){                alert($("h1").hasClass("myclass"));             });          });                      .myclass {          color: blue;          }                     Heading       This is demo text.       Check: The h1 element has 'myclass' class?    

What is the difference between $(window).load() and $(document).ready() functions in jQuery?

David Meador
Updated on 13-Jun-2020 11:54:24

3K+ Views

Both the methods are used in jQuery. Let’s see what purpose they fulfill.$(window).load()The code which gets included inside $( window ).on( "load", function() { ... }) runs only once the entire page is ready (not only DOM).Note: The load() method deprecated in jQuery version 1.8. It was completely removed in version 3.0. To see its working, add jQuery version for CDN before 3.0.$(document).ready()The ready() method is used to make a function available after the document is loaded. Whatever code you write inside the $( document ).ready() method will run once the page DOM is ready to execute JavaScript code.You can ... Read More

Advertisements