前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

前端第27次总结-

节点

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

快捷尺寸

1、元素:
	clientWidth|Height	内容宽高
	offsetWidth|Height	+padding宽高
	clientLeft|Top		border的宽高
2、jq
	Width|Height	内容宽高
	innerWidth|innerHeight	带padding宽高
	outerWidth|outerHeight	带border宽高
	outerWidth|outerHeight(true)	带margin
3、定位元素
	offsetParent	定位父元素
	parentNode		父元素
	offsetLeft|Top	相对于定位父元素的左上距离
4、jq
	offset()		距离整个页面的左上
	position()	距离定位父元素的左上距离
	scrollTop/Left()	卷动
事件对象的属性
5、事件对象的属性
	clientX|Y		视口
	screenX|Y		屏幕
	pageX|Y			页面
	layerX|Y		和page相同
	offsetX|Y		定位父元素
	scrollX|Y		卷动值
scrollTop、scrollLeft都是css方法,滚动条进行位移

获取样式的方法

1、非行间式
	getComputedStyle	和	currentStyle
2、行间式
	box1.style.XXX
3、get/setAttribute('style', 'borderRadius:20px');
4、实现getStyle方法

键盘事件

	onkeydown	键盘放下
	onkeyup		键盘弹起
	onkeypress	字符输入
	tabindex属性,获取离开焦点。focus/blur
事件对象e.key  或者 keyCode

面向对象

普通函数为了实现某一种功能、构造函数为了创建对象。
构造函数new关键字进行调用,函数名、类名首字母大写。
构造函数4步骤:
	开辟空间、改变this指向、执行代码为this赋值、返回this
优点:
	防止全局变量被污染
	复用属性名称和方法
定义类:可以区分类别(人/狗)
	构造函数加原型
简单工厂模式:
	createPerson 函数返回了一个对象,这种创建对象的方法就称之为工厂模式。



原型:

特点:
	1、	定义同名方法时,构造函数里面的优先
	2、constructor属性,代表构造函数
	3、for in循环遍历实例,   hasOwnProperty  判断属性是自己的还是原型的。
	4、instanceof 会查询整条原型链

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

原型链

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

安全类

// 安全类   防止this指向全局,污染全局变量
    // 无论怎么调用构造函数,都会返回一个对象
    function Dog(name, age) {
        // 判断怎么调用
        if (this instanceof Dog) {
            this.name = name;
            this.age = age;
        } else {
            return new Dog(name,age);
        }
    }

内置的构造函数

Object Array Function String Number Boolean RegExp Error Date

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

继承

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

构造函数继承
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
类继承
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
组合式继承 每次创建实例会执行一遍父类语句
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
寄生式继承
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

BOM对象 以及其下属的各种对象

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

Git

https://blog.csdn.net/halaoda/article/details/78661334
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
分支
checkout 是切换分支
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

touch事件

移动端一般不会使用click事件,原因:
1、click事件慢
2、长时间不抬起鼠标会被取消
3、点击穿透
使用是为了判断双击
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

动画

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

zepto

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

touch

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

百度地图API前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

模块化开发

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

本地存储

JSON.stringify 转为字符串
JSON.parse 转为原类型
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

会话存储

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

WebSql

sql语句 学习
https://blog.csdn.net/a88055517/article/details/6736284
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

history对象

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

音频

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

视频

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

拖拽

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

服务器 和 HTTP

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

多线程Worker函数

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
线程通信
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

cavas

前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
绘制图片
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch
前端第27次总结-节点、快捷尺寸、获取样式的方法、键盘事件、面向对象、原型、原型链、安全类、内置的构造函、继承、BOM、Git、touch事件、动画、zepto、touch

上一篇:Linux之which命令


下一篇:浅谈Windows桌面端触摸架构演进