D3.js selección.propiedad() Función

La función selection.property() se usa para establecer o cambiar la propiedad y el valor de un elemento en particular. El valor de una propiedad en particular se puede eliminar estableciendo su valor en nulo.

Sintaxis:

selection.property(name[, value]);

Parámetros: esta función acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:

  • nombre: El nombre de la propiedad a establecer.
  • valor: El valor de la propiedad que se va a establecer.

Valor devuelto: esta función no devuelve ningún valor.

Ejemplo 1:

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" path1tent=
        "width=device-width, initial-scale=1.0">
 
    <script src="https://d3js.org/d3.v4.min.js">
    </script>
</head>
 
<body>
    <div>
        <input type="text">
    </div>
 
    <script>
 
        // Sets value property of the input tag
        var input = d3.select("input")
            .property("value", "some value from input");
        var text = document.querySelector("input");
         
        // Value from input
        console.log(text.value);
    </script>
</body>
 
</html>

Producción:

Ejemplo 2:

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta name="viewport" path1tent=
        "width=device-width, initial-scale=1.0">
 
    <script src="https://d3js.org/d3.v4.min.js">
    </script>
</head>
 
<body>
    <div>
        <input type="checkbox" class="checkbox"
            name="" id="">checkbox<br>
 
        <button>Click me</button>
    </div>
     
    <script>
        function func() {
 
            // Sets checked and value property
            // of the checkbox
            var chk = d3.select(".checkbox").property(
                "value", "some value from checkbox");
            var chk = d3.select(".checkbox")
                .property("checked", true);
            var text = document.querySelector(".checkbox");
 
            // Value from checkbox
            console.log(text.value);
            console.log(text.checked);
        }
         
        let btn = document.querySelector("button");
        btn.addEventListener("click", func);
    </script>
</body>
 
</html>

Producción:

Antes de hacer clic en el botón haga clic en mí:

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

Publicación traducida automáticamente

Artículo escrito por TARuN 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 *