Método Text(): este método devuelve el contenido de texto de los elementos seleccionados. Sobrescribe el contenido de todos los elementos de coincidencias mientras configura el contenido.
Sintaxis:
- Para devolver contenido de texto:
$(selector).text()
- Para configurar el contenido del texto:
$(selector).text(content)
- Para configurar el contenido del texto usando una función:
$(selector).text(function(index, currentcontent))
Método html(): este método se utiliza para establecer o devolver el contenido (innerHTML) de los elementos seleccionados. Devuelve el contenido del primer elemento de coincidencias o establece el contenido de todos los elementos de coincidencias.
Sintaxis:
Contenido devuelto:
$(selector).html()
Establecer contenido:
$(selector).html(content)
Establecer contenido usando una función:
$(selector).html(function(index, currentcontent))
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
$("#button1").click(function () {
alert("Using text()- " + $("#demo").text());
});
$("#button2").click(function () {
prompt("Using html()- " + $("#demo").html());
});
});
</script>
</head>
<body>
<p id="demo">By clicking on the below buttons,
<b>difference</b> between
<i>text</i> and <i>html</i> in
<b>jQuery</b> is shown.
</p>
<button id="button1">Text</button>
<button id="button2">HTML</button>
</body>
</html>
Producción:
Antes de hacer clic en los botones:
Después de hacer clic en el botón de texto:
Después de hacer clic en el botón html:
Diferencias entre los métodos text() y html():
| método de texto() | método html() |
|---|---|
| Se utiliza para establecer o devolver el contenido de texto de los elementos seleccionados. | Se utiliza para establecer o devolver el contenido de los elementos seleccionados. |
| Este método no se puede utilizar en entradas de formulario o scripts. | Este método no se puede utilizar para el valor de un elemento de script. |
| Se utiliza tanto en documentos XML como HTML. | Se utiliza sólo para documentos HTML. |
| Es más lento que html(). | Es ~2 veces más rápido que .text(). |
| El método text() sobrescribe el contenido de TODOS los elementos coincidentes. | Devuelve el contenido del PRIMER elemento coincidente. |
| Cuando se usa el método text(), se eliminará el marcado HTML | Sobrescribe el contenido de TODOS los elementos coincidentes. |
Navegadores compatibles:
- Google Chrome
- explorador de Internet
- Firefox
- Ópera
- Safari
Publicación traducida automáticamente
Artículo escrito por aktmishra143 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA