<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<div id="div1" style="background:red;width:100%;height:50px;"></div>
<p class="p1" style="background:green;width:100%;height:50px;"></p>
<button onclick="change_color_div1()">改变div颜色</button>
<button onclick="change_size_p1()">改版p的大小</button>
</body>
</html>
<script type="text/javascript">
//对象
var obj = new Object();
//属性
obj.rand = function() {
console.log(Math.random());
}
obj.rand();
//定义对象
var obj1 = {};
//属性
obj1.name = 'php';
obj1.rand = function() {
console.log(Math.random());
}
//调用属性的方法
obj1.rand();
//对象
var obj2 = {
name: 'php',
rand: function() {
console.log(Math.random());
},
sum: function(num1, num2) {
return num1 + num2;
}
};
console.log(obj2.sum(2, 5));
//对象
var obj3 = {
table: 'php',
find: function() {
return this.table;
},
where: function() {
return this;
}
};
//传地址，只有一个值，修改就修改了
var obj4 = obj3;
obj4.table = 'name';
var res = obj4.where().find();
console.log(res);
var res1 = obj3.where().find();
console.log(res1);
//Jquery 遍历循环
var arr = [1, 3, 4, 5, 6, 7];
$.each(arr, function(i, v) {
/*
if (i > 2) {
return false;
}
*/
//true 相当于 continue；
//false 相当于 break;
if (v == 3 || v == 6) {
return true;
}
console.log('索引：' + i + ' ');
});
//# 选择ID
function change_color_div1() {
$('#div1').css('background', 'blue');
}
//. 选择class
function change_size_p1() {
$('.p1').css('width', '200px');
}
</script>
总结：
1、今天学习了js对象、属性、方法，Jquery
2、自定义对象可以使用两种方法：
2.1 var obj = new Object();
2.2 var obj1 = {};
2.3 定义对象后，可以直接使用对象添加属性和方法：如 obj.name='php中文网'; obj1.rand=function(){console.log(Math.random())};
3、Jquery遍历：$.each( 数组，function( 索引，值 ) { 方法 } ）；
例子：
var arr = [1, 3, 4, 5, 6, 7];
$.each(arr, function(i, v) {
if (i > 2) {
return false;
}
console.log('索引：' + i + ' ');
});
注意： true 相遇于 php 的continue； false相当于php 的 break；
4、Jquery选择器，#选择id， . 选择class
例子：
function change_color_div1(){
$ ( '#div1').css('background','blue');
}
选择id为div1的样式，赋值background为blue
function change_size_p1() {
$('.p1').css('width', '200px');
}
选择class为p1的样式，赋值width为200px
5、注意一个知识点：
var obj3 = { table: 'php', name='php中文网' };
var obj4 = obj3;
obj4.table = 'name';
此时obj4和obj3的 table 值都是 name；因为这个是传地址，只有一个值，修改一个就是修改了。
PS：老师误会啦，其实都是看着视频理解，然后手动敲了两次才复制过来的，代码里面也有简单注释解释，不过下次会注意总结的哈，另外2个作业，等会有空也重新写总结。