ejemplo de obtener contenido div con JQUERY en español

ejemplo de obtener contenido div con JQUERY en español

ejemplo de obtener contenido div con JQUERY

para poder obtener el contenido de un div utilizando la librería jQuery tenemos dos métodos:

.text() – asignar o devuelve el texto contenido en el elemento seleccionado

.html() –  asignar o devuelve código contenido en el elemento seleccionado

la diferencia entre estos dos métodos es que el primero solo devuelve el texto en cambio el segundo devuelve el texto con su contenido o código 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(){
 $("#btn1").click(function(){
 alert($("#texto").text());
 });
 $("#btn2").click(function(){
 alert($("#texto").html());
 });
 });
 </script>
 </head>
 <body>
<div id="texto">Este texto <b>esta en negrita</b></div>
<button id="btn1">Solo Texto</button>
 <button id="btn2">HTML</button>
</body>
 </html>

como puedes ver en el ejemplo anterior en el apartado del body tenemos creado un dip llamado texto y dos botones btn1 y btn2

y en la parte de arriba, en el encabezado, tenemos la programación de jQuery, primero una referencia a la librería jQuery y después dentro del evento ready tenemos asignados los eventos click al btn1 y btn2.

en el primer botón hemos utilizado el método text y en el segundo botón hemos utilizado el método HTML y si lo ejecutas podrás ver la diferencia ya que al pulsar en el primero solo devuelve el texto sin las etiquetas HTML y si pulsas en el segundo te devuelve todo incluidas las etiquetas html en este caso un texto en negrita es decir la etiqueta <b>

si quieres profundizar más en estos dos métodos te dejo los siguientes enlaces para el método text() y para el método html()