Miscelánea de jQuery

jQuery HTML/Métodos CSS

Método html() de jQuery

Usar el método html()El método html() obtiene o establece el contenido del elemento seleccionado (innerHTML).ObtenerAl establecer el contenido del primer elemento seleccionado, se retornarádel contenido.

Usar el método html()EstablecerAl establecer el contenido, se sobrescribiráEl contenido de todos los elementos seleccionados.

Nota:Al usar html() para establecer el contenido del elemento, todo el contenido del elemento se reemplazará por completo con el nuevo contenido. Además, jQuery elimina todas las otras construcciones de los elementos hijos antes de reemplazarlos con el nuevo contenido, como datos y manipuladores de eventos.

UsarusarEl método solo obtiene o establece el contenido de texto del elemento seleccionado.

Sintaxis:

Obtener el contenido:

$(selector).html()

Establecer el contenido:

$(selector).html(content)

Usar una función para establecer el contenido:

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

Ejemplo

Hacer clic en el botón para obtener el contenido del primer párrafo:

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

Al hacer clic en cada párrafo se retornará el contenido HTML:

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

Cambiar el contenido de todos los párrafos:

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

Usar una función para cambiar el contenido del elemento:

$("button").click(function() {
　　$("p").html(function(i){
　　　　return "La posición del elemento p es: "　+　i;
　　});
});

Diferencia entre métodos html() y text():

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

Valor del parámetro

jQuery HTML/Métodos CSS