js web
文章平均质量分 78
玉超
这个作者很懒,什么都没留下…
展开
-
可批量支持多选键盘自定义下拉框
近来工作需要大量的下拉框来实现一些功能,网上介绍实现的也不少,总觉得没有称心如意的,于是自己动手丰衣足食,干脆写一个基于jquery的可支持多选回车的批量使用的下拉框组件:$(function($) { function _getGUID(){//随机定义下拉框身份 var guid = ""; for (var i = 1; i原创 2013-10-25 09:45:28 · 1426 阅读 · 1 评论 -
js瀑布流实现思路
百度图片以及qq空间等还有一些像蘑菇街 发现啦之类的网站都用的是瀑布流布局模式,这种模式优点就是合理动态布局,使得图片页面表现有很强的视觉感染力,可以使得客户快速发现自己喜欢的图片。并且大量图片处理时候减少浏览器处理图片消耗;在操作效果上像瀑布似的哗哗的出现图片 故而得此名(纯属想象)闲来之余,实现一个自己的瀑布流demo,发现一些问题 总结一些经验,统统分享给大家:实现思路如下:原创 2013-12-16 14:00:51 · 3667 阅读 · 0 评论 -
js代理监听动态添加元素事件(类似jquery的delegate事件)
很多时候我们需要监听动态添加的元素事件。举个例子:页面中有一个div,div中有一个button以及一个table,我们需要在点击button的时候相应的table行进行排序,而根据特定需求ajax返回数据中的table值是变化的,table变化导致了原先的button必须被移除掉,然后在对应业务地方再添加上一个对table进行排序功能的button。换句话说 这个button的功能是原创 2013-12-23 11:08:32 · 8724 阅读 · 0 评论 -
淘宝组合查询算法
前端有多少事情可以做,能做到多好。一直在关注各大公司UED方面的知识,他们也代表了前端的力量,而且也很乐意和大家分享,把应用到项目的知识归类整理,再写成博客搬到网上来,充实这前端的内容,也是为想追寻和学习的人提供了场所,为想接触到一些前沿的知识提供了去处,感谢有这么一群人。大的科技公司基本都有自己的前端部门或团队,在网上也能看到他们的动态,像淘宝、阿里巴巴、腾讯、百度等等。前段时间在淘宝U转载 2014-01-23 15:14:25 · 1212 阅读 · 0 评论 -
ie下获得跳转来源修复
一般情况下我们从现在某个网页要跳转到某个网页往往会用到location.href="www.xxx.com";这种方式在标准浏览器都没问题,但是ie下却丢失了referer即跳转来源;很多情况下我们在一个网站中需要统计用户是通过哪个网站跳转过来,然后计算是否该给另个网站小费。ie下这个bug就让很多网站丢失了一大笔银子。解决方法看代码:非ie下; function gogo(url原创 2014-01-23 15:25:11 · 961 阅读 · 0 评论 -
iframe及其跨域通讯方式集合
iframe通讯分为两种情况,一个是同域下通讯,另一个是跨域通信先看看同域下父子页面通讯:我们写两个页面便于比较分析:父页面parent.html: function say() { alert("我是父页面方法"); } function callChild(){ myFrame.w原创 2013-11-18 11:51:44 · 11378 阅读 · 1 评论 -
window.name实现跨域请求
如a.com网站想通过JS获取b.com网站的数据。1 在a.com网站添加一个空HTML页。名称为:http://a.com/null.html2 在a.com网站需要获取数据页面(如:http://a.com/getDomainData.html)内容如下: 跨域获取数据 function domainData(url, fn) {转载 2014-02-26 11:24:13 · 1917 阅读 · 0 评论 -
类之间降低耦合javaScript
这篇文章其实是作为js自定义事件的补充,在那篇文章中我们说到了自定义事件对于避免类的污染作用,这篇主要讲讲自定义事件在类之间相互调用的解耦作用:还是举个例子吧:假设我们需要实现一个功能,点击登录,登录成功后,页面一部分出现一个欢迎您的信息;为了便于说明我举了这个功能比较简单的例子,在这个例子中我们需要两个组件(也就是两个类),第一个是登陆模块类login(代表登陆组件),第二个是欢迎信原创 2014-02-13 17:10:57 · 1655 阅读 · 0 评论 -
js预编译解析执行过程分析
javascript编译解析执行顺序分析先来看几道题,大家先猜一下alert的结果1.var a=2;function show(){window.setTimeout(function(){a=22},1000)var a=4;window.setTimeout(function(){ a=222},3000)}show();alert(a);====原创 2014-03-14 14:20:40 · 2883 阅读 · 0 评论 -
js实例化以及constructor探究
js实例化以及constructor探究先来一个构造函数:function Person(name){ this.name=name;}对其添加原型链:Person.prototype={getName:function(){ return this.name;}}对其实例化:var person=new Person('xiaopu')原创 2014-03-14 16:16:06 · 1919 阅读 · 0 评论 -
移动端webApp之大前端(一)
移动端包括ipad、itocuch手机等未来移动设备对于webApp等基于浏览器的网站网页都是用基于移动端浏览器内核。而如今流行的手机浏览器基本都是基于webkit内核作为核心。由于移动端的手机屏幕跟pc端不同,分辨率也是五花八门,所以对于移动端前端页面布局就是很大的挑战。不过我们既然知道了移动端跟pc端不同 就可以有针对性的进行开发,毕竟移动端的浏览器不牵扯到太多pc端似的各种坑爹的兼容原创 2014-03-26 11:54:35 · 1703 阅读 · 0 评论 -
setInertval间隔时间问题
假设我们有一个滚动条长为500px,我们想要设置在两秒内滚动到终点原创 2014-05-14 17:11:58 · 1289 阅读 · 0 评论 -
正则表达式捕获分组
上一篇文章写过正则表达式精讲原创 2014-04-25 12:25:56 · 1047 阅读 · 0 评论 -
正则表达式精讲
正则表达式讲解:首先要知道正则表达式到底是干什么用的?•测试字符串是否匹配格式:例如测试手机号邮箱是否符合规则 •替换文本内容:可以在一串文本中查找需要的内容进行批量替换•根据匹配规则从文本中查找需要的内容:例如可以根据输入选择下拉框显示内容;总之正则表达式在web2.0时代显得是那么强势流行,下面我们说说正则表达式如何构建首先要了解RegExp对象,这是一个跟ar原创 2013-10-25 11:49:55 · 1106 阅读 · 0 评论 -
css常见问题小结
css不是那么熟悉。权当记录一下原创 2014-04-25 13:56:58 · 695 阅读 · 0 评论 -
mouseover以及mouseout事件问题解决方案
mouseover事件:鼠标进入元素或者在元素内部游走时候触发该事件;mouseout事件:鼠标离开该元素触发事件;现在我们有一个div,div中包含一个span,需求需要在鼠标在div内部时候监听鼠标位置;即mouseover事件,真正测试时候发现鼠标在进入span时候会触发mouseout事件然后再触发mouseover事件,一般情况下我们不会认为鼠标进入div内部的span就是离原创 2014-02-27 11:23:41 · 6784 阅读 · 0 评论 -
js页面之间传参方式集合
总有一款适合你。。。如果想了解iframe有关传值请参看之前文章:iframe跨不跨域通讯方式集合;这篇主要是说说其他几种页面之间传值的实现:实现一:url传值这种传值方式就是通过在url后面增加参数,然后打开该url后页面获取参数信息,再用js进行处理。main.html:function post(){ url= "other.html?name="+es原创 2013-12-24 15:41:56 · 7770 阅读 · 0 评论 -
真正的快速排序算法javascript实现
原理分析:其基本思想是选取其中一个值,经过一轮排序,将小于此值的数据放置其左(右)边,大于此值的数据放置于其右(左)边,这样就完成一次快速排序,进而通过递归对左右两侧分别进行快速排序,直到排序组内都剩余1项为止。还是以数组[1,4,7,2,6,8,3,5,9]举例:假设我们选取中间值6作为中间比较值那么经过一次快速排序之后结果应该是[1,4,2,3,5][6][7,8,9]然后原创 2013-12-19 11:43:49 · 4506 阅读 · 0 评论 -
javascript之冒泡排序算法
原理分析: 其原理是从头开始临近的数字两两进行比较,比较一轮战罢,最小的或者最大的被交换到第一位或者最后一位, 其余的再从头进行两两比较,直到比较大到倒数第一位,此轮战罢,最小的或者最大的排到了倒数第二位;。。依次类推递归 以我们数组[1,4,7,2,6,8,3,5,9]举例: 第一轮排序: 两两比较之后将最小值放置最后一位原创 2013-12-19 11:24:59 · 1281 阅读 · 0 评论 -
自定义ajax支持跨域组件封装
Class.create()分析仿prototype创建类继承var Class = { create: function () { var c = function () { this.request.apply(this, arguments); } for (var原创 2013-10-25 09:47:34 · 1984 阅读 · 0 评论 -
bind与call比较分析
对很多人来说,都知道call和bind是可以改变函数作用域的,那么很多情况下我们函数中后面用bind而为什么不用call呢,bind的出现是否多余呢?下面就来比较一下call和bind函数执行过程中各起什么作用。我们写一段js代码用来分析:function $(a){return document.getElementById(a)}function ab(params){原创 2013-10-28 16:51:42 · 936 阅读 · 0 评论 -
javascript中作用域与关键字this
一.作用域当代码在一个环境中执行时,会创建由变量对象构成的一个作用域链,其作用就是保证对执行环境有权访问的所有变量和函数的有序访问。标示符解析是沿着作用域链一级一级的搜索标示符过程,搜索过程从作用域链的前端开始,然后逐级的向后回溯,直到找到标示符为止。----------------------------------------------------------------原创 2013-10-23 13:27:53 · 1155 阅读 · 0 评论 -
深入理解js面向对象之继承
先前整理过js作用域和this关键字的用法,以及分析过js面向对象各种方式,这些都是实现js面向对象所必须的。忘记的话看这里:js面向对象首先来分析一下js中实现面向对象的重要成员prototype,进而在此基础上讲解继承实现;=====================================================================javas原创 2013-10-23 13:33:11 · 2231 阅读 · 0 评论 -
浅谈javascript面向对象
浅谈javascript“面向对象”:所谓面向对象oo语言就是能够创建自己专用的类或者对象,封装一组属性和行为。=======================================================js几种面向对象写法分析:1.早期模式:var Person = new Object; Person.name原创 2013-10-23 13:18:39 · 1248 阅读 · 0 评论 -
扯扯javascript之自定义事件
如果您看到这篇文章 说明您知道js中事件这个东西,js中操作少不了事件的参与,小到click mouse等事件,大到面向对象处理事件。说白了,js就是一个处理事件的东东。。只是作用环境不同或者不明显而已。向上追溯祖宗八代 肯定能找到相关事件。。只是那个时代的js不像现在这么多功能,在加上各个浏览器大哥之间怄气,可苦了我们这帮做js的小弟了。暂定一下 咱回来,别跑偏了。。。自定义事件也是原创 2013-10-30 16:52:16 · 2437 阅读 · 1 评论 -
富文本编辑的利器execCommand
富文本编辑中一个非常关键的document属性execCommand(command,boole,val);这个属性可以得到并且编辑我们当前选则文档节点内容。我们上一节讲过createRange以及createTextRange,都是针对文档去创建并保存一个range选区,一般不会用来去做富文本编辑这种需求,而只是单纯的去做单个或者几个选取插入以及对光标处理效果;如果非得要用这两个去实现富原创 2013-11-26 13:59:44 · 5005 阅读 · 0 评论 -
js光标选区操作
拿input框来举例子:平时我们操作input或者textArea需要用到该技术情况下一般有两处:一:点击一个按钮在input框中特定位置插入一段文本;二:选中一段文本进行操作实现两个效果时候ie以及非ie实现方式不同。具体看看各自是如何实现的:非ie下实现第一个效果一般都会用到三个步骤1、获取选区起始坐标偏移量:非ie下可以应用ele.selectionStart以及ele.原创 2013-11-26 10:27:29 · 3289 阅读 · 1 评论 -
javascript深度拷贝分析
先来介绍一下深拷贝是如何而来的。深拷贝是对比与浅拷贝而言的,我们都知道js中分为基本类型以及引用类型,基本类型都是保存在栈里面的,而引用类型仅仅是把地址保存在栈里面,而值是存在于堆里面,浅拷贝仅仅是拷贝栈里面东西;也就是说对于基本类型而言在栈里面重新开辟一个空间保存复制后的值和址,而对于引用类型而言仅仅是把地址复制过来,而这个地址指向的依然是原来址指向的那个堆里面的值,这样一来如果我们浅复原创 2013-11-14 16:05:44 · 2114 阅读 · 0 评论 -
js文本框监听
主流浏览器包括firefox、chrome以及ie高版本都支持oninput方法监听文本框变化,此外ie有自己的监听方法:onpropertychange方法。根据这些我们就可以做兼容各种浏览器的文本框监听方法:var inputArea=document.getElementById('myInput');if(window.addEventListener){inputArea.a原创 2013-11-14 10:09:10 · 1805 阅读 · 0 评论 -
javaScript获取元素位置以及元素页面大小总结
js获取元素位置以及元素页面大小总结:一:元素位置:js中获取元素位置也就是元素的left以及top位置利用el.offset即可。el.offsetLeft以及el.offsetTop获取的是元素边框外部到目标位置距离;而我们如果要获得元素相对于页面的绝对位置就不得不循环元素父元素然后将循环值相加得到的即为元素真实的绝对位置代码如下:获取元素相对页面位置var getPo原创 2013-12-09 13:58:13 · 1487 阅读 · 0 评论 -
写给前端的http详解
昨天工作时候在请求服务器时间时候遇到一个请求缓存问题。就这个问题细究的话 应该是一篇关于http缓存的讲解,不过在讲解缓存之前,还是要巩固一下http请求,特整理如下:希望对大家日后有所帮助。阅读目录:什么是http协议:引用百度百科的话说来就是:http协议其实就是超文本传输协议,超文本传输协议 (HTTP-Hypertext transfer protocol) 是一种详细原创 2013-12-26 16:46:14 · 5524 阅读 · 2 评论 -
javascript事件处理方式之捕获冒泡
javascript在事件处理机制上经历了三个阶段 html事件处理、dom0级事件处理、dom2级事件处理。html事件处理:形如该单击操作是通过onclick特性并将一些js代码作为值来定义。正因为这个值是js,因此不能使用一些未经转义的html语法字符,例如""等,要想使用双引号,上述例子需要修改为:在html中定义事件处理通常都会调用页面其他地方定义的函数脚本,原创 2013-10-28 15:11:05 · 1474 阅读 · 0 评论 -
我的富文本编辑器
先截个图看看效果:前面讲过execCommand以及光标选区操作,富文本中核心应用便是如此。大体思路就是根据浏览器兼容性利用execCommand以及选区去在可编辑话的iframe中进行插入代码以及样式。我们来一步步实现:第一步:首先建立一个html文档原创 2013-12-17 12:21:27 · 1733 阅读 · 0 评论 -
写给前端的http缓存详解
http提供了非常强大的缓存机制,文章分为三部分,我们先来统一梳理一下一个缓存请求的过程,然后从请求头以及响应头缓存相关字段进行解析,最后总结一下前端需要了解的对于缓存的操作一 . 缓存过程:当一个用户发起一个静态资源请求的时候,浏览器会通过以下几步来获取资源当第一次发送请求,http返回200的状态码,如果没有关闭缓存请求的话(没标明不使用缓存,下述)则会在返回头中返回包含l原创 2013-12-30 13:16:58 · 14735 阅读 · 0 评论 -
jquery Deferred异步回调源码解析应用
jquery deferred在jquery1.6+版本中开始出现,其定义原创 2014-05-21 17:10:08 · 1075 阅读 · 0 评论