1134

我怎样才能实现以下目标：

document.all.regTitle.innerHTML = 'Hello World';

使用 jQueryregTitle我的divid 在哪里？

4

14 回答 14

1722 
$("#regTitle").html("Hello World");
于 2009-08-20T23:52:40.197 回答
343

html()函数可以接受 HTML 字符串，并有效地修改.innerHTML属性。

$('#regTitle').html('Hello World');

但是，text()函数会改变指定元素的（文本）值，但保持html结构不变。

$('#regTitle').text('Hello world');
于 2009-08-20T23:52:47.403 回答
79

如果您想要呈现一个 jQuery 对象而不是现有内容：然后只需重置内容并附加新内容。

var itemtoReplaceContentOf = $('#regTitle');
itemtoReplaceContentOf.html('');
newcontent.appendTo(itemtoReplaceContentOf);

或者：

$('#regTitle').empty().append(newcontent);
于 2011-08-11T10:34:11.330 回答
28

这是你的答案：

//This is the setter of the innerHTML property in jQuery
$('#regTitle').html('Hello World');

//This is the getter of the innerHTML property in jQuery
var helloWorld = $('#regTitle').html();
于 2013-11-27T08:03:08.767 回答
12

回答：

$("#regTitle").html('Hello World');

解释：

$相当于jQuery。两者都代表 jQuery 库中的同一个对象。括号内"#regTitle"称为选择器，jQuery 库使用该选择器来识别要将代码应用到的 html DOM（文档对象模型）的哪些元素。#beforeregTitle告诉 jQuery是 DOM 中元素的regTitleid。

从那里，点符号用于调用html函数，该函数将内部 html 替换为您放置在括号之间的任何参数，在本例中为'Hello World'.

于 2016-06-22T02:37:03.617 回答
12

已经有答案给出了如何更改元素的内部 HTML。

但我建议，您应该使用一些动画，如淡出/淡入来更改 HTML，这可以提供更改 HTML 的良好效果，而不是立即更改内部 HTML。

使用动画改变内部 HTML

$('#regTitle').fadeOut(500, function() {
    $(this).html('Hello World!').fadeIn(500);
});

如果你有很多需要这个的函数，那么你可以调用通用函数来改变内部 Html。

function changeInnerHtml(elementPath, newText){
    $(elementPath).fadeOut(500, function() {
        $(this).html(newText).fadeIn(500);
    });
}
于 2016-09-07T16:41:05.340 回答
11

jQuery.html()可用于设置和获取匹配的非空元素 ( innerHTML) 的内容。

var contents = $(element).html();
$(element).html("insert content into element");
于 2014-10-16T12:14:11.380 回答
11

您可以在 jquery 中使用 html 或 text 函数来实现它

$("#regTitle").html("hello world");

或者

$("#regTitle").text("hello world");
于 2017-02-03T06:15:43.737 回答
11

例子 

$( document ).ready(function() {
  $('.msg').html('hello world');
});
    <!DOCTYPE html>
    <html>
      <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>    
      </head>
      <body>
        <div class="msg"></div>
      </body>
    </html>

于 2017-03-17T05:36:48.867 回答
7 
$("#regTitle")[0].innerHTML = 'Hello World';
于 2017-09-21T12:26:52.123 回答
4

只是为了添加一些性能见解。

几年前，我有一个项目，我们在尝试将大型 HTML / 文本设置为各种 HTML 元素时遇到了问题。

看起来，“重新创建”元素并将其注入 DOM 比任何更新 DOM 内容的建议方法都要快得多。

所以像：

var text = "very big content";
$("#regTitle").remove();
$("<div id='regTitle'>" + text + "</div>").appendTo("body");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

应该能让你有更好的表现。我最近没有尝试衡量这一点（这些天浏览器应该很聪明），但如果你正在寻找性能，它可能会有所帮助。

缺点是您将需要做更多工作来保持 DOM 和脚本中的引用指向正确的对象。

于 2018-01-21T15:37:17.733 回答
3

jQuery 很少有处理文本的函数，如果你使用text()一个，它会为你完成这项工作：

$("#regTitle").text("Hello World");

此外，html()如果您有任何html 标签，您也可以使用...

于 2019-01-31T11:38:27.460 回答
3

纯 JS 和最短

纯JS

regTitle.innerHTML = 'Hello World'


regTitle.innerHTML = 'Hello World';
<div id="regTitle"></div>

最短的

$(regTitle).html('Hello World'); 


// note: no quotes around regTitle
$(regTitle).html('Hello World'); 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="regTitle"></div>

于 2020-06-12T08:51:03.907 回答
0 
var abc = document.getElementById("regTitle");
abc.innerHTML = "Hello World";
于 2021-06-22T09:52:00.590 回答