随笔分类 - Javascirpt
摘要：在客户端存储数据时，我们一般都用cookie(不敏感数据)，但是在客户端越来越富的今天，cookie可存储的量(每个域最大4k)实在是小。在HTML5中有localStorage可使用，但是这就抛弃了IE8↓。为了兼容，我们可以翻出IE很久以前就搞的一个存储方法：给一个元素添加一个特殊的样式url(#default#userData)，之后就可以通过setAttribute和getAttribute来存取键值对形式的数据了。要注意的一点就是在数据改变后要使用save方法，而数据加载初期要load。接下来就贴上使用方法，当使用的浏览器支持HTML5时，就使用localStorage。var lo
阅读全文
摘要：①setTimeout众所周知setTimeout(fn,time)是等待一段时间后,执行函数fn。在这个等待是异步的，也就是他不会站着茅坑，当前JS队列中的其他任务会按序执行但这里有个问题就是time毫秒过后的fn执行问题。是立即执行？不一定。这就像是一个买票的队伍，有正在买票的，有排在后面等待买票的。而setTimeout就相当于刚排到fn买票的时候他突然发现钱包一时翻不出来。所以他就让后面的人先买。过了time时间找到钱包后，如果现在没人买票的话，他可以立即买票。否则他就只能去排队了(当所有队列中的内容执行结束后才执行)。最后io的value为ACDB，也证明了不是100ms后立即执行，
阅读全文
摘要：JSON--JavaScript Object Notation （JavaScript对象表示法）初始JSON的人很容易弄混对象与JSON(我也是刚刚弄清楚 ⊙﹏⊙)。JSON是一种数据格式，经常有人说什么"把数据变成JSON对象然后@#￥……@￥"。对象不一定是JSON格式，而JSON格式的数据(以下简称JSON数据)则一定是对象(简单的数据,如1，"ABCD"都算是JSON格式，这里暂且忽略之)JSON格式是以key-value的形式存放数据的 如：{ "name":"Rose", "age&quo
阅读全文
摘要：IE7及以下请求方式用GET的话，URL的限制是个很容易忽视的问题(最大2083个字符)。所以如果URL有可能过长的话，一定要用POST。终止Ajax请求终止请求需要调用XMLHttpRequest对象的abort()方法而在jQuery中的$.get,$.post、$.ajax、$.getJSON、$.getScript...的返回值都是XMLHttpRequest对象.调用abort()后，ajax请求立即停止，但仍然会执行success的回调函数所以在success的回调函数中需要先判断 ajaxGet 或 data是否存在，存在才执行回调函数var ajaxGet = $.get(so
阅读全文
摘要：事件流DOM同时支持两种事件模型：捕获型事件和冒泡型事件并且每当某一事件发生时，都会经过捕获阶段->处理阶段->冒泡阶段(有些浏览器不支持捕获)捕获阶段是由上层元素到下层元素的顺序依次。而冒泡阶段则正相反。如下图当事件触发时body会先得到有事件发生的信息，然后依次往下传递，直到到达最详细的元素。这就是事件捕获阶段。还记得事件注册方法ele.addEventListener(type,handler,flag)吧，Flag是一个Boolean值，true表示事件捕捉阶段执行，false表示事件冒泡阶段执行。接着就是事件冒泡阶段。从下往上 依次执行事件处理函数(当然前提是当前元素为该
阅读全文
摘要：利用iframe和元素的contenteditable属性可以创建简单的富文本编辑区。①document有一个designMode属性，有两个可能的值 "on","off"(默认)。on:文档进入可编辑状态，这时候可以随意操纵文档内的元素。 例如拖动图片到处乱放啊，增删文字之类的,很有趣。off:文档结束可编辑状态，就变成了普通的页面。现在如果我们在页面中放置一个空iframe，并将其designMode设置为"on"，就可以创建一个富文本编辑区。注意的是智能在页面完全加载后才能设置。举例如下：<html> <bod
阅读全文
摘要：效果良好的表属性设置：<table cellSpacing="0" cellPadding="0" border='1' bordercolor="black" style='border-collapse:collapse;table-layout: fixed'></table>很多人都有这种经历：当某个td中没有内容或者没有可见元素时，td的border也会消失。解决方案就是给table添加样式border-collapse:collapse一般的文字截断(适用于内联与块)
阅读全文
摘要：鼠标事件鼠标移动到目标元素上的那一刻，首先触发mouseover之后如果光标继续在元素上移动，则不断触发mousemove如果按下鼠标上的设备(左键,右键,滚轮……)，则触发mousedown当设备弹起的时候触发mouseup目标元素的滚动条发生移动时(滚动滚轮/拖动滚动条。。)触发scroll滚动滚轮触发mousewheel，这个要区别于scroll鼠标移出元素的那一刻，触发mouseout事件注册现在共有三种事件注册方案。①DOM0事件注册：通过给元素的属性赋值来绑定事件，注意，这种方案只能绑定有一个处理句柄。如果绑定两次，则先绑定的句柄会被替代。例如//注册事件处理句柄dom.oncli
阅读全文
摘要：DOM即文档对象模型 EcmaScript主要的构成就是JS+DOM+BOM。对DOM的操作是很重要的部分，而且不容易理解获取DOM元素document.getElementById(docID);//以id获取文档内的元素 *注意getElementById方法只能用在document上 如otherEle.getElementById(docID);//这样是会出错的document.getElementsByTagName(tag);//通过TagName获取元素集合(不是数组),如div,span等等document.getElementsByClassName(className);
阅读全文
摘要：//点击之后执行方法func,且不跳转页面<a href="#" onclick="func();">Click</a>//URL末尾会出现一个# 页面会跳到顶部 并且URL末尾会出现一个#<a href="##" onclick="func();">Click</a>//URL末尾会出现两个# 页面不会跳到顶部<a href="javascript:func();">Click</a>//执行func//推荐<a h
阅读全文
摘要：因为业务需求 今天做了一个textarea文本域字符串长度限制的方法，其实网上已经有了很多相关的解决方案，但在输入日语时，在IE存在BUG，我的这个版本就是针对这种情况的。 解决输入日语+全角时出现的BUG 主要是在红线中间的代码。思路就是中断日语的输入状态。用如果输入超出时能忍受弹窗的话，就用方案②,否则的话就用方案①。
阅读全文
摘要：在IE下style和script是特殊的元素，DOM无法访问其子节点，所以脚本和样式的动态生成需要考虑对IE的特殊处理对于样式，如果内容较少，或者不想放到文件中，可以使用Dom.style.cssText来批量设置。Style//加载样式内容function loadStyle(styleText)...
阅读全文
摘要：Window.external.xxx(params) 系统文件操作命令(控制浏览器窗口行为)点击链接发送邮件Mail C是主题，D是内容或用JSdom.onclick = window.open('mailto:commit_admin@trial-net.co.jp')获取当前触发事件的的DOMevent.srcElement;event.target;//IE无效event.CurrentTarget焦点管理//文档加载完成时，document.activeElement保存的是document.body元素的引用document.activeElement;//当前DO
阅读全文
摘要：这里是我到处搜集的一些JS题目，看起来比较简单，但对基础知识的考察还是很到位的。 有一些还可能是面试题。 题目的分析肯定会有不足的地方 ，如果能指正出来的话就再好不过了。不断更新中…… 这里还有几个前端工程师面试题的文章 也一并推荐给大家 http://www.cnblogs.com/jscode/
阅读全文
摘要：1:在AJAX请求的链接中添加时间戳或随机数在javascript发送的URL后加上t=Math.random()，如href = URL+"&"+"t="+Math.random();或 href = URL + "&" + "t="+ new Date().getTime();2:在XMLHttpRequest发送请求之前加上XMLHttpRequest.setRequestHeader("If-Modified-Since","0");如xhr.setR
阅读全文
摘要：在IE中经常会有内存泄露出现。 Javascirpt具有自动垃圾回收机制。离开作用域的值将被自动标记为可以回收，因此将在垃圾收集期间被删除。 对原生JS对象的垃圾回收采用的是标记清除策略 (这是目前主流的垃圾收集算法,基本思想是给当前不使用的值加上标记，然后再并回收内存空间) 但在IE8及以下的版本
阅读全文
摘要：属性与原型①function foo(){this.add = function(){};}②foo.prototype.add = function(){};①中的add是属性；②中的add是原型。当调用foo.add时，查询顺序：foo属性--->foo原型--->Object原型foo.prototype.hasOwnProperty(prop);判断prop是否为foo的自身属性。delete只能删除属性(除了window对象的属性和 configurable=false 的属性)，不能删除原型原型链和构造函数function Foo(name){ this.name=na
阅读全文
摘要：一 什么是 Console Console 是用于显示 JS和 DOM 对象信息的单独窗口。并且向 JS 中注入1个 console 对象，使用该对象可以输出信息到 Console 窗口中。另外 打开Console后，ALT+F1的话，会弹出快捷键一览，也是比较有用的。 二 什么浏览器支持 Cons
阅读全文
摘要：创建具备特定类型的对象可以通过使用new关键字用构造函数模式来完成。function Emp(){ this.name="Ray";}var p = new Emp();在这个过程中，相当于以Emp()为“模版”创建了一个新对象p，它具备Emp构造器中的成员变量和构造器原型。并且Emp将this设置为p过程模拟:var p = {};Emp.apply(p);p.__proto__=Emp.prototype;用new声明的对象才能有Emp的属性。(通过this定义的)例如 var q = Emp();q === "undefined"这是因为函数默认返
阅读全文
摘要：Ctrl 和 Shift限定(IEOnly)document.onmousewheel=function(){ if(event.ctrlKey||event.shiftKey) { event.returnValue=false; }}
阅读全文
浙公网安备 33010602011771号