jQuery .HTML vs .acrescentar

““jQuery”É uma biblioteca JavaScript e“.html ()" e ".acrescentar()”Ambos são os métodos usados ​​no jQuery. Ambos os métodos executam tarefas diferentes em uma função JavaScript. O ".O método html () ”é usado para substituir completamente o conteúdo em uma interface da página da web. Por outro lado, o “.O método Append () ”é usado para adicionar novo conteúdo no final do conteúdo existente, sem alterar o conteúdo anterior, diferentemente do“.HTML () ”Método.

É assim ".html () ”e“.Os métodos Append () ”são diferentes um do outro e realizam diferentes operações de JavaScript. Vamos praticamente entender a diferença entre os dois com a ajuda de exemplos.

Como usar o “.HTML () ”Método?

Deve haver um código HTML para formatar o documento primeiro:

Esta é a primeira linha

Esta é a segunda linha

Alterar conteúdo

• No trecho de código acima, existem duas classes denominadas demonstrações dentro das tags de parágrafo para adicionar conteúdo à página da web e abaixo que existe um botão chamado Alterar conteúdo que será usado para alterar o conteúdo através do método html ().

Deve haver uma função JavaScript para implementar o “.html ()”Método para o corpo do documento acima. A seguir, é um exemplo de como o “.html ()”O método é implementado no JavaScript:

$ (documento).pronto (function ()

$ ("botão").clique (function ()
$ (".demonstração ").html ("Este é o novo texto");
);
);

• Na função aninhada de JavaScript acima, há uma função que tem o método preparar, para que, quando a interface html carrega na página da web, essa função se torna ativa.
• Dentro da função, há o “.clique”Método para chamar essa função com o elemento“botão”.
• Dentro disso, há o conteúdo escrito com “.html”. Isso significa que quando o usuário clica no “Alterar conteúdo”Botão, ele invocará o“.html ()”Método, e esse conteúdo (“ Este é o novo texto ”) escrito no“.html ()”O método substituirá o conteúdo antigo.

A interface de saída gerada pelo código acima será o seguinte:

É assim que o “.html ()”O método funciona em uma interface da página da web.

Como usar o “.Método Apêndos () ”?

Agora, vamos ver como o “.acrescentar()”O método é diferente e como opera na página da web. O ".acrescentar()”O método pode adicionar conteúdo após o conteúdo existente no lado direito do conteúdo e também abaixo do conteúdo. Para que possamos adicionar botões para as duas operações:

Olá Mundo!

1. Primeira linha


2. Segunda linha


3. Terceira linha

Anexar texto
Anexar a lista

• No trecho de código acima, há três linhas adicionadas para exibir na interface da página da web como o conteúdo existente da página da web.
• E então, existem dois botões, um para anexar o texto (para estender o conteúdo no lado direito do texto) e o outro para anexar a lista (para adicionar conteúdo abaixo do conteúdo existente).

Para criar a função JavaScript para o trecho de código acima, deve haver o “.acrescentar()”Método para ambos“Anexar texto" e "Anexar a lista”Botões:

$ (documento).pronto (function ()
$ ("#button1").clique (function ()
$ ("#a").acrescentar(" Anexar texto");
);
$ ("#Button2").clique (function ()
$ ("Ol").acrescentar("

Anexar a lista

");
);
);

• No trecho de código acima, há uma função que recebe o método pronto para invocar a função quando a página da web é carregada.
• Dentro da função, o “.acrescentar()”O método é usado para o“Button1" e "Button2”Elementos.

Isso gerará a seguinte saída:

Esta foi a diferença entre o “.html ()" e ".acrescentar()”Métodos de jQuery.

Conclusão

O ".html ()" e ".acrescentar()”Ambos são métodos usados ​​em“jQuery”. Quando o "html ()”O método é usado, substitui o conteúdo antigo pelo novo conteúdo que é adicionado no“html ()”Método. Por outro lado, quando o “acrescentar()”O método é usado, adiciona conteúdo após o conteúdo existente sem alterar ou remover o conteúdo antigo.