JavaScript学习 部分笔记

1.i++ 与 ++i 的区别

i++：先返回i的原值计算，在进行自增。

++i：先自增，在进行运算。

2.$$（与） 与 ||（或） 中的逻辑中断问题

$$:前表达式为真返回后表达式；前表达式假返回前表达式。

||：前表达式真返回前表达式；前表达式假返回后表达式。

3.js的预解析

函数提升； 变量提升（不提升赋值操作）

例1.

预解析后：

输出结果为：undefined

例2.

预解析后：

这个案例需要注意点是：var a = b = c =9;相当于 var a = 9; b = 9; c = 9; 其中b,c相当于全局变量

集体声明应为：var a = 9,b = 9,c = 9; 

输出结果为9；9；9；9；not be defined;

Dom事件相关

注册事件：

给元素添加事件，称为注册时间或绑定事件。

有两种方式：1.传统方式：on开头的时间如onclick、onmousehover等。

特点：注册事件的唯一性，同一个元素同一个事件只能设置一个处理函数，最后注册的处理函数会覆盖前面注册的处理函数函数。

2.方法监听注册方式：addEventListener（’事件类型‘，事件处理函数，布尔值决定是事件流的捕获阶段还是冒泡阶段）

特点：ie9之前不支持；同一个元素同一个事件可以注册多个监听器

Dom事件流

分为三个阶段：1.捕获阶段（从上往下执行）

                          2.当前目标阶段

                          3.冒泡阶段（从下往上执行）

相当于一次事件犹如向河中投入石块，先从上往下沉底，再从下往上冒泡。

事件对象

e.target 和 this 的区别 

e.target返回触法事件的对象，this返回绑定的事件对象。

事件委托

事件委托原理：不给每个子节点单独设置事件监听器，而是将事件监听器设置在其父节点上，利用冒泡原理影响设置的每个子节点。

为什么要用事件委托？ 只进行了一次DOM操作，提高了程序的性能。

常用键盘事件

onkeydown     键盘按下时触发

onkeypress      键盘按下时触发（但不能识别功能键）

onkeyup         键盘案件弹起时触发

keyup 和 keydown 不识别大小写，keypress区分大小写但不能识别功能键。

三个事件的执行顺序是：onkeydown > onkeypress > onkeyup

使用addEventElement绑定时不加 on

使用keycode获取ascll编码值 来识别键盘的输入

BOM中client  offset  scroll 的区别

offsetwhith 返回的是包含边框的宽度，clientwhith返回的是不包含边框的宽度，scrollheight返回的是内容的实际高度

offset  pagey style等的区别及含义如图

window.sessionStorage相关：

window.localStorage

用法与sessionstorage 一致， 区别在与前者是本地存储，关闭浏览器不会丢失，后者生命周期为关闭浏览器

jQuery相关：

jQuery 是一个js库

使用前与js一样需要引入  要写入口函数$( function( ){ }  )；js要写onload函数。

DOM与jquery之间可以互相转换：

$(' select')      queryselector('select')

给dom加 $(  )    给jq 加[index]

 

事件切换 hover 内两个参数，前者是鼠标经过相当于mouseenter，后者是鼠标离开。可以设置两个function，或者添加切换函数[toggle]，用作下拉菜单等效果，比分开写两个鼠标事件要节省代码。

如slideup slidedown等为切换 则可以用hover(fuction(){xxxtoggle})

pro

animate（）调用动画用法与其他一致

property属性 获取（固有）属性操作

prop（‘属性’，‘改变值’）

attribute 获取自定义属性

attr（‘属性‘，‘改变值’）

data获取 ‘data-index’ 的H5自定义属性

 

index为所选元素的序列号，domEle为对应序列号的DOM元素，所以不能使用jquery方法改变其样式

该方法主要用于遍历DOM对象，而下面的$.each()主要用于遍历数据，如对象、数组等

  

 

时间处理 on 可帮定一个或多个事件，事件间用 ‘，’号隔开，若多个事件均调用同个函数则可以并写不同时间间用空格隔开。

on可以给未来新出的元素 同样绑定事件。

JavaScript高级：

创建类，使用类创建对象