jquery Modify/Append/delete content examples in HTML Web pages

Last Update:2017-01-13 Source: Internet

Author: User

Tags button type

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

The

$ (selector). HTML (content)
HTML () function changes the content of the matched HTML element (InnerHTML).

code is as follows	copy code
< Html> <script type= "Text/javascript" src= "/jquery/jquery.js" ></SCRIPT> < Script type= "Text/javascript" $ (document). Ready (function () { $ ("button"). Click (function () { $ ("P"). HTML ("eiege.com--jquery column"); }); }); </script> <body> <p>this is A paragraph.</p> <p>this is another paragraph.</p> <button type= "button" > click here </ Button> </body>

The append () function appends content to the matching HTML element.

The code is as follows	Copy Code
<script type= "Text/javascript" src= "/jquery/jquery.js" ></script> <script type= "Text/javascript" > $ (document). Ready (function () { $ ("button"). Click (function () { $ ("P"). Append ("<B>EIEGE.COM</B>."); }); }); </script> <body> <p>this is a paragraph.</p> <p>this is another paragraph.</p> <button type= "button" > click here </button> </body>

$ (selector). prepend (content)
The prepend () function presets the contents of the matching HTML element internally (prepend).

The code is as follows	Copy Code
$ ("P"). prepend (www.111cn.net);

$ (selector). After (content)
The After () function inserts HTML content after all the matching elements.

code is as follows

copy code

< Html>
<script type= "Text/javascript" src= "/jquery/jquery.js" ></SCRIPT>
< Script type= "Text/javascript"
$ (document). Ready (function () {
$ ("button"). Click (function () {
$ ("P"). After ("eiege.com");
});
});
</script>

<body>
<p> This is a paragraph.</p>
<p>this is another paragraph.</p>
<button type= "button" > click here & Lt;/button>
</body>

Some methods are appropriate for both XML documents and HTML documents, except for: HTML ().

Method description
AddClass () adds the specified class name to the matching element.
After () inserts the content after the matching element.
Append () appends content to a matching element.
Appendto () appends content to a matching element.
attr () Sets or returns the properties and values of the matching element.
Before () inserts the content before each matching element.
Clone () Creates a copy of the matching element collection.
Detach () Removes a collection of matching elements from the DOM.
Empty () deletes all the child nodes in the matching collection of elements.
Hasclass () checks to see if the matching element has the specified class.
HTML () Sets or returns the HTML content in a matching collection of elements.
InsertAfter () inserts the matching element behind another specified set of elements.
InsertBefore () inserts the matching element in front of another specified set of elements.
Prepend () The content is placed in front of each matching element.
Prependto () The content is placed in front of each matching element.
Remove () removes all matching elements.
Removeattr () removes the specified attribute from all matching elements.
Removeclass () deletes all or specified classes from all matching elements.
ReplaceAll () Replaces all matching elements with matching elements.
ReplaceWith () replaces the matching element with the new content.
Text () Sets or returns the contents of the matching element.
Toggleclass () Adds or deletes a class from a matching element.
Unwrap () removes and replaces the parent element of the specified element.
Val () Sets or returns the value of the matching element.
Wrap () wraps the matching element with the specified content or element.
Wrapall () wraps all matching elements in the specified content or element.
Wrapinner () wraps the child contents of each matching element with the specified content or element.

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More