What is the function of html method in jquery
Today, I would like to share with you the relevant knowledge of what function the html method has achieved in jquery. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article. Let's take a look.
Function: 1, return element content, syntax "element object .html ()"; 2, set element content, syntax "element object .html (new content of element)"; 3, use function to set element content, syntax "element object .html (function (index location of selector, current content of selector)".
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
What are the functions of html method in jquery
1. Return the element content
When you use this method to return a value, it returns the contents of the first matching element.
Grammar
(selector) .html ()
Examples are as follows:
$(document) .ready (function () {$(".btn1") .click (function () {alert ($("p"). Html ();});})
This is a paragraph.
Change the content of p element
Output result:
After clicking the button:
2. Set element content
When you use this method to set a value, it overwrites the contents of all matching elements.
Grammar
$(selector) .html (content)
Content is optional. Specifies the new content of the selected element. This parameter can contain a HTML tag.
Examples are as follows:
$(document) .ready (function () {$(".btn1") .click (function () {$("p"). Html ("Hello world!");})
This is a paragraph.
This is another paragraph.
Change the content of p element
Output result:
After clicking the button:
3. Use the function to set the element content
Use the function to set the contents of all matching elements.
Grammar
$(selector) .html (function (index,oldcontent))
Parameter description
Function (index,oldcontent)
Specifies a function that returns the new contents of the selected element.
Index-optional. The index location of the receive selector.
Oldcontent-optional. Receives the current contents of the selector.
Examples are as follows:
$(document) .ready (function () {$("button") .click (function () {$("p") .html (the index of the p element function (n) {return "is:" + n;});})
This is a paragraph.
This is another paragraph.
Change the content of p element
Output result:
After clicking the button:
These are all the contents of the article "what does the html method in jquery achieve?" Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.