jQuery如何使用CSS选择元素？

  • Z时代
  • 2024-01-10
  • 分类：综合

jQuery使用CSS选择器使用CSS选择元素。让我们看一个示例，该示例在第一个匹配的元素上返回样式属性。css(name)方法在第一个匹配的元素上返回样式属性。

这是此方法使用的所有参数的描述-

  • 名字 -属性访问的名称。

示例

您可以尝试运行以下代码，以了解jQuery如何使用CSS选择元素：

<html>
   <head>
      <title>jQuery Example</title>
      <script src = "https://cdn.staticfile.org/jquery/2.1.3/jquery.min.js"></script>
       
      <script>
         $(document).ready(function() {
           
            $("div").click(function () {
               var color = $(this).css("background-color");
               $("#result").html("That div is <span style = 'color:" +
                  color + ";'>" + color + "</span>.");
            });
               
         });
      </script>
       
      <style>
         div { width:60px; height:60px; margin:5px; float:left; }
      </style>
   </head>
   
   <body>
   
      <p>Click on any square:</p>
      <span id = "result"> </span>
       
      <div style = "background-color:blue;"></div>
      <div style = "background-color:gray;"></div>
      <div style = "background-color:#123456;"></div>
      <div style = "background-color:#f11;"></div>
       
   </body>
   
</html>

以上是 jQuery如何使用CSS选择元素？ 的全部内容， 来源链接： utcz.com/z/348888.html

回到顶部