js
关注
分享
扫一扫
锅王
会写代码的好大厨
展开
-
cleintHeight、offsetHeight、scrollHeight、cleintTop、offsetTop、scrollTop、getClientRects、getBoundingClien
项目ValuecleintHeight元素高度（不包括border）offsetHeight元素高度（包括border）scrollHeight元素内容高度（没有滚动的情况下，值等于clientHeight）项目ValuecleintTop元素上边框的宽度offsetTop元素相对于最近一个positioned父元素 top...原创 2020-03-24 15:53:27 · 271 阅读 · 0 评论 -
label标签的两次click触发
发现一个有意思的事件：用label绑定一个input之后，点击label会两次触发label和input共同的父元素的click事件。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div class="wr原创 2016-11-21 11:07:09 · 5982 阅读 · 1 评论 -
浏览器缓存控制
web资源在浏览器端的缓存通常是通过相应头和请求头里的相关字段来控制的，包括 etag、last-modified、expires，cache-control，这几个字段出现的顺序有时间先后，作用也有所不用。1. etag etag类似于用MD5给文件进行电子签名，它以文件的时间戳、文件内容等作为参数生成一小段唯一的标识字符串，每次对文件的修改都会在etag上体现出来。响应头里的etag会被浏览原创 2017-07-21 17:12:08 · 461 阅读 · 0 评论 -
正则中$1、$2的应用--日期格式化
在正则表达式中可以通过一对小括号“ （）”将一个完整的正则表达式分割出几个子表达式，并可以用 “$ + index”来分别引用对应子匹配项的内容。下面以格式化日期为例： 目标是将“Tue Aug 08 2017 18:23:48 GMT+0800 (中国标准时间)”转化为“2017-08-08” var time= new Date().toLocaleDateString(原创 2017-08-08 18:40:37 · 947 阅读 · 0 评论 -
js事件订阅、发布
var eventCenter={ sub:function(mesName,mesCallback){ this.argus=this.argus||{}; this.argus[mesName]=this.argus[mesName]||[]; this.argus[mesName].push(me...原创 2018-03-22 14:52:06 · 1326 阅读 · 0 评论 -
url参数获取
function query(name){ var str=location.search.slice(1) var reg=new RegExp('(^|&)'+ name +'=([^&]*)(&|$)') var temp=reg.exec(str) return temp[2] } query('b')...原创 2018-03-22 14:56:05 · 357 阅读 · 0 评论 -
Mutation Observer API
1、概述 Mutation Observer API 用来监视 DOM 变动。DOM 的任何变动，比如节点的增减、属性的变动、文本内容的变动，这个 API 都可以得到通知。概念上，它很接近事件，可以理解为 DOM 发生变动就会触发 Mutation Observer 事件。但是，它与事件有一个本质不同：事件是同步触发，也就是说，DOM 的变动立刻会触发相应的事件；Mutation O...原创 2018-07-09 17:54:31 · 413 阅读 · 0 评论 -
快速排序(quickSort) 和 插入排序(insertSort)
1、快速排序(quickSort)（1）在数据集之中，选择一个元素作为"基准"（pivot）。（2）所有小于"基准"的元素，都移到"基准"的左边；所有大于"基准"的元素，都移到"基准"的右边。（3）对"基准"左边和右边的两个子集，不断重复第一步和第二步，直到所有子集只剩下一个元素为止。 function quickSort( arr ){ if(arr.原创 2018-07-27 17:32:03 · 621 阅读 · 0 评论 -
同源策略阻止的是请求的发送还是数据的接收？
同源策略 （Same origin policy）是一种约定，它是浏览器最核心也最基本的安全功能，Web是构建在同源策略基础之上的，浏览器是针对同源策略的一种实现。之前一直认为，它是通过对发出的请求进行检查是否同源，然后决定是否对该请求加以限制来实现。这次经过验证发现正好相反：在www.test.com下的页面中向www.domian.com下的a.php发送ajax请求： $原创 2016-11-08 18:52:27 · 1738 阅读 · 1 评论 -
window.name 跨域实现原理及实例
先引用一段话： window.name 传输技术，原本是 Thomas Frank 用于解决 cookie 的一些劣势（每个域名 4 x 20 Kb的限制、数据只能是字符串、设置和获取 cookie 语法的复杂等等）而发明的。后来 Kris Zyp 在此方法的基础上强化了 window.name 传输 ，用来解决跨域数据传输问题。 window.name 的美妙之处：name值在不同的原创 2016-11-08 14:30:17 · 9604 阅读 · 0 评论 -
iframe跨文档传输（postMessage跨域）
www.test.com 域下的 a.html页面 中通过iframe引入另一个域 www.domain.com 下的 b.html 页面，然后在两个页面间传递数据：a.html:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body>原创 2016-11-07 14:17:22 · 3508 阅读 · 1 评论 -
关于HTML5新API————visibilityState
1、介绍visibilityState这是一个HTML5新提供的一个api，主要作用就是记录当前标签页在浏览器中的激活状态。所谓“激活状态”指的是当前标签是否正在被用户浏览。2、应用场景监控用户行为，当用户的视角不在当前页面时，暂停加载广告，幻灯片、停止加载视频、开始加载小动画等。减少对用户宽带的占用，减少服务器压力，节省用户内存，以及到达更好的播放效果。3、属性与事件HTML原创 2016-05-25 11:21:53 · 5203 阅读 · 0 评论 -
关于事件——event
1、绑定事件监听函数通常有三种方法①在HTML中定义元素的事件相关属性（不符合内容与行为分离原则）：按钮。。②在js中为元素的事件相关属性赋值（符合内容与行为分离，但是一个元素只能绑定一个时间监听函数）：btn.onclick=function(){...}document.body.onload=initData;function initData(){...}原创 2016-05-27 16:31:50 · 449 阅读 · 0 评论 -
JavaScript中的函数节流
什么是函数节流？介绍前，先说下背景。在前端开发中，有时会为页面绑定resize事件，或者为一个页面元素绑定拖拽事件（其核心就是绑定mousemove），这种事件有一个特点，就是用户不必特地捣乱，他在一个正常的操作中，都有可能在一个短的时间内触发非常多次事件绑定程序。而大家知道，DOM操作时很消耗性能的，这个时候，如果你为这些事件绑定一些操作DOM节点的操作的话，那就会引发大量的计算，在用户转载 2016-06-03 15:43:33 · 438 阅读 · 0 评论 -
前端路由
用前端路由分担后台工作量、包办整个网站的路由这种事感觉有点想太多。但是在单页应用中做一些提高用户友好度的工作还是很有作为的。一、方案：通过hash 目录结构如图： 只有main,html是完整的html，其他两个都是html片段①main.html:<!DOCTYPE html><html> <head> <meta charset="UTF-8">原创 2016-06-08 18:12:35 · 327 阅读 · 0 评论 -
正则表达式中添加变量
强大的正则表达式在应用中偶尔需要加入一些变量，来增强他的扩展性，可以采用如下定义：var reg=new RegExp("正则部分"+变量,"ig");例：var str="abc121def122gtf123";var s=122var reg=new RegExp(("\/w){3}"+s,"gi");var index=str.replace(reg,"");原创 2016-08-19 11:48:39 · 11305 阅读 · 0 评论 -
js插件开发规范
当我们画出了UI之后就可以正式编写jQuery插件代码了，不过在着之前我们还需要对jQuery插件开发的一些规范性有一些了解。一. 使用闭包： (function($) { // Code goes here })(jQuery);这是来自jQuery官方的插件开发规范要求，使用这种编写方式有什么好处呢？a) 避免全局依赖。b) 避免第三方破坏。c) 兼容jQuery操作符’$’和’jQu转载 2016-08-11 17:26:25 · 1081 阅读 · 0 评论 -
关于jsonp跨域请求的实现原理
jsonp作为常见的跨域方法，它的实现原理或许都有所了解，就是利用标签的src属性，避开同源策略的限制。.实际操作如下：1、首先是www.domain.com下的index.html页面 var ur="http://www.test.com/test.php?callback=func" //定义请求url,其中参数值func为自定义的回掉函数名 var script=documen原创 2016-11-01 18:22:39 · 869 阅读 · 0 评论 -
nodejs npm常用命令
nodejs npm常用命令npm是一个node包管理和分发工具，已经成为了非官方的发布node模块（包）的标准。有了npm，可以很快的找到特定服务要使用的包，进行下载、安装以及管理已经安装的包。1、npm install moduleNames：安装Node模块 安装完毕后会产生一个node_modules目录，其目录下就是安装的各个node模块。node的安装分为全局模式和本地模式。 一般情转载 2016-09-28 11:55:49 · 434 阅读 · 0 评论 -
安装Yeoman中遇到的问题
在安装yoeman过程中遇到错误，npm warm deprecated npm config@2.1.2:this package has been reintegrated into npm and is now out of date……..大概意思就是这个包已经被融入进了npm而且 现在 已经过时了看了写解决方案，经验证，一下方法有效： 既然说npm理已经整合进了yoeman切已经过时那原创 2016-09-28 18:03:19 · 3962 阅读 · 0 评论 -
事件捕获与事件冒泡
1、事件捕获与事件触发是两种不同的事件触发顺序。2、事件捕获事件触发时按照：目标元素（target）向顶级根元素的方向依次触发同类型事件。div -> body -> html -> document3、时间冒泡事件触发时按照：根元素（docunment）向目标元素（target）的方向依次触发同类型事件。document -> html -> body原创 2016-05-23 16:31:27 · 540 阅读 · 0 评论