js基础学习五

1、 Date对象

在js或者你使用Date对象来表示一个时间

// 直接使用构造函数创建一个Date对象，则会封装为当前代码的时间
var d = new Date();
console.log(d);

// 创建一个指定的时间对象
// 需要在构造函数中传递一个表示时间的字符串作为参数
// 日期的格式  月份/日/年 时：分：秒
var d2 = new Date("12/03/2016 11:10:30");

// 获取当前日志是几日
var date = d2.getDate();
// 获取当前日期对象是周几
var day = d2.getDay();
// 获取当前月份 结果是10代表的是11月 （返回0·11）
var month = d2.getMonth();
// 获取当前日期对象的年份
var year = d2.getFullYear();
// 获取到当前时间的时间戳
var time = d2.getTime();

2、Math

处理数值的函数
Math和其他的对象不同，他不是一个构造函数，
他属于一个工具类不用创建对象，他里面封装了数据运算相关的属性和方法。

console.log(Math.PI) // 输出圆周率

// 绝对值
console.log(Math.abs(-1))  // 1
// 向上取整
console.log(Math.ceil(1.2))  //2
// 向下取整
console.log(Math.floor(1.2))   //1

3、 包装类

在js中为我们提供了三个包装类，通过这三个包装类可以将基本数据类型的数据转换为对象。
String（）
可以将基本数据类型字符串转换为String对象。
Number（）
可以将基本数据类型的数字转换为Number对象。
Boolean（）
可以将基本数据类型的布尔值转换为Boolean对象。

// 创建一个Number类型的对象。
var num = new Number(3);
var str =  new String("hello")
var bool = new Boolean(true);
console.log(typeof num); //object

4、 String

字符串在底层是以字符数组的形式保存的。

var str  = "12345";
// 获取字符串的长度
console.log(str.length);
// 可以返回字符串中指定位置的字符
console.log(str.charAt(0)) //  1
// 根据字符编码去获取字符
console.log(String.formCharCode(73)) // I
// 连接两个或多个字符串
console.log(str.concat("你好"));
// indexOf
console.log(str.indexOf("h")) // 字符串中是否有h字符  返回索引的位置  -1则没有
// lastIndexOf 从后往前找
console.log(str.lastIndexOf("h"))
// slice 可以从字符串中截取指定的内容
str.slice(0,2) // 开始截取的地址，结束位置的地址
// substr() 截取字符串
str.substr(3,2)  //截取的开始位置   截取的长度
// split()  可以将一个字符串拆分为一个数组
console.log(str.split(","))  //根据，号将他们拆分为数组。

4、 正则表达式

// i 忽略大小写 
// g 全局匹配模式
var reg =new RegExp("正则表达式", "匹配模式");
var str = "要验证的字符串";
reg.test(str);   // 符合返回true，否则返回false

5、 DOM

浏览器为我们提供的对象
js中通过DOM来对HTML文档进行操作，只要理解了DOM就可以随心所欲的操作WEB页面
DOM Document Object Model 文档对象模型
文档： 表示整个HTML页面文档。
对象： 表示将网页中每一个部分都转换为一个对象。
模型： 表示对象之间的关系，这样方便我们获取对象。



浏览器已经为我们提供文档结点，对象是window属性。可以在页面中直接使用，文档结点代表的是整个网页。

 console.log(documnet);
 var btn = document.getElementById("btn")
 console.log(btn.innerHTML);
 btn.innerHTML = "这个是按钮"

<button id = "btn">按钮</button>

getElementById()  //通过id属性获取一个元素结点的对象。
getElementsByTagName() // 通过标签获取一组元素结点对象
getElementsByName()  // 通过name属性获取一组元素的结点对象。 
getElemnetsByClassName() // 根据class属性查询一组元素节点对象
innerHTML() // 获取元素的value
btn.innerHTML = "改变元素内容的值" 
// 读取元素的结点属性，  直接  元素.属性名
//  注意读取class属性的时候需要使用 .className

// 通过具体的元素节点调用
childNodes  // 当前节点的所有子节点
firstChild  // 当前节点的第一个子节点
lastChild   // 当前节点的最后一个子节点

// 获取body标签
document.budy;   // document中有一个属性就是body，他保存的是body额引用。

// 使用该方法总会返回唯一的一个元素，如果满足条件的元素有多个，那么他只会返回第一个
document.querySelector(". box1 div") // 可以根据一个css选择器来查询一个元素节点对象。
// 可以返回所有的  返回一个数组
document.querySelectorAll(".box1 div") 

6、 事件

onclick 点击事件
onmousemove 鼠标被移动

var btn  = document.getElementById("btn");
btn.onclick = function() {
	alert("你还点---");
}

7、文档的加载

浏览器在加载一个页面时，是按照自上向下的顺序加载的，读取到一行就运行一行。

// 在页面加载完成之后再加载
window.onload = function () {
	alert("在整个页面加载完成之后才加载");
}

js基础学习4

js基础学习6