Respostas:
A função html () pode receber cadeias de caracteres de HTML e modificará efetivamente a .innerHTML
propriedade.
$('#regTitle').html('Hello World');
No entanto, a função text () alterará o valor (texto) do elemento especificado, mas manterá a html
estrutura.
$('#regTitle').text('Hello world');
text()
é diferente como: Unlike the .html() method, .text() can be used in both XML and HTML documents.
. Além disso, de acordo com stackoverflow.com/questions/1910794/... , jQuery.html() treats the string as HTML, jQuery.text() treats the content as text
.
Se você possui um objeto jquery que deseja renderizar em vez do conteúdo existente: basta redefinir o conteúdo e anexar o novo.
var itemtoReplaceContentOf = $('#regTitle');
itemtoReplaceContentOf.html('');
newcontent.appendTo(itemtoReplaceContentOf);
Ou:
$('#regTitle').empty().append(newcontent);
itemtoReplaceContentOf.empty();
newcontent
um objeto jQuery? Isto não está claro.
htmlString
ou Element
ou Text
ou Array
ou jQuery
conforme api.jquery.com/append
Aqui está a sua resposta:
//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();
Responda:
$("#regTitle").html('Hello World');
Explicação:
$
é equivalente a jQuery
. Ambos representam o mesmo objeto na biblioteca jQuery. O "#regTitle"
interior dos parênteses é chamado seletor usado pela biblioteca jQuery para identificar a quais elementos do DOM html (Document Object Model) html você deseja aplicar o código. O #
anterior regTitle
está dizendo ao jQuery que regTitle
é o ID de um elemento dentro do DOM.
A partir daí, a notação de ponto é usada para chamar a função html , que substitui o html interno por qualquer parâmetro que você colocar entre os parênteses, o que nesse caso é 'Hello World'
.
Já existem respostas que mostram como alterar o HTML interno do elemento.
Mas eu sugiro que você deva usar algumas animações como Fade Out / Fade In para alterar o HTML, o que dá um bom efeito à mudança de HTML, em vez de mudar instantaneamente o HTML interno.
$('#regTitle').fadeOut(500, function() {
$(this).html('Hello World!').fadeIn(500);
});
Se você tiver muitas funções que precisam disso, poderá chamar a função comum que altera o Html interno.
function changeInnerHtml(elementPath, newText){
$(elementPath).fadeOut(500, function() {
$(this).html(newText).fadeIn(500);
});
}
você pode usar a função html ou text no jquery para alcançá-lo
$("#regTitle").html("hello world");
OU
$("#regTitle").text("hello world");
O jQuery .html()
pode ser usado para definir e obter o conteúdo de elementos não vazios correspondentes ( innerHTML
).
var contents = $(element).html();
$(element).html("insert content into element");
Exemplo
$( 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>
$("#regTitle")[0].innerHTML = 'Hello World';
Apenas para adicionar algumas idéias de desempenho.
Alguns anos atrás, eu tinha um projeto, no qual tínhamos problemas ao tentar definir um HTML / Texto grande para vários elementos HTML.
Parecia que "recriar" o elemento e injetá-lo no DOM era muito mais rápido que qualquer um dos métodos sugeridos para atualizar o conteúdo do DOM.
Então, algo como:
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>
Você deve obter um melhor desempenho. Recentemente, não tentei medir isso (os navegadores devem ser inteligentes hoje em dia), mas se você estiver procurando por desempenho, pode ajudar.
A desvantagem é que você terá mais trabalho para manter o DOM e as referências em seus scripts apontando para o objeto certo.