Comment obtenir les styles d’une division cliquée en utilisant jQuery ?

<!DOCTYPE html>

<html lang="en">

 

<head>

    <script src=

    </script>

 

    <style>

        div {

            height: 50px;

            margin: 5px;

            padding: 5px;

        }

 

        #htmlDivID {

            width: 300px;

            color: yellow;

            background-color: blue;

        }

 

        #cssDivID {

            width: 310px;

            color: green;

            background-color: grey;

        }

 

        #jQueryDivID {

            width: 320px;

            color: pink;

            background-color: blue;

        }

    </style>

</head>

 

<body>

    <h2 style="color:green">

        GeeksforGeeks

    </h2>

 

    <b>

        Click to see the div

        element's styles

    </b>

 

    <div id="htmlDivID">HTML</div>

    <div id="cssDivID">CSS</div>

    <div id="jQueryDivID">jQuery</div>

    <br />

 

    <div id="displayID"></div>

 

    <script>

        $("div").click(function () {

            var cssValues = [];

 

            var styles = $(this).css([

                "width",

                "height",

                "color",

                "background-color",

            ]);

            $.each(styles, function (prop, value) {

                cssValues.push("<b>" + prop 

                    + "</b>: " + value + ", ");

            });

 

            $("#displayID").show().html(cssValues);

        });

    </script>

</body>

 

</html>

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Aller en haut