HTML+CSS+JS学习记录（7）

JS内置对象

string

charAt(idx) ：返回指定位置处的字符
indexOf(Chr) ：返回指定子字符串的位置，从左到右。找不到返回-1
substr(m,n) ：返回给定字符串中从m位置开始，取n个字符，如果参数n省略，则意味着取到字符串末尾。
substring(m,n) ：返回给定字符串中从m位置开始，到n位置结束，如果参数n省略，则意味着取到字符串末尾。
toLowerCase() ：将字符串中的字符全部转化成小写。
toUpperCase()：将字符串中的字符全部转化成大写。
length：属性，不是方法，返回字符串的长度。

math

Math.random() ：随机数
Math.ceil() ：向上取整，大于最大整数
Math.floor() ：向小取整，小于最小整数String

Data

获取时间：

getFullYear() 年
getMonth() 月
getDate() 日
getHours() 时
getMinutes() 分
getSeconds()秒

设置时间：

setYear()
setMonth()
setDate()
setHours()
setMinutes()
setSeconds()
toLoacaleString() 转换成本地时间字符串

对象

对象的创建

1、字面量形式创建

var obj1 = {};

2、通过new Object创建

var obj3 = new Object();

3、通过Object对象的create方法创建

var obj4 = Object.create(null);

对象的操作

1、获取对象属性

对象名.属性名

2、设置对象属性

对象名.属性名 = 值

对象的序列化反序列化

1、序列化即将JS对象序列化为字符串

JSON.stringify(object);

2、反序列化即将字符串反序列化为JS对象

JSON.parse(jsonStr);

this

谁调用函数this指代谁

1、直接调用函数，this指代全局的windows变量

2、调用对象中的函数，this指代对象本身

事件

作用

1、验证用户输入的数据。
2、增加页面的动感效果。
3、增强用户的体验度
 

事件中的几个名词

事件源: 谁触发的事件
事件名: 触发了什么事件
事件监听: 谁管这个事情，谁监视？
事件处理:发生了怎么办

常用的事件

onblur： 失焦事件

 姓名：<input onblur="aa()" onfocus="bb()">

onfocu：聚焦事件

 姓名：<input onblur="aa()" onfocus="bb()">

onchange：元素的值发生改变时触发的事件

    <select onchange="cityChange()">
        <option>商丘</option>
        <option>火星</option>
        <option>太阳</option>
    </select>

onmouseout：鼠标移开事件

<button onmouseout="mouseout()">我是按钮</button>

事件流

事件冒泡：开始时由最具体的元素接受，然后逐级向上传播到较为不具体的节点（文档）

事件捕获：开始时由最具体的文旦接受，然后逐级向下传播到具体的节点

事件处理方式（事件处理方式）

1、HTML事件处理程序

        直接在html元素上绑定

<button onclick="alert('Hello')">按钮2</button>

2、DOM0级事件

        先获取事件源，再给事件源绑定事件

        不能同时给元素绑定相同事件多次

    var btn2 = document.getElementById("btn2");
    btn2.onclick = function(){
        console.log("按钮二被点击了");
    }

3、DOM2级事件

    btn3.addEventListener("mouseout", btnFn,false);
    function btnFn(){
        console.log("鼠标离开按钮三");
    }