¿Cuál es la diferencia entre getElementsByName y getElementById en JavaScript?

Estrada Web Group
Administrador
¿Cuál es la diferencia entre getElementsByName y getElementById en JavaScript?

curso de javascript, aprende a programar, getbyvalngetbyid

Recientemente un amigo me preguntaba ¿cuál es la diferencia entre document.getElementsByName y document.getElementById? para los que no saben cuáles son las diferencias entre ellos, a continuación te las presento.

  • getElementsByName obtiene elementos por el atributo de nombre, getElementById obtiene el elemento por su atributo id.
  • Puede haber muchos elementos en una página con el mismo nombre que en este caso usamos getElementsByName para obtener la lista de elementos / matriz, pero debe haber  sólo un elemento con un identificador dado que en este caso usamos getElementById para obtener un solo elemento.

Más temas para aprender Javascript:

¿Cuál es la diferencia entre getElementsByName y getElementById en JavaScript?

¿Cómo eliminar etiquetas HTML de una cadena de texto con JavaScript?

¿Cómo calcular la distancia entre dos puntos en Google Maps con JavaScript?

¿Cómo generar y leer archivos .zip con Javascript?

Cómo obtener la latitud y longitud de un pin que se puede arrastrar a través de Google Maps

Para todos los programadores no hay como un ejemplo práctico, a continuación puedes ver el código fuente.

 <%@ Page Language="Vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Difference between getelementsbyname & getelementbyid in JavaScript - An Example
    </title>

    <script type="text/javascript">
   
    // function to get value by getelementbyid document
    function GetById()
    {
        document.getElementById("div1").innerHTML=document.getElementById("num").value;
    }
   
    // function to get value by document.getelementsbyname
    function GetByName()
    {
        var nums= document.getElementsByName("number");
        var result='';
        for(var i=0; i<nums.length; i++)
        {
            result+=nums[i].value +"<br/>";
            document.getElementById("div1").innerHTML= result;
        }
    }   
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input type="text" id="num" value="12345" />
        <input type="text" name="number" value="number1" />
        <input type="text" name="number" value="number2" />
        <input type="text" name="number" value="number3" />
    </div>
    <br />
    <div id="div1" style="border-style: solid; border-width: thin; border-color: inherit;
        width: 625px; height: 100px;">
        Div Section
    </div>
    <br />
    <input type="button" onclick="GetById();" value="Get Element By Id" />
    <input type="button" onclick="GetByName();" value="Get Element By Name" />
    </form>
</body>

</html>

 

Compartir artículo:

Más artículos geniales

¿Cómo obtener la latitud y longitud en google maps a partir de una dirección?

¿Cómo obtener la latitud y longitud en google maps a partir de una dirección?

Si desea encontrar obtener la latitud y longitud de Google Maps con jquery y javascript. Entonces tienes el lugar correcto. obtener la latitud y la longitud de la dirección utilizando las API de Google Map con jquery y javascript

Ver artículo completo

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla ;