Home  >  Article  >  Web Front-end  >  How to replace content in tags with jquery

How to replace content in tags with jquery

WBOY
WBOYOriginal
2022-01-14 11:24:124184browse

In jquery, you can use the html() method to replace the content in the tag. The function of this method is to return or set the content of the selected element. When this method is used without setting parameters, the selected element will be returned. The current content of the element, the syntax is "$(element).html("new content")".

How to replace content in tags with jquery

The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.

How jquery replaces the content in the tag

html() method returns or sets the content of the selected element (inner HTML).

If this method does not set parameters, it returns the current content of the selected element.

Return element content

When using this method to return a value, it returns the content of the first matching element.

Syntax

$(selector).html()

Set element content

When you set a value using this method, it overwrites the content of all matching elements.

Syntax

$(selector).html(content)

content Optional. Specifies the new content of the selected element. This parameter can contain HTML tags.

Use functions to set the content of elements

Use functions to set the contents of all matching elements.

Syntax

$(selector).html(function(index,oldcontent))

function(index,oldcontent) specifies a function that returns the new content of the selected element.

index - Optional. Receives the index position of the selector.

oldcontent - Optional. Receives the current contents of the selector.

The example is as follows:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn1").click(function(){
    $("p").html("这是<b>新的</b>内容");
  });
});
</script>
</head>
<body>
<p>这是旧的内容</p>
<p>这也是旧的内容</p>
<button class="btn1">改变 p 元素的内容</button>
</body>
</html>

Output result:

How to replace content in tags with jquery

##After clicking the button:

How to replace content in tags with jquery

Recommended related video tutorials:

jQuery video tutorial

The above is the detailed content of How to replace content in tags with jquery. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn