摘要: 今天写组件的时候遇到一个问题,就是当我需要对获取到的对象列表进行删减的时候,发现没有合适的方法,比如://获取图片列表var imgs = document.getElementsByTagName("img");这个列表可以用imgs[0]的数组方法访问元素,但是不能用数组的方法进行编辑.shif... 阅读全文
posted @ 2014-02-26 23:44 dtdxrk 阅读(10503) 评论(0) 推荐(0) 编辑
摘要: 在前两天的一个面试中考官问我web中清除浮动的一些css常用方法,我很轻松的答出了:1.overflow:hidden2.clear:both3.floatfix类然后问题就来了,考官接着问'为什么overflow:hidden'可以清除浮动?这下就把我问住了。写了这么多年css只是单纯的解决问题,... 阅读全文
posted @ 2014-02-19 11:21 dtdxrk 阅读(821) 评论(0) 推荐(1) 编辑
摘要: 事件委托可以给元素添加多个事件var addHandler = function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); ... 阅读全文
posted @ 2014-02-17 00:02 dtdxrk 阅读(591) 评论(0) 推荐(0) 编辑
摘要: 没用过baidu的map api其实挺简单,申请一个key,然后根据坐标在地图上生成对象,看了官方的dome多少知道有些什么功能了,没什么可说的直接贴效果。 1 2 3 4 5 6 办理进京证和警察查询进京证的地址 7 31 32 33 34 1.北京办理进京证的地址 35 2.市区警察查询进京证地址 36 3.北京车管办事大厅 37 Auther:文刀日月 38 39 40 41 42 43 176 177 阅读全文
posted @ 2014-02-13 23:53 dtdxrk 阅读(3011) 评论(0) 推荐(0) 编辑
摘要: 基于LocalStorage+globalStorage+userData实现的一个本地存储类userData用来兼容ie6 ie7由userData模仿Session的方法:浏览器关闭删除保存的记录 1 var userStorage = { 2 isIE : null, 3 ... 阅读全文
posted @ 2014-01-20 16:20 dtdxrk 阅读(400) 评论(0) 推荐(0) 编辑
摘要: HTML5 LocalStorage浏览器的支持的情况如上图,IE在8.0的时候就支持了。不过需要注意的是,IE测试的时候需要服务器环境(或者localhost)。测试自然是检测浏览器是否支持本地存储。在HTML5中,本地存储是一个window的属性,包括localStorage和 sessionS... 阅读全文
posted @ 2014-01-17 17:53 dtdxrk 阅读(791) 评论(0) 推荐(0) 编辑
摘要: UserData的应用范围serData是微软为IE专门在系统中开辟的一块存储空间,所以说只支持Windows+IE的组合,实际测试在2000(IE5.5)、XP(IE6、IE7),Vista(IE7)下都是可以正常使用的。UserData存储在哪儿?首先设置文件夹全部显示,在XP下,一般位于C:\... 阅读全文
posted @ 2014-01-15 11:06 dtdxrk 阅读(1035) 评论(0) 推荐(0) 编辑
摘要: JavsScript Cookie概述cookie是浏览器提供的一种机制,它将document对象的cookie属性提供给JavaScript。可以由JavaScript对其进行控制,而并不是JavaScript本身的性质。cookie是存于用户硬盘的一个文件,这个文件通常对应于一个域名,当浏览器再... 阅读全文
posted @ 2014-01-13 12:23 dtdxrk 阅读(561) 评论(0) 推荐(0) 编辑
摘要: 有时需要将网页中的一些数据保存在浏览器端。好处就是当下次访问页面时,直接就可以从本地读取数据,不需要再次向服务器请求数据。目前常用的有以下几种方法:1.cookiecookie会随着每次HTTP请求头信息一起发送,无形中增加了网络流量,另外,cookie能存储的数据容量有限,根据浏览器类型不同而不同... 阅读全文
posted @ 2014-01-13 11:14 dtdxrk 阅读(742) 评论(0) 推荐(0) 编辑
摘要: 上网看了看别人写的,不是兼容问题就是代码繁琐,自己琢磨了一下用两种方法都可以实现,各有利弊。方法一 依靠正则表达式修改1.获取obj的html2.统一替换html标签3.替换要修改的关键字4.再把html标签修改回去不足就是如果查找的关键字跟替换的标签一样就有冲突了效果预览:http://jsfiddle.net/dtdxrk/EAqkN/embedded/result/ 1 2 3 4 5 方法一 依靠正则表达式修改 6 7 8 9 一个和尚挑水吃、两个和尚抬水吃、三个和尚没水吃。总寺的方丈大人得知情况后,就派来了一名主持和一名书记,共同负责解决这一问题。主持... 阅读全文
posted @ 2014-01-07 12:22 dtdxrk 阅读(6091) 评论(1) 推荐(1) 编辑
摘要: 有了正则表达式基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实例的几个属性RegExp实例对象有五个属性global:是否全局搜索,默认是falseignoreCase:是否大小写敏感,默认是falsemultiline:多行搜索,默认值是falselastIndex:是当前表达式模式首次匹配内容中最后一个字符的下一个位置,每次正则表达式成功匹配时,lastIndex属性值都会随之改变。source:正则表达式的文本字符串除了将正则表达式编译为内部格式从而使执行更快的compile()方法,对象还有两个我们常用的方法regObj.test(strO 阅读全文
posted @ 2013-12-28 23:48 dtdxrk 阅读(294) 评论(0) 推荐(0) 编辑
摘要: JavaScript RegExp 对象http://www.w3school.com.cn/jsref/jsref_obj_regexp.asp定义JavaScript种正则表达式有两种定义方式,定义一个匹配类似的字符串1. 构造函数var reg=new RegExp(']+%>','g');2... 阅读全文
posted @ 2013-12-28 23:47 dtdxrk 阅读(274) 评论(0) 推荐(0) 编辑
摘要: Http定义了与服务器交互的不同方法,最基本的方法有4种,分别是GET,POST,PUT,DELETE。URL全称是资源描述符,我们可以这样认为:一个URL地址,它用于描述一个网络上的资源,而HTTP中的GET,POST,PUT,DELETE就对应着对这个资源的查,改,增,删4个操作。到这里,大家应该有个大概的了解了,GET一般用于获取/查询资源信息,而POST一般用于更新资源信息。 1.根据HTTP规范,GET用于信息获取,而且应该是安全的和幂等的。 (1).所谓安全的意味着该操作用于获取信息而非修改信息。换句话说,GET 请求一般不应产生副作用。就是说,它仅仅是获取资源信息,就像数据库.. 阅读全文
posted @ 2013-12-20 13:48 dtdxrk 阅读(226) 评论(0) 推荐(0) 编辑
摘要: 同事去笔试遇到的问题要求3列div根据内容的变化通过css实现等高效果图:原理:同列的div设置一个父级overflow:hidden 超出部分隐藏给同列的div设置cssmargin-bottom:-10000px; padding-bottom:10000px; 1 2 3 网页布局 CSS... 阅读全文
posted @ 2013-12-20 11:07 dtdxrk 阅读(970) 评论(0) 推荐(0) 编辑
摘要: 在实例开发过程中还是能认识到很多不足的,并且加强了一些基础。简单写一下制作过程:1.创建画布2.创建蛇和老鼠 坐标不能重叠3.让蛇移动起来4.添加死亡方法5.添加转点坐标和方向6.添加吃老鼠的方法整个开发的难点有几个:1.蛇身体的转向2.吃老鼠添加蛇长度总结:1.原来玩的FC贪吃蛇100合一的小游戏... 阅读全文
posted @ 2013-12-16 11:15 dtdxrk 阅读(571) 评论(0) 推荐(0) 编辑
摘要: 一、前言讲这3个方法区别的文章太多了,但是大部分写的都很绕。本文试图从实践角度去讲这3个方法。二、escape和它们不是同一类简单来说,escape是对字符串(string)进行编码(而另外两种是对URL),作用是让它们在所有电脑上可读。编码之后的效果是%XX或者%uXXXX这种形式。其中ASCII字母、数字、@*/+,这几个字符不会被编码,其余的都会。最关键的是,当你需要对URL编码时,请忘记这个方法,这个方法是针对字符串使用的,不适用于URL。事实上,这个方法我还没有在实际工作中用到过,所以就不多讲了。三、最常用的encodeURI和encodeURIComponent对URL编码是常见的 阅读全文
posted @ 2013-11-25 12:54 dtdxrk 阅读(289) 评论(0) 推荐(0) 编辑
摘要: //RegExp有以下两个方法//test():返回模式是否匹配//exec():返回一个数组,第一个是匹配项,后边依次是分组匹配项,如果分组匹配不成功,则为undefined。而且还返回属性index(匹配项起始index),input(要验证的字符串)var rExec=/mufc(\d)/g;var sExec="amufc1 sssmufc2 wwmufc3 ss";console.log(rExec.exec(sExec));//["mufc1", "1"] console.log(rExec.exec(sExec));// 阅读全文
posted @ 2013-10-16 15:07 dtdxrk 阅读(264) 评论(0) 推荐(0) 编辑
摘要: HTML字符实体(Character Entities),转义字符串(Escape Sequence)为什么要用转义字符串?HTML中,&等有特殊含义(,用于链接签,&用于转义),不能直接使用。这些符号是不显示在我们最终看到的网页里的,那如果我们希望在网页中显示这些符号,该怎么办呢?这就要说到HTML转义字符串(Escape Sequence)了。转义字符串(Escape Sequence)也称字符实体(Character Entity)。在HTML中,定义转义字符串的原因有两个:第一个原因是像“”这类符号已经用来表示HTML标签,因此就不能直接当作文本中的符号来使用。为了在H 阅读全文
posted @ 2013-09-13 09:37 dtdxrk 阅读(904) 评论(0) 推荐(0) 编辑
摘要: 前言例子:^.+@.+\\..+$ 这样的代码曾经多次把我自己给吓退过。可能很多人也是被这样的代码给吓跑的吧。继续阅读本文将让你也可以自由应用这样的代码。正文 教程:正则表达式30分钟入门教程 一个学习正则表达式不错的教程,对正则表达式有兴趣,但不太了解的童鞋可以参考下 以下内容摘自常用JQuery数字类型验证正则表达式整理 和 经典Javascript正则表达式 [ 留个备份 :) ~~ ] 常用JQuery数字类型验证正则表达式整理 (有很多不对的地方,记得适当修改) var regexEnum = { intege:/^-?[1-9]... 阅读全文
posted @ 2013-08-14 14:48 dtdxrk 阅读(422) 评论(0) 推荐(0) 编辑
摘要: 无意中看到同事有本《高性能网站建设指南》,趁着有时间借来读读。简单的讲这是一本前端优化网站的书,作者总结了14条性能规则,我这里只记录下方便实用的方法。规则一:减少HTTP请求1.CSS Sprites 合并图片2.合并脚本和样式表规则二:使用内容发布网络(CDN)规则三:添加Expires头1.编辑动态语言生成的HTML页面时,配置长久的Expires头,可以缓存组件,在后续的页面浏览中减少不必要的HTTP请求。规则四:压缩组件1.gzip可以压缩HTML JS css2.修改Apache配置gzip规则五:将样式表放在顶部规则六:将脚本放在底部规则七:避免CSS表达式1.使用css里exp 阅读全文
posted @ 2013-08-14 11:22 dtdxrk 阅读(874) 评论(0) 推荐(1) 编辑
摘要: 别被下面那些复杂的表达式吓倒,只要跟着我一步一步来,你会发现正则表达式其实并没有你想像中的那么困难。当然,如果你看完了这篇教程之后,发现自己明白了很多,却又几乎什么都记不得,那也是很正常的——我认为,没接触过正则表达式的人在看完这篇教程后,能把提到过的语法记住80%以上的可能性为零。这里只是让你明白基本的原理,以后你还需要多练习,多使用,才能熟练掌握正则表达式。除了作为入门教程之外,本文还试图成为可以在日常工作中使用的正则表达式语法参考手册。就作者本人的经历来说,这个目标还是完成得不错的——你看,我自己也没能把所有的东西记下来,不是吗?清除格式文本格式约定:专业术语元字符/语法格式正则表达式正 阅读全文
posted @ 2013-08-14 09:22 dtdxrk 阅读(271) 评论(0) 推荐(0) 编辑
摘要: 阅读全文
posted @ 2013-08-14 09:21 dtdxrk 阅读(186) 评论(0) 推荐(1) 编辑
摘要: 实现了一下功能:1.title可自定义 可拖拽2.width height可以自定义3.背景遮罩和透明度可以自定义4.可以自己编辑弹出框里的html5.确定 取消按钮可选调用方法: 1 Prompt.add();//生成遮罩和弹出div 2 3 4 5 Prompt.init({ //修... 阅读全文
posted @ 2013-08-12 21:40 dtdxrk 阅读(3749) 评论(8) 推荐(7) 编辑
摘要: 本文内容信息显示信息显示的占位符console.group 和 console.groupEnd 分组显示console.dirconsole.dirxmlconsole.assertconsole.traceconsole.time 和 console.timeEnd 流逝时间Console.Profiler 性能分析Console Panel 是 Firebug 的第一个面板,也是最重要的面板,主要作用是显示网页加载过程中产生各类信息。Firebug 有一个内置 console 对象。该对象包含很多方法,可以让你把信息写到 Firebug 控制台。信息显示console.log 是最简单的 阅读全文
posted @ 2013-07-28 13:31 dtdxrk 阅读(331) 评论(0) 推荐(0) 编辑
摘要: 算法用的是Tween类,需要研究的参考这篇文章:http://www.cnblogs.com/cloudgamer/archive/2009/01/06/Tween.html网页里常用的动画 放大缩小 位置移动 透明度改变效果预览:http://jsfiddle.net/dtdxrk/WnACG/e... 阅读全文
posted @ 2013-07-24 12:57 dtdxrk 阅读(529) 评论(0) 推荐(0) 编辑
摘要: 挺简单的一段程序,但是效果不错:1.把需要展示的36张图片先预加载到浏览器缓存里2.给展示图片的div添加方法3.通过鼠标左右移动的像素转换图片在线效果预览:http://jsfiddle.net/dtdxrk/SnSGj/embedded/result/ 1 2 3 4 5 原生Js产品图片360度展示 6 13 14 15 16 鼠标左键点击图片-并左右移动 17 18 19 20 21 22 136 137 阅读全文
posted @ 2013-07-22 11:03 dtdxrk 阅读(826) 评论(0) 推荐(0) 编辑
摘要: 根据城市的汉语名称首字母把城市排序,基本思路:1.处理数据,按照需要的格式分别添加{HOT:{hot:[],ABCDEFG:{a:[1,2,3],b:[1,2,3]},HIGHLMN:{},OPQRSTU:{},VWXYZ:{}}2.解析数据 创建数据div 给需要功能的input分别添加事件效果预览:http://jsfiddle.net/dtdxrk/xdftL/embedded/result/ 1 2 3 4 5 原生Js汉语拼音首字母匹配城市名 6 33 34 35 36 37 38 39 44 49 54 59 64 6... 阅读全文
posted @ 2013-07-13 16:56 dtdxrk 阅读(5384) 评论(0) 推荐(0) 编辑
摘要: 原理和过程1.页面滚动加载事件2.获取元素在页面里的top值 根据滚动条的位置 判断何时显示图片3.获取元素集合 加载过的图片从集合里删除效果预览:http://jsfiddle.net/dtdxrk/SkYNq/embedded/result/ 1 2 3 4 5 ... 阅读全文
posted @ 2013-06-23 14:27 dtdxrk 阅读(1815) 评论(3) 推荐(1) 编辑
摘要: 验证数字的正则表达式集 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|[1-9][0-9]*)$ 验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$ 验证有1-3位 阅读全文
posted @ 2013-06-19 14:31 dtdxrk 阅读(233) 评论(0) 推荐(0) 编辑
摘要: 一、Javascript的异常处理机制当javascript代码中出现错误的时候,js引擎就会根据js的调用栈逐级寻找对应的catch,如果没有找到相应的catch handler或catch handler本身又有error或者又抛出新的error,最后就会把这个error的处理交给浏览器,浏览器会用各自不同的方式(IE以黄色三角图案 显示在左下角,而firefix会显示在错误控制台中)显示错误信息给访问者.如:在火狐下(工具)在IE下,表现为 左下角黄色感叹号二、try/catch/finally是js提供的异常处理机制,用法如下:try { // 这段代码从上往下运行,其中任何一个语句. 阅读全文
posted @ 2013-06-18 16:03 dtdxrk 阅读(441) 评论(0) 推荐(0) 编辑
摘要: 有了HTML5的FileReader&canvas这两个方法 不需要走后台服务就可以编辑生成图片了,插件只能在支持HTML5的浏览器上使用!!简单制作过程和思路 1.创建画布2.上传图片预览到画布3.创建input参数控制样式4.输出图片=============================================用到了两个知识点1.html5 FileReader可以本地读取FILE文件2.html5 Canvas用来绘图toDataURL生成图片=============================================参考学习资料FileReader详解 阅读全文
posted @ 2013-06-14 16:54 dtdxrk 阅读(1366) 评论(0) 推荐(0) 编辑
摘要: 很长时间没看 正则表达式了,碰巧今天用到,温故知新了一把 看书学习吧50% 的举一反三练习中的原创。一 javascript正则表达式的基本知识1 javascript 正则对象创建 和用法 声明javascript 正则表达式 var reCat = new RegExp("cat");你也可以var reCat = /cat/; //Perl 风格 (推荐)2 学习最常用的 test exec match searchreplacesplit 6个方法 1) test检查指定的字符串是否存在 var data = "123123"; var reCa 阅读全文
posted @ 2013-06-06 14:22 dtdxrk 阅读(153) 评论(0) 推荐(0) 编辑
摘要: 网上正则表达式的教程够多了,但由于javascript的历史比较悠久,也比较古老,因此有许多特性是不支持的。我们先从最简单地说起,文章所演示的正则基本都是perl方式。元字符( [ { \ ^ $ | ) ? * + .预定义的特殊字符字符正则描述\t/\t/制表符\n/\n/制表符\r/\r/回车符\f/\f/换页符\a/\a/alert字符\e/\e/escape字符\cX/\cX/与X相对应的控制字符\b/\b/与回退字符\v/\v/垂直制表符\0/\0/空字符字符类简单类原则上正则的一个字符对应一个字符,我们可以用[]把它们括起来,让[]这个整体对应一个字符。如alert(/ruby/ 阅读全文
posted @ 2013-06-04 17:27 dtdxrk 阅读(145) 评论(0) 推荐(0) 编辑
摘要: JavaScript有一些内置类型,还有很多常用的内置的方法,本文稍作总结,以备查阅。值类型我的理解,值类型是分配在栈上的,而引用类型(当然也包括引用类型内部的值类型)是分配在堆上的。值类型是不可以改变的,比如:var s = "hello";s = "hello2";上述并没有将字符串"hello"改成"hello2",而是新创建了一个字符串"hello2",前一个字符串仍然存在(只不过无法访问了),并于当前作用域被回收时销毁。值类型很简单,有五种:undefined,null,boolean 阅读全文
posted @ 2013-06-03 10:39 dtdxrk 阅读(281) 评论(0) 推荐(0) 编辑
摘要: 早就想自己写个日历控件练练手了,可惜一直没时间。项目里一直都在用Jquery的日期控件,慢慢的需求增多了,不想改别人的,但是网站上放2个以上同功能的控件又不和谐,所以决定自己写一个。照着淘宝的样式做了一个,目前实现了几种形态:1.单月/双月的显示2.年月是否可选3.今日以前的日期是否可选支持多个in... 阅读全文
posted @ 2013-06-01 20:56 dtdxrk 阅读(2438) 评论(6) 推荐(2) 编辑
摘要: 知识点: 主要是对Date对象的使用。(下面的介绍内容来自网络) 创建 Date 对象的语法: var myDate=new Date() Date 对象会自动把当前日期和时间保存为其初始值。 参数形式有以下5种: new Date("month dd,yyyy hh:mm:ss"); newDate("month dd,yyyy"); newDate(yyyy,mth,dd,hh,mm,ss); new Date(yyyy,mth,dd); new Date(ms); 注意:最后一种形式,参数表示的是需要创建的时间和GMT时间1... 阅读全文
posted @ 2013-05-31 00:28 dtdxrk 阅读(233) 评论(0) 推荐(0) 编辑
摘要: Package Control组件安装 按Ctrl+`调出console(注:安装有QQ输入法的这个快捷键会有冲突的,输入法属性设置-输入法管理-取消热键切换至QQ拼音) 粘贴以下代码到底部命令行并回车: 3的方法 2的方法 重启Sublime Text 2。 如果在Perferences->pac 阅读全文
posted @ 2013-05-27 11:19 dtdxrk 阅读(414) 评论(0) 推荐(0) 编辑
摘要: 准备换工作了,周末在家充电,本来想封装个插件的。但是看到个有意思的博文,原作者处理的不是很好,感觉有点意思我就研究一下。原文地址:http://www.cnblogs.com/yexiaochai/archive/2013/05/18/3085536.html我完成的效果预览:http://jsfi... 阅读全文
posted @ 2013-05-25 14:44 dtdxrk 阅读(3084) 评论(7) 推荐(3) 编辑
摘要: 虽然跟jQuery的实现比起来是不堪入目的。但在平时一些小项目或效果的实现中,对于js获取页面元素的操作,感觉就够用了,而不用总是依赖框架去实现一些页面的交互效果。js截图浏览器控制台 1 <!DOCTYPE HTML> 2 <html lang="en"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>Js自定义_$元素选择器</tit 阅读全文
posted @ 2013-05-20 17:05 dtdxrk 阅读(5568) 评论(2) 推荐(1) 编辑
摘要: 1 <script type="text/javascript"> 2 function Navigator(){ 3 var Sys = {}, 4 ua = navigator.userAgent.toLowerCase(), 5 s; 6 7 (s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] : 8 9 (s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :10 11 (s = ua.... 阅读全文
posted @ 2013-04-02 09:35 dtdxrk 阅读(1395) 评论(0) 推荐(0) 编辑