Shulou(Shulou.com)06/01 Report--

This article mainly introduces jquery how to modify the content of the node, the article introduces in great detail, has a certain reference value, interested friends must read it!

Jquery modify the content of the node method: 1, using text (), you can modify the text content of the node, syntax "node object .text (" new text content ")"; 2, using html (), you can directly rewrite the content of the node, syntax "node object .html (" new node content ")".

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

Jquery modifies the content of a node

Method 1: use text ()

The text () method sets or returns the text content of the selected element.

When this method is used to return content, it returns the text content of all matching elements (the HTML tag is removed).

When this method is used to set content, the contents of all matching elements are overridden.

Example:

$(document) .ready (function () {$("button") .click (function () {$("p"). Text ("Hello world!");}) Modify the text content of all p elements

This is a paragraph.

This is another paragraph.

Method 2: use html ()

The html () method sets or returns the content (innerHTML) of the selected element.

When this method is used to return content, it returns the content of the first matching element.

When this method is used to set content, the contents of all matching elements are overridden.

$(document) .ready (function () {$("button") .click (function () {$("p"). Html ("Hello world!");}) Modify the contents of all P elements

This is a paragraph.

This is another paragraph.

Extended knowledge: comparison between html () and text ()

$(function () {var strHtml = $("p"). Html (); var strText = $("p"). Text (); $("# txt1") .val (strHtml); $("# txt2") .val (strText);})

Html () is: text () is:

As you can see from this example, html () gets all the content inside the element, while text () only gets the text content.

The difference between html () and text () can be clearly compared in the following table.

HTML code html () text () (empty string) these are all the contents of the article "how jquery modifies the content of nodes". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.