Con la función jQuery html() podemos obtener código html de un nodo del DOM o asignárselo.
De esta manera podremos manipular de una manera fácil los diferentes elementos que hay en una página web.
Se complementa perfectamente con las funciones get() y post(). Otras funciones similares son
Vamos a repasar las sintaxis de esta función de jQuery extraída de la web oficial:
$(selector).html() $(selector).html(contenido)
Os explico las 2 maneras que hay de referenciarla:
Tal y como hemos visto, esta función es capaz de asignar contenido u obtener el contenido de un determinado nodo del DOM.
Vamos con este primer ejemplo para ver cómo podemos obtener el valor de un nodo del DOM:
<!-- libreria jquery --> <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> $(document).ready(function(){ $("#boton01").click(function(){ alert($("p").html()); }); }); </script>
Os explico el ejemplo:
Segundo ejemplo para ver el caso inverso, esta vez asignaremos código HTML a un nodo:
<!-- libreria jquery --> <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script> $(document).ready(function(){ $("#boton01").click(function(){ $("p").html("<strong>Hola!!!!</strong>"); }); }); </script>
Os explico el segundo ejemplo:
Para la detección, control o selección de elementos con jQuery os recomiendo leer este post: