js
黄哈哈小妹
no pain no gain
展开
-
vdom(虚拟DOM)
vdom就是用JS模拟DOM结构,DOM变化的对比放在JS层来坐,提高重绘性能首先先来看下DOM节点body的属性,下图可以看出属性非常大,所以DOM的操作是“昂贵”的,js的运行效率高,我们要尽量减少DOM的操作,项目越复杂,DOM操作影响越严重如何用JS模拟DOM结构,如下<ul id='test'> <li class='item'>111</li></ul>//js模拟{ tag:'ul', ..原创 2020-06-02 17:09:47 · 1271 阅读 · 0 评论 -
浏览器的渲染机制
1、什么是DOCTYPEDTD是一系列的语法规则,用来定义XML或XHTML的文件类型。浏览器会使用它来判断文档类型,决定使用何种协议来解析以及切换浏览器模式。DOCTYPE是用来声明文档类型和DTD规范的。DOCTYPE的3种写法:HTML5 <!DOCTYPEhtml> HTML4.01 Strict (严格模式,包含所有的HTML元素和属性,不包括展示性和弃用的元素,如font) 和 HTML4.01 Transitional(传统模式,包含所有的HT...原创 2020-05-27 11:27:16 · 132 阅读 · 0 评论 -
js错误监控
监控错误的几种方式1、运行时的错误就是代码错误try...catch window.onerror2、资源加载的错误object.onerror(例如img.onerror事件) performance.getEntries(页面已经加载成功的资源,返回的是一个数组,加载失败的不在这个数组里面) error事件捕获,代码如下:<!DOCTYPE html>&l...原创 2020-03-05 19:05:09 · 141 阅读 · 0 评论 -
提升页面性能的方法
1、资源压缩合并,减少Http请求2、非核心代码异步加载动态脚本加载(动态创建script标签然后append到body中) defer(是在HTML解析完之后才会执行,如果是多个,按照价值的顺序依次执行) async(是在加载完之后立即执行,如果是多个,执行顺序和加载顺序无关)3、利用浏览器缓存强缓存就是直接从浏览器副本中读取出来(请求响应头会有:expiress、cache-...原创 2020-03-05 18:14:51 · 150 阅读 · 0 评论 -
函数的继承
构造函数的继承 function parent() { this.name = 1 this.play = [3,4] } parent.prototype.say = function () { console.log('say') } function children() { pare...原创 2020-03-03 16:51:58 · 883 阅读 · 0 评论 -
自定义事件
代码如下: var evc = new Event('custome') document.getElementsByClassName('left')[0].addEventListener('custome', function (e) { console.log(e) }) var event = new CustomEvent(...原创 2020-03-02 17:24:25 · 246 阅读 · 0 评论 -
css盒模型
css盒模型包括标准模型和IE模型盒模型包括:content、padding、border、margin这些属性标准模型的宽高指的是content的宽高IE模型的宽高是指content、padding、border加起来的宽高设置这两种模型的css属性:box-sizing: content-box(标准模型,浏览器默认),box-sizing: border-box(IE模型)...原创 2020-03-02 16:16:31 · 107 阅读 · 1 评论 -
页面布局的几种方法
高度固定,左右300px,中间自适应左 中 右 第一种: float浮动会脱离文档流,要清除浮动,兼容性比较好第二种: position定位会脱离文档流,所以子元素也会脱离文档流,写法比较便捷第三种: flex不兼容IE8,最常用,兼容性也好第四种: table操作繁琐,兼容性好,兼容IE8第五种: grid代码量少,新出的属性代码如下:...原创 2020-03-02 15:12:00 · 784 阅读 · 0 评论 -
原型和原型链(jquery为例子)
首先,我们先看下jQuery是怎么用的,如下:let a = $('p');a.css('color', 'red');a.html();a.value();简单实现zepto原型:var zepto = {};zepto.init = function (selector) { var slice = Array.prototype.slice; var...原创 2020-01-02 11:14:48 · 177 阅读 · 0 评论 -
声明
博主的es6文章为观看阮一峰http://es6.ruanyifeng.com/#README的笔记,仅供个人学习使用原创 2018-11-22 10:44:30 · 86 阅读 · 0 评论 -
顶层对象
ES5 只有两种声明变量的方法:var命令和function命令。ES6 除了添加let和const命令,还有另外两种声明变量的方法:import命令和class命令。所以,ES6 一共有 6 种声明变量的方法。 顶层对象的属性顶层对象,在浏览器环境指的是window对象,在 Node 指的是global对象。ES5 之中,顶层对象的属性与全局变量是等价的。 global ...原创 2018-11-22 10:24:44 · 890 阅读 · 0 评论 -
window.open()被浏览器拦截问题
一、原因浏览器为了维护用户安全和体验,在JS中直接使用window.open(url,"_blank")来打开新的链接是会被拦截的,(window.open(url,”_self”)改变当前的窗口是可以生效的),通常项目需要在ajax异步请求完成后来打开新链接,下面提供几种解决方案二、解决方案方案一、创建一个a标签,利用a标签跳转,能解决大多数浏览器兼容问题,但是这种方法写在aja...原创 2018-07-11 11:16:59 · 5943 阅读 · 0 评论 -
JS常见算法
1、冒泡排序排序后2个相等键值的顺序和排序之前它们的顺序相同什么时候最快(Best Cases): 当输入的数据已经是正序时 什么时候最慢(Worst Cases): 当输入的数据是反序时function bubbleSort(arr) { var len = arr.length; for (var i = 0; i < len; i++) { ...原创 2018-07-27 14:29:03 · 718 阅读 · 0 评论