1、JavaScrip对象的使用:
/**
* 1、对象的声明赋值使用的是{}花括号,大括号
* 2、对象中的值以key:value的格式进行赋值,多个值中间使用【,】区分
* 3、获取对象中的值的方法需要通过[]并给与key名的方式获取:item["name"]
* /
<script> var item = { id: 9527, name: "王语嫣", age: 16, introduce: "燕子坞·王夫人的姑娘·段誉的媳妇,琅嬛福地的神仙姐姐。" }; // 输出的是item document.write("编号:" + item["id"] + "<br/>"); document.write("昵称:" + item["name"] + "<br/>"); document.write("年龄:" + item["age"] + "<br/>"); document.write("简介:" + item["introduce"] + "<br/>"); //整个对象 document.write(item); //控制台查看 console.log(item); //Object-对象的总结 /* * 1、对象的声明赋值使用的是{}花括号,大括号 * 2、对象中的值以key:value的格式进行赋值,多个值中间使用【,】区分 * 3、获取对象中的值的方法需要通过[]并给与key名的方式获取:item["name"] */ </script>
数组遍历:
<script> var item = [{ id: 9527, name: "王语嫣", age: 16, introduce: "燕子坞·王夫人的姑娘·段誉的媳妇,琅嬛福地的神仙姐姐。" }, { id: 89757, name: "JJ林俊杰", age: 20, introduce: "林俊杰·唱的《美人鱼》。" }]; // 遍历输出的是item for (let i = 0; i < 2; i++) { document.write("编号:" + item[i]["id"] + "<br/>"); document.write("昵称:" + item[i]["name"] + "<br/>"); document.write("年龄:" + item[i]["age"] + "<br/>"); document.write("简介:" + item[i]["introduce"] + "<br/>"); } </script>
2、date日期对象
主要需要记忆的是各种Date的获取函数,是函数,所以使用的时候需要添加()。
其中:dateObject 所指的月份中的某一天,使用本地时间。返回值是 1 ~ 31 之间的一个整数。
这里看好,getDate() 是获取当前的日期,每个月的,例如,如果是2月份就只有28或29天了。根据闰年自动出的。
<!-- Data != Date --> <!-- 数据 != 日期 --> <script> var time = new Date(); document.write(time); // 控制台输出time——Date类型 console.log(time); //输出Date对象包含的内容 document.write("<hr color='red'/>"); document.write("年:" + time.getFullYear()); document.write("月:" + time.getMonth()); document.write("日:" + time.getDate()); document.write("时:" + time.getHours()); document.write("分:" + time.getMinutes()); document.write("秒:" + time.getSeconds()); document.write("<hr/>"); //时间拼接: document.write(time.getFullYear() + "-" + time.getMonth() + "-" + time.getDate() + " " + time.getHours() + ":" + time.getMinutes() + ":" + time.getSeconds() ) </script>
- milliseconds 参数是一个 Unix 时间戳(Unix Time Stamp),它是一个整数值,表示自 1970 年 1 月 1 日 00:00:00 UTC(the Unix epoch)以来的毫秒数。
- dateString 参数表示日期的字符串值。
- year, month, day, hours, minutes, seconds, milliseconds 分别表示年、月、日、时、分、秒、毫秒。
3、Image图片对象
// Image图片标签在切换图片的时候使用的是src属性,
//图片路径规则可以为相对路径也可以为绝对路径
<!-- Image对象 --> <script> var isf = 0; function ChangeSrc() { if (isf == 0) { document.getElementById("imgs").src = "imgs//2.png"; isf = 1; } else { document.getElementById("imgs").src = "imgs//1.png"; isf = 0; } // Image图片标签在切换图片的时候使用的是src属性, //图片路径规则可以为相对路径也可以为绝对路径 } </script> <p><img src="imgs//1.png" title="更换图片标签" id="imgs" width="1000px" /></p> <p> <button onclick="ChangeSrc()" style="width: 50%;height: 30vh;">切换</button> </p>
4、数学函数Math
<script> document.write(Math.abs(-10)); document.write("<br/>"); document.write(Math.ceil(3.14)); document.write("<br/>"); document.write(Math.floor(3.94)); document.write("<br/>"); document.write(Math.pow(2, 10)); document.write("<br/>"); document.write(Math.max(2, 10)); document.write("<br/>"); document.write(Math.min(2, 10)); document.write("<br/>"); document.write(Math.ceil(Math.random() * 10)); document.write("<br/>"); document.write(Math.round(50.534)); document.write("<br/>"); document.write(Math.sqrt(3)); document.write("<br/>"); </script>
JS数组
- 每个数组变量都有一个length属性,表示该数组中元素的个数。
- 定义一个数组变量后,就可以使用“数组变量名[索引号]”的格式来访问每个数组元素。
- 数组列表中的第一个元素的索引号为0,其后的每个元素的索引号依次递增,最后的元素索引为数组的长度-1。
- 如果数组元素本身是一个数组,那么这个元素称为子数组,可以使用“数组变量名[子数组索引号][子数组中的元素索引号]”的格式来访问子数组中的元素。
<body> <script type="text/javascript"> var arr=[' 白色',' 紫色',' 橙色',' 红色']; for(var i=0; i<arr.length;i++) { document.write(arr[i]+"<br/>"); } </script> </body>
在上面可以看到数组的创建方法,但是很多时候我们可以直接声明。
var arr=new Array() //数组初始元素个数为0
var arr=new Array(4); //创建具有指定大小的Array 对象
var arr=new Array(1,2,3); //用指定的元素列表去初始化Array 对象,数组的长度是设置的元素的数目
加强for循环【for i in array:】
加强for循环由于没有下标控制需要通过PC计数器进行寻址。
<script type="text/javascript"> var arr = ["王语嫣", " 小龙女", " 赵灵儿", " 关关雎鸠"] for (var i in arr) { document.write(arr[i] + "<br/>"); } </script>