1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <script src="lib/jquery-3.4.1.js"></script>
7
8 </head>
9 <body>
10 <ul id="test-ul">
11 <li class="js">JavaScript</li>
12 <li name="c">c++</li>
13 </ul>
14
15 <!--操作DOM-->
16 <script>
17 //document.getElementById('')
18
19 $('#test-ul li[name=c]').text();//获取值
20 // $('#test-ul li[name=c]').text('123'); //设置值
21
22 // $('#test-ul').html();//获得值
23 // $('#test-ul').html('<strong>123</strong>');//设置值
24
25
26
27 //css操作
28 $('#test-ul li[name=c]').css("color","red");
29
30 //元素的显示和隐藏 本质display = none
31 // $('#test-ul li[name=c]').show(); //显示
32 $('#test-ul li[name=c]').hide(); //元素
33
34 // $('#test-ul li[name=c]').toggle(); //可轮换显示隐藏元素
35
36 //测试
37 $(window).width();
38 $(window).height();
39
40 </script>
41 </body>
42 </html>
