Pregunta ¿Cuándo uso .val () vs .innerHTML?


En JQuery al intentar acceder a los elementos, veo que si tengo un formulario (digamos un textarea), y quiero conseguir el text dentro de ella, debo usar $("textarea").val();

En cambio si tengo un h1 Elemento, debo usar $("h")[0].innerHTML;

¿Por qué es este el caso? h1.val()/textarea.innerHTML do not work


5
2017-12-27 20:11


origen


Respuestas:


.val() se utiliza para obtener / reemplazar valores de elementos de entrada en jQuery, la alternativa en JS es .value.

innerHTML o jQuery's .html() se utiliza para obtener / reemplazar todo el marcado dentro de un elemento, no elementos de entrada.

text() Se usa casi igual que JS innertHTML, solo obtiene / reemplaza el texto dentro de un elemento, no todas las etiquetas, etc. Es básicamente equivalente a JS innerText 

Enlaces de referencia sobre internalHTML, innerText, val (), texto(), html ()


7
2017-12-27 20:19



Debido a que todas las entradas en HTML tienen val () y pueden enviar sus valores para que sean procesados ​​por un formulario, como textarea, text, submit, ...

pero las etiquetas como h1, span, ... no participan en la forma y no se procesan, y también pueden tener etiquetas internas y html también.


0
2017-12-27 20:16



podrías usar h1.text() o h1.html() cual mapa para innerText y innerHTML respectivamente.

Como para val() que se asigna a input.value.

El uso de los equivalentes de jquery le brinda compatibilidad con varios navegadores, aunque probablemente sea una reliquia más histórica. Los nuevos navegadores probablemente implementen estas características de la misma manera.

Como regla general: value se utiliza en elementos de entrada, innerHTML en los campos no de entrada.


0
2017-12-27 20:14



textarea.innerHTML actualmente será trabajar para obtener el contenido html del área de texto como se representa inicialmente, mientras que val() obtendrá el valor actual basado en la entrada del usuario. val() como han dicho otros, solo funciona en elementos de forma para que no tenga ningún resultado para una <h1>.

$('textarea').on('input', function() {
  $('#innerhtml').text(this.innerHTML);
  $('#val').text($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Type in the textarea below to see results:
<br>
<textarea>test123</textarea>
<div>textarea innerHTML:</div>
<div id="innerhtml"></div>
<div>textarea val:</div>
<div id="val"></div>


0
2017-12-27 20:52



.val () se usa para obtener valor de los elementos de entrada en jQuery. Alternativa en JavaScript es .value.

.innerHTML se utiliza para poner algo de valor entre algunas etiquetas. Por lo tanto, innerHTML es una propiedad de DOM para insertar contenido en un ID específico de un elemento, y con .val () solo obtiene valor de algunas etiquetas de entrada.


-1
2017-12-27 20:30