javascript - una - Diferencia entre val() y texto()

obtener valor de un input jquery

Question

¿Cuál es la diferencia entre las funciones de jQuery val() y text() ?

¿Dónde usarías uno sobre el otro?

Answer 1

text () devuelve el contenido de texto combinado de todos los elementos coincidentes (como p, div, etc.) val () se usa para obtener el valor de un elemento de entrada (como entrada, selección, etc.)

De acuerdo con la documentación oficial, el texto () no debe usarse con elementos de entrada.

Answer 2

.val() funciona en elementos de entrada (o cualquier elemento con un atributo de valor?) y .text() no funcionará en elementos de entrada. .val() obtiene el valor del elemento de entrada, independientemente del tipo. .text() obtiene el texto interior (no HTML) de todos los elementos coincidentes:

.text()

El resultado es una cadena que contiene el contenido de texto combinado de todos los elementos coincidentes. Este método funciona en documentos HTML y XML. No se puede utilizar en elementos de entrada. Para el texto del campo de entrada use el atributo val.

.val()

Obtenga el contenido del atributo de valor del primer elemento coincidente

Answer 3

val () se usa para obtener el valor de todos los tipos de entrada html como (casilla de verificación, texto, etc.), donde el usuario tiene una opción para ingresar un valor. Ex:-

<input type="text" id="txt_name" /> 
 <input type="checkbox" name="vehicle" value="Bike" id="chk_byk" class="ss">bike<br>   
<script type="text/javascript">
 $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#chk_byk").val());
            });

            });


    </script> 

donde se usa text () para obtener el valor de los elementos html donde el usuario no interactuará como (p, div, etc.)

    <p id="p1">Hi how are u??</p>
 <div id="dv5">Debendra</div>

 <script type="text/javascript">

        $(document).ready(function () {

            $("#btn_submit").click(function () {
                alert($("#dv5").text());
            });

            });


    </script>