28% de descuento del curso en SQL Server

Estrada Web Group Estrada Web Group
Diferencia entre getElementsByName
Estrada Web Group
Estrada Web Group
Estrada Web Group Estrada Web Group
Calificar:
30 agosto Javascri..

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

¿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:

Cargando...
Descarga el código fuente

Obten el código del sistema de gestión de proyectos.

Shape