Js
文章平均质量分 69
眷恋天空的驴-Anikinly
一切归零!
展开
-
传统 Ajax 已死,Fetch 永生
原谅我做一次标题党,Ajax 不会死,传统 Ajax 指的是 XMLHttpRequest(XHR),未来现在已被 Fetch 替代。最近把阿里一个千万级 PV 的数据产品全部由 jQuery 的 de >$.ajaxde> 迁移到 de >Fetchde>,上线一个多月以来运行非常稳定。结果证明,对于 IE8+ 以上浏览器,在生产环境使用 Fetch 是可行的。由于 Fetch API 是基原创 2017-03-17 10:24:26 · 440 阅读 · 0 评论 -
jquery 高版本不支持browser
解决jQuery 高版本不支持browser方法 前几篇的例子是在 jquery 版本1.7.1 下使用的都没问题,但最近在我们的项目中jquery版本换成了 1.9 ,运行后发现不能实现自动补全功能了。后来在网上找了很多资料,才发现 juqery Autocomplete 插件依赖于jquery 1.2.6 到 jquery 1.8.3 的版本,对于jquery1.9 以上原创 2017-03-17 10:22:19 · 2953 阅读 · 0 评论 -
js奇淫技巧1
ps: js另外一种高深写法,只不过不适合基础太差的想故意装逼的,因为你要是有意而为之,只能是披着羊皮的狼,玩死自己。要不叫做JsFuck。可以自行JsFuck。什么叫基础不差,我觉得至少js高级编程指南看三遍以上的。以下这个是符号运算的黄金法则,基本上就是转化var a = ![] === false; // !后面的字符会被转为换布尔var b = +[] === 0;原创 2017-03-17 10:22:13 · 2388 阅读 · 0 评论 -
js 正则表达式捕获型
测试demo: 本文案例地址 分组有四种类型: 见案例捕获型 - ()非捕获型 - (?:)正向前瞻型 - (?=)反向前瞻型 - (?!)捕获性分组() : 就是捕获分组所匹配的内容暂且存储在某个地方,以便下次使用,捕获性分组以(...)表示,有些地方将取得捕获性分组所匹配结果的过程称之为"反向引用" [ 测试demo中有针对这个的专门案例 ]非捕获性分组 不捕获分组所匹配原创 2017-03-17 10:22:04 · 2260 阅读 · 0 评论 -
**** 读书计划 **** Javascript 设计者模式
前面的话: 设计者模式算是装逼提升之良药,玩 js 的不喝会死在半路上。就像写代码的不知道数据结构或者一丁点的算法知识一样。计划开始时间: 2016-10-02 ---预计结束时间: 2017-10-02 打算利用一年的时间啃完这本比较难缠设计模式。原创 2017-03-17 10:21:23 · 167 阅读 · 0 评论 -
Javascript 时间对象大全
格林尼治标准时(GMT) 是格林尼治天文台通过天文学观测将每日太阳穿过本初子午线的瞬间定为正午时刻,并以此来制定时间,所以格林尼治标准时是“天文学时间”,随着科技的进步,人们发现该时间不够精确,因为地球自转的速度是不均衡的,而且自转速度也会越来越慢,所以不再使用。而协调世界时(UTC) 是基于原子物理学的特性,将在海平面上实现的“原子时秒”定义为国际标准时的时间单位,而原子时秒是这样定义的:铯-1原创 2017-03-17 10:21:20 · 239 阅读 · 0 评论 -
setTimeout或者setInterval 在ie8以及以下报参数错误
项目中碰到的:随意记几笔,这两个函数我们知道是window的全局函数,执行的过程中带不带window都行。但是在ie8以及以下,function a(){};window.setInterval(a,1000); // 就会报错 参数错误window.setInterval(function(){ a() },1000) // 正确更正IE8 用 setInterval 重复访问一个地址,特别是想原创 2017-03-17 10:21:17 · 2075 阅读 · 0 评论 -
encodeURIComponent 和 encodeURI 和 escape 简要汇总
前言: 不在赘述基本用法,这里只记录三者在实际生产中的使用场景。相同点:三者接受的参数都是string类型,escape 在es3中不推荐使用,但是还是有自己的使用场景。三者的反解码对应是: decodeURIComponent 、decodeURI、 unescape。(1): escape() 除了 ASCII 字母、数字和特定的符号外,对传进来的字符串全部进行转义编码,因此如果想对UR原创 2017-03-17 10:21:14 · 1135 阅读 · 0 评论 -
jQuery Pagination 分页插件-初始化两次请求的问题
在做项目的时候碰到的一个问题,jquery pegination 两次请求的问题。项目中检查请求的时候,发现初始化一直是两次请求存在,各种调试,最后解决了两次请求的问题。 重点原理:在初始化的时候需要总的数目,因此需要一个请求,但是注意,回调函数中一定要加上判断条件,检测如果是第一次初始化的话,就不需要再走index+1的请求,因为酱紫效果没变,但是页面请求是增加了一次的。核心代码: var原创 2017-03-17 10:21:11 · 4994 阅读 · 4 评论 -
浅谈文档碎片
不管是js还是很常见的jquery,我们一般操作DOM就会引起页面数据的渲染,在比较大的项目或者说的更直接点,是面试别人问起来的时候知道。细节也很重要。createDocumentFragment() 的作用主要是以前你用小刀一刀一刀的割,但是文档碎片使用的是长40米的大刀,一刀就解决。何乐不为呢。测试碎片在大动干戈的情况下确实稍微效率高点。 通常操作DOM的几种情况:1:for(var i=0;原创 2017-03-17 10:21:08 · 1396 阅读 · 0 评论 -
jquery每天杂碎
【2016-9.9】 $.proxy() 金典案例 var t = 10; var timer = null; $('#a').click(function(){ clearInterval( timer ); timer = setInterval( $.proxy( function(){ if(t == 0){ t = 'done'; }e原创 2017-03-17 10:21:03 · 160 阅读 · 0 评论 -
如何判断一个js对象是否一个DOM对象
我们在写js代码时有时需要判断某个对象是不是DOM对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法。 要判断一个对象是否DOM对象,首先想到的无非就是它是否具有DOM对象的各种属性或特征,比如是否有nodeType属性,有tagName属性,等等。判断的特征越多,也就越可靠,因为毕竟我们自定义的js对象也可以有那些属性。还有其他方法吗? 在DOM Level2原创 2017-03-17 10:21:00 · 769 阅读 · 0 评论 -
Highcharts 数据可视化1
在线学习手册地址: http://www.hcharts.cn/index.php试图写一个简单的轻量级别的入门教程是这篇博客的核心所在,通过这片博客就能轻易的使用这个构图框架。本博客的对应的案例地址:原创 2017-03-17 10:20:51 · 290 阅读 · 0 评论 -
鬼斧神工正则表达式终结篇
1: \: 转译的意思 /b/: 只是单纯的匹配这个b单词 /\b/: 转译,表示的是单词的边界,注意转译的是 \ 后面的部分 var str = 'b'; var re = /b/; var str2 = 'anikin and yes'; var re = /\b/; alert( re.test(str) ); true alert( r原创 2017-03-17 10:20:29 · 222 阅读 · 0 评论 -
深层次学习jquery的API的装逼写法
一 事件对象 // 一种新的写法,在上下问的环境中查找符合条件的元素; $('.ho', $('div') ).css('color','red'); //$( 'div',$(document.body)).click(function(){ alert(1) }); $(document.body).delegate('div', 'click', {name: 'anikin'}, fu原创 2017-03-17 10:20:26 · 327 阅读 · 0 评论 -
浏览器对象全检测
Javascript window对象下面有个对象: Navigator 包含几个有用的属性: appName 浏览器类型 appVersion 当前浏览器代理版本,注意并不是浏览器版本 appCodeName 浏览器代码名称,全兼容,所有已Netscape的浏览器中都是Mozilla,说白了就是不变,不变他娘的就是没用!原创 2017-03-17 10:22:22 · 506 阅读 · 0 评论 -
低版本支持本地存贮store.js+json
在项目中难免要与低版本的浏览器打交道,本地存贮跟JSON的支持总是比jquery.cookie.js+json3.js(ie7--)或者local storage强大一些,这里介绍的是一款包含支持ie6全兼容的插件: store+json2 体积小,性价比高。可以使用下。cdn: http://cdn.bootcss.com/store.js/1.3.20/store+json2.min.js官原创 2017-03-17 10:22:25 · 1054 阅读 · 0 评论 -
图片的懒加载lazy-load.js
官网: https://github.com/tuupola/jquery_lazyload 案例: http://epailive.com/核心原理是:1 设置一个定时器,计算每张图片是否会随着滚动条的滚动,而出现在视口(也就是浏览器中的 展现网站的空白部分 )中;2 为标签设置一个暂存图片URL的自定义属性(例如loadpic),当图片出现在视口时,再将loadpic的值赋给图片的src属性简原创 2017-03-17 10:22:28 · 311 阅读 · 0 评论 -
js事件流
ps: 事件流在js的执行中占据一个很重要的角色,今天这里汇总一下,以便某日脑子被轰炸了再查看之用1.事件流 事件流:从页面中接收事件的顺序。也就是说当一个事件产生时,这个事件的传播过程,就是事件流。 1.1 IE的事件流 [ 很恶心微软这b的破浏览器 ]IE中的事件流叫事件冒泡,事件冒泡:事件开始时由最具体的元素接收,然后逐级向上传播到较为不具体的节点(文档)。对于html来说,就是原创 2017-03-17 10:24:45 · 571 阅读 · 0 评论 -
深入理解javascript原型和闭包系列
深入理解javascript原型和闭包(0)——目录深入理解javascript原型和闭包(1)——一切都是对象深入理解javascript原型和闭包(2)——函数和对象的关系深入理解javascript原型和闭包(3)——prototype原型深入理解javascript原型和闭包(4)——隐式原型深入理解javascript原型和闭包(5)——instanceof深入理解javascript原原创 2017-03-17 10:24:32 · 277 阅读 · 0 评论 -
IFrame 系列4 ---- document.selection 全方位兼容解析以及TextRange[createTextRange,createRange]对象的深入解析
pre{ font-family: courier new!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: courier ne原创 2017-03-17 10:23:52 · 4492 阅读 · 0 评论 -
IFrame 系列3 ---- js选中文字API: setSelectionRange跟createTextRange
pre{ font-family: courier new!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: courier ne原创 2017-03-17 10:23:49 · 1356 阅读 · 0 评论 -
IFrame 系列2 ---- contentWindow跟execCommand全面解析
pre{ font-family: Courier New!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: Courier Ne原创 2017-03-17 10:23:46 · 1705 阅读 · 0 评论 -
IFrame 系列1 ----designMode和contentEditable属性全方位解析
pre{ font-family: courier new!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: courier ne原创 2017-03-17 10:23:43 · 1827 阅读 · 0 评论 -
js中粘贴、复制、剪切操作汇总
pre{ font-family: Courier New!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: Courier Ne原创 2017-03-17 10:23:40 · 3251 阅读 · 0 评论 -
uploadfy上传插件汇总
pre{ font-family: courier new!important; font-size: 12px!important; word-wrap: break-word; white-space: pre-wrap; background-color: rgb(245, 245, 245); font-family: courier ne原创 2017-03-17 10:23:34 · 307 阅读 · 0 评论 -
时间格式化moment.js
官网: http://momentjs.cn/特点: 简单,支持前后端[node],多语言,提及比较小,相对而言吧,其实也就是十几行代码的事。原创 2017-03-17 10:23:05 · 375 阅读 · 0 评论 -
markdown
http://blog.163.com/qyl_anikin/prevPhDownload.do?host=qyl_anikin&albumId=303560047&photoId=9727060752教程博文:http://www.cnblogs.com/sanshi/archive/2011/03/16/1986468.htmlvar fs = require('fs');var markdo原创 2017-03-17 10:22:56 · 191 阅读 · 0 评论 -
js call跟apply用法全解
ps: 将前面博文中的东西单独提取出来,废话不说直接复制。1. 每个函数都包含两个非继承而来的方法: call( this,arg1,arg2 ) 、apply(this,[arg1,arg2]) 使用这个两个函数的好处就在于对象不需要与方法有任何耦合关系。2 . Function.apply(obj,args)方法能接收两个参数 obj:这个对象将代替Function类里原创 2017-03-17 10:22:42 · 614 阅读 · 0 评论 -
一般网页动态加载一段js脚本以及其他小知识点
片段1cript">(function () { var lzhd = document.createElement("script");lzhd.type = "text/javascript";lzhd.async = true;lzhd.charset ="UTF-8";lzhd.src = "http://sum.cntvwb.cn/ecap.min.js";var s = docume原创 2017-03-17 10:22:40 · 377 阅读 · 0 评论 -
Underscore.js 入门-常用方法介绍
博主推荐:Underscore.js是一个很精干的库,压缩后只有4KB。它提供了几十种函数式编程的方法,弥补了标准库的不足,大大方便了JavaScript的编程。MVC框架Backbone.js就将这个库作为自己的工具库。除了可以在浏览器环境使用,Underscore.js还可以用于Node.js.Underscor.js定义了一个下划线(_)对象,函数库的所有方法都属于这个对象。这些方法大致上可原创 2017-03-17 10:22:37 · 429 阅读 · 0 评论 -
高级版本支持toggle
$.fn.toggle = function( fn, fn2 ) { var args = arguments,guid = fn.guid || $.guid++,i=0, toggle = function( event ) { var lastToggle = ( $._data( this, "lastToggle" + fn.guid ) ||原创 2017-03-17 10:22:31 · 331 阅读 · 0 评论 -
jquery 模板替换
高速模板管理:http://aui.github.io/artTemplate/1; 实现的原理: $(function(){ var str = "{innerhtml}"; var data = ['111','2222','3333']; for( var i=0; i $( str.replace('{innerhtml}',data[i]) )原创 2017-03-17 10:20:23 · 1232 阅读 · 0 评论 -
js 面向对象组件开发
组件开发: 节生代码量,易复用。组件开发遇到的两个问题:1: 参数不写的话,会报错 --- extend() 对象的复制,避免参数报错 --a配置参数 b:默认参数 有配置走配置,没有配置走默认。注意:a,b的key值要相同,否则就不能进行值的覆盖。var a = { name: 'anikin'};var b = { name: 'jack'}extend(原创 2017-03-17 10:20:17 · 1597 阅读 · 0 评论 -
JS 兼容小积累【置顶】
1. //alert( oDiv.getAttribute('class') ); // ie678 以下面找不到class //alert(oDiv.getAttribute('data-time')); // 自定义绑定的数据是全兼容的 //alert( oDiv.getAttribute('id') ); /原创 2017-03-17 10:20:12 · 147 阅读 · 0 评论 -
JSON.parse和eval的区别
JSON(JavaScript Object Notation)是一种轻量级的数据格式,采用完全独立于语言的文本格式,是理想的数据交换格式。同时,JSON是Javascript原生格式,这意味着在javascript中处理JSON数据不需要任何特殊的API或工具包,而且效率非常高。 基本格式: varjsonData='{"data1":"Hello,","data2":"world!"}'原创 2017-03-17 10:17:50 · 353 阅读 · 1 评论 -
JS---运动(7)
7.运动扩展一、主要知识点: 弹性运动用变量存储位置 碰撞运动 拖拽求速度二,具体分析:l加减速运动?速度不断增加或减少?速度减小到负值,会向反方向运动 var iSpeed=0; //一定要放在外面function startMove(){ var oDiv=document.getElementById('div1'); setInterva原创 2017-03-17 10:17:45 · 187 阅读 · 0 评论 -
JS运动----(6)
6.总结 运动框架演变过程?startMove(iTarget) 运动框架?startMove(obj, iTarget) 多物体?startMove(obj, attr, iTarget) 任意值?startMove(obj, attr, iTarget, fn) 链式运动?startMove(obj, json) 多值运动?startMove(obj, json, fn) 完原创 2017-03-17 10:17:42 · 155 阅读 · 0 评论 -
JS运动----(3)
3.多物体运动框架 回顾一下上两节的要点,主要讲到了运动框架,十分常见也十分重要。是不是运动很神奇。那么怎么才能让多个物体运动呢?---我们这一节就学习下这个多物体运动框架。首先先看个小例子:小div变宽变窄的效果; #div1 {width:100px; height:50px; background:red;}无标题文档 type="text/javascript">wi原创 2017-03-17 10:17:39 · 171 阅读 · 0 评论 -
JS运动----(4)
【ps】多物体运动框架现在比较的成熟,但是还是不够完善,等学完任意值的运动框架自然会明白。 4 任意值运动框架 1:记住:不要随意用offsetwidth一系列值。用currentStyle代替offset 2:计算机对小数的处理很弱的,要避免使用小数。对小数是模拟的 3:原有运动框架的问题-只能让某个值运动起来---如果想让其他值运动起来,要修改程序。 4:扩展的运动框架--运动属性原创 2017-03-17 10:17:36 · 282 阅读 · 0 评论