1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta charset="UTF-8">
5 <title>jquery对象的获取方式</title>
6 <!--jQuery对象:jquary(选择器) 封装了很多方法,实际上就是dom对象构成的数组-->
7 <!--直观的就是将dom对象转换成jquery对象-->
8 <!--不管是单个的dom对象还是dom对象数组都可以直观的转换成jQery对象-->
9 <script src="js/jquery-3.2.0.min.js">
10
11 </script>
12 <script>
13 //第一点,保证网页所有的元素加载完毕
14 $(function () {
15 //里面的jq代码都可以写入到这里
16 //第一种获取jq对象的方法,通过ID获取
17 $("#div1").html("这是div1的元素");//html方法就等同于之前的innerhtml属性
18 $("#div2").html("这是div2的元素");
19 //第二种,是通过html元素标签来获取
20 $("span").html("这是span元素");
21 //第三种,通过样式类获取
22 $(".red").html("这是red元素样式的html");
23 });
24 </script>
25 </head>
26 <body>
27 <div id="div1"></div>
28
29 <div id="div2"></div>
30 <span></span>
31 <span></span>
32 <div class="red">
33
34 </div>
35 </body>
36 </html>