1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 <script src="./js/jquery-3.3.1.min.js"></script>
8 <title>Document</title>
9 <script>
10 // 采用等于号赋值的方式，缺点：只加载最后一个
11 window.onload = function(){
12 console.log(0)
13 }
14
15 // $(document).ready(function(){
16
17 // })
18 // // 简写为
19 // $().ready(function(){
20
21 // })
22 // // 再简写为
23 // $(function(){
24
25 // })
26
27 // alert();
28 // 全称为：window.alert()
29 // function a(){
30
31 // }
32 // console.log(window)
33 //
34 // js=>jq
35 // $() 工厂函数 jq= $(js/dom);
36 // 将dom文本包装成jq
37 // jq=$(div)
38 // jq=$("<li>列表</li>")
39
40 // jq => js
41 // [0]
42 // js = jq[0]
43 // js = $div[0] $div[0]为jq对象
44
45 $(function(){
46 // var div = document.querySelector(".div") 原生js
47
48 // var $div = $("div") 把原生js调用成jq方法
49 var $div = $(".div")
50 // var $div = $("*:last") 过滤器可以单独使用，前面加一个*表示加载前面的所有
51
52 // :eq 等于
53 // :gt 大于
54 // :lt 小于
55
56 // $("li:eq(2)").css("color","red")
57 // $("li:gt(2)").css("color","green")
58 // $("li:lt(2)").css("color","blue")
59 // $("li:parent").css("color","red")
60 // has 来验证是否包含子元素
61 // $("li:has(.span)").css("color","red") 选择器
62 $("li:contains(span)").css("color","red")
63 })
64 </script>
65 </head>
66 <body>
67 <div class="div"></div>
68 <ul>
69 <li >列表1</li>
70 <li >列表2</li>
71 <li >列表3<span class="span">span</span></li>
72 <li >列表4</li>
73 <li >列表5</li>
74 <li></li>
75 </ul>
76 </body>
77 </html>
闭包：
for (var i = 0; i < 5; i++) {
setTimeout(function(){
console.log(i)
},1000)
}
// 闭包
for (var i = 0; i < 5; i++) {
(function(i){
setTimeout(function(){
console.log(i)
},1000)
}(i))
}
var stu1={
name:"张三",
class:{
name:web211001,
count:40
}
}
// 直接赋值 对象的完全引用
// var stu2=stu1;
// stu1.class.name="web211200"
// stu1.id=10001;
// console.log(stu2);
// 浅拷贝
var stu2={};
stu2.id=stu1.id;
stu2.name=stu1.name;
// 创建一个新对象
stu2.class={}
stu2.class=stu1.class;
stu1.class.name="web211002"