javascript - ejemplos - jquery innertext
¿Cómo reemplazar innerHTML de un div usando jQuery? (11)
Aquí está tu respuesta:
//This is the setter of the innerHTML property in jQuery
$(''#regTitle'').html(''Hello World'');
//This is the getter of the innerHTML property in jQuery
var helloWorld = $(''#regTitle'').html();
¿Cómo podría lograr lo siguiente:
document.all.regTitle.innerHTML = ''Hello World'';
¿Utilizando jQuery donde regTitle es mi ID div?
La función html() puede tomar cadenas de HTML y modificará efectivamente la propiedad .innerHTML .
$(''#regTitle'').html(''Hello World'');
Sin embargo, la función de text() cambiará el valor (texto) del elemento especificado, pero mantendrá la estructura html .
$(''#regTitle'').text(''Hello world'');
Puedes usar la función html o text en jquery para lograrlo
$("#regTitle").html("hello world");
O
$("#regTitle").text("hello world");
Sólo para agregar algunas ideas de rendimiento.
Hace unos años tuve un proyecto, en el que tuvimos problemas al intentar configurar un HTML / Texto grande para varios elementos HTML.
Parece que "recrear" el elemento e inyectarlo en el DOM fue mucho más rápido que cualquiera de los métodos sugeridos para actualizar el contenido del DOM.
Así que algo como:
var text = "very big content";
$("#regTitle").remove();
$("<div id=''regTitle''>" + text + "</div>").appendTo("body");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Debería conseguirte un mejor rendimiento. No he intentado medirlo recientemente (los navegadores deberían ser inteligentes en estos días), pero si buscas rendimiento, puede ser útil.
El inconveniente es que tendrá más trabajo para mantener el DOM y las referencias en sus scripts apuntando al objeto correcto.
Si en cambio tiene un objeto jquery que desea representar en lugar del contenido existente. Luego simplemente reinicie el contenido y agregue el nuevo.
var itemtoReplaceContentOf = $(''#regTitle'');
itemtoReplaceContentOf.html('''');
newcontent.appendTo(itemtoReplaceContentOf);
O:
$(''#regTitle'').empty().append(newcontent);
Ya hay respuestas que dan como cambiar el HTML interno del elemento.
Pero sugeriría que debería usar alguna animación como Fade Out / Fade In para cambiar HTML, lo que da un buen efecto al cambio de HTML en lugar de cambiar instantáneamente el HTML interno.
Usa la animación para cambiar el HTML interno.
$(''#regTitle'').fadeOut(500, function() {
$(this).html(''Hello World!'').fadeIn(500);
});
Si tiene muchas funciones que lo necesitan, puede llamar a la función común que cambia el HTML interno.
function changeInnerHtml(elementPath, newText){
$(elementPath).fadeOut(500, function() {
$(this).html(newText).fadeIn(500);
});
}
jQuery''s .html() puede usarse para configurar y obtener el contenido de elementos no vacíos emparejados ( innerHTML ).
var contents = $(element).html();
$(element).html("insert content into element");
Responder:
$("#regTitle").html(''Hello World'');
Explicación:
$ es equivalente a jQuery . Ambos representan el mismo objeto en la biblioteca jQuery. El "#regTitle" dentro del paréntesis se llama el selector que usa la biblioteca jQuery para identificar a qué elemento (s) del DOM html (Modelo de objetos de documento) al que desea aplicar el código. El # antes de que regTitle le dice a jQuery que regTitle es el id de un elemento dentro del DOM.
A partir de ahí, la notación de puntos se utiliza para llamar a la función html que reemplaza el html interno con cualquier parámetro que se coloque entre paréntesis, que en este caso es ''Hello World'' .
$("#regTitle").html("Hello World");
$("#regTitle")[0].innerHTML = ''Hello World'';
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$( document ).ready(function() {
$(''.msg'').html(''hello world'');
});
</script>
</head>
<body>
<div class="msg"></div>
</body>
</html>