HTML | Nombre de color de entrada DOM Propiedad

La propiedad de nombre de color de entrada de DOM en HTML DOM se utiliza para establecer o devolver el valor del atributo de nombre . El atributo de nombre es obligatorio para cada campo de Mes de entrada. Si el atributo de nombre no se especifica en un campo de entrada, los datos de ese campo no se enviarán en absoluto. 

Sintaxis: 

  • Devuelve la propiedad de nombre Color de entrada.
colorObject.name
  • Se utiliza para establecer la propiedad del nombre del color de entrada.
colorObject.name = name

Valores de propiedad: contiene un único valor de propiedad, es decir, el nombre, que se utiliza para especificar el nombre del campo Color. 

Valor de retorno: Devuelve un valor de string que representa el nombre del campo Color de entrada. 

Ejemplo-1: Este ejemplo devuelve la propiedad Nombre del color de entrada. 

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Input Color name Property
    </title>
</head>
 
<body style="text-align:center;">
    <h1>
        GeeksForGeeks
    </h1>
    <h2>
        HTML DOM Input Color name Property
    </h2>
 
    <p>
        Select your favorite color:
        <input type="color"
               value="#009900"
               name="Geek_color"
               id="color">
    </p>
 
    <button onclick="myGeeks()">
        Click Here!
    </button>
 
    <p id="GFG"
       style="color:green;
              font-size:24px;">
  </p>
 
    <!-- script to return
     the name of input color field-->
    <script>
        function myGeeks() {
            var x =
                document.getElementById(
                  "color").name;
           
            document.getElementById(
              "GFG").innerHTML = x;
        }
    </script>
</body>
 
</html>

Salida: antes de hacer clic en el botón:

  

Después de hacer clic en el botón:

  

Ejemplo-2: Este ejemplo ilustra cómo establecer el nombre Propiedad. 

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Input Color name Property
    </title>
</head>
 
<body style="text-align:center;">
    <h1>
        GeeksForGeeks
    </h1>
    <h2>
        HTML DOM Input Color name Property
    </h2>
 
    <p>
        Select your favorite color:
        <input type="color"
               value="#009900"
               name="Geek_color"
               id="color">
    </p>
 
    <button onclick="myGeeks()">
        Click Here!
    </button>
 
    <p id="GFG"
       style="color:green;
              font-size:24px;">
  </p>
 
    <!-- script to change  the name of input color field -->
    <script>
        function myGeeks() {
            var x =
                document.getElementById(
                  "color").name = "Hello Geeks";
           
            document.getElementById(
              "GFG").innerHTML =
              "The value of the name attribute"+
              " was changed to " + x;
        }
    </script>
</body>
 
</html>

Salida: antes de hacer clic en el botón:

  

Después de hacer clic en el botón:

  

Navegadores compatibles: los navegadores compatibles con la propiedad de nombre de color de entrada DOM se enumeran a continuación:

  • Google Chrome
  • Internet Explorer 10.0 +
  • Firefox
  • Ópera
  • Safari

Publicación traducida automáticamente

Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *