Método html() do jQuery

jQuery HTML/Métodos CSS

O método html() do jQuery obtém ou define o conteúdo do elemento selecionado (innerHTML).

Usar o método html()obterao definir o conteúdo, ele retornaráO conteúdo do primeiro elemento selecionadodo conteúdo.

Usar o método html()definirao definir o conteúdo, ele cobriráO conteúdo de todos os elementos selecionados.

Atenção:Ao usar html() para definir o conteúdo do elemento, todo o conteúdo do elemento será completamente substituído pelo novo conteúdo. Além disso, antes de substituir os elementos filhos pelo novo conteúdo, o jQuery remove outras construções dos elementos filhos, como dados e manipuladores de eventos.

Usartext()O método é usado apenas para obter ou definir o conteúdo de texto do elemento selecionado.

Sintaxe:

Obter conteúdo:

$(selector).html()

Definir conteúdo:

$(selector).html(content)

Usar função para definir o conteúdo:

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

Exemplo

Clicar no botão, obter o conteúdo do primeiro parágrafo:

$("button").click(function(){
　　alert($("p").html());
});

Clicar em cada parágrafo retornará o conteúdo HTML:

$("p").click(function(){
　　alert($(this).html());
});

Alterar o conteúdo de todos os parágrafos:

$("button").click(function(){
　　$("p").html("Quero dizer: <b>Hello world</b>);
});

Usar função para alterar o conteúdo do elemento:

$("button").click(function(){
　　$("p").html(function(i){
　　　　return "O índice deste elemento p: "　+　i;
　　});
});

Diferença entre métodos html() e text():

$("#btn1").click(function(){
　　$("p").html("Quero dizer: <b>Hello world</b>);
});
$("#btn2").click(function(){
　　$("p").text("Quero dizer: <b>Hello world</b>);
});

Valor do Parâmetro

jQuery HTML/Métodos CSS