- 浏览: 1461439 次
- 性别:
- 来自: 上海
最新评论
-
luhouxiang:
写的很不错,学习了
Extjs 模块化动态加载js实践 -
kingkongtown:
如果想改成淘宝后台那样,可以在编辑器批量上传图片呢?
kissy editor 阶段体会 -
317966578:
兄弟我最近也在整jquery和caja 开放一些接口。在git ...
caja 原理 : 前端 -
liuweihug:
Javascript引擎单线程机制及setTimeout执行原 ...
setTimeout ,xhr,event 线程问题 -
辽主临轩:
怎么能让浏览器不进入 文档模式的quirks模式,进入标准的
浏览器模式与文本模式
文章列表
url 映射问题
- 博客分类:
- javascript
背景
url mapping 我最早知道是作为 java web 容器的一个功能点,遵从 servlet 规范
,大致的形式是通过在配置文件中配置 url 路径和指定 servlet 的对应关系,当请求过来时根据 url 路径来调用相应的服务器端逻辑。
例如:
<servlet-mapping>
<servlet-name>milk</servlet-name>
<url-pattern>/drink/*</url-pattern>
</servlet-mapping>
那么凡是以 ...
tip:如何原生播放声音
- 博客分类:
- javascript
如果不想考虑浏览器间的兼容性就用 flash , 但如果考虑普适性,还是使用浏览器提供的原生功能比较好,这时就要对各个浏览器的特性特别区分下:
1. html5 compatible
audio 使用起来挺简单,但要注意是的:
1.需要真正生 ...
为了处理原生事件在各个浏览器下的兼容性,上次提出了应对原生事件的事件模型,但随着web的多样性以及新功能需求,常常需要自行实现 ui 组件,例如 树,按钮,菜单等,实现时推荐尽量和原生组件(select , input 等)保持一 ...
简介
如果你经常网上冲浪,这样参差不齐的多栏布局,是不是很眼熟啊?
类似的布局,似乎一夜之间出现在国内外大大小小的网站上,比如 Pinterest (貌似是最早使用这种布局的网站了),Mark之,蘑菇街,点点网,以 ...
场景
跨域请求是随着应用服务化而越来越多遇到的问题,大体分为两类
1. 子域间通信:a.t.com 要和 b.t.com 通信
2. 完全不同域间通信:t.com 要和 m.com 通信
1 可以看做是 2 的特例,不过解决方法更简单点.
解决方案
完 ...
分类
树是一种常见的 ui 组件,在桌面以及 web 中都经常看到,常见的表现形式有
简单树:
多选树:
如何设计?
针对树的两种主要分类,这次主要讨论 DRY ,怎么能把重复的功能拆成独立的单元而最 ...
作为前端开放的基础安全保证,caja
是目前比较合适的运行机制,包括前端运行环境以及后端编译环境,这次先整体介绍下 caja 在前端是如何屏蔽外部模块代码对整体应用的影响 (注意:官方文档较少,以下为自己理解,难免偏颇).
组成部分
1. 整体运行环境:隔离模块与宿主环境,并提供外部应用与模块的沟通机制.
2. 提供 ecmascript5 以及 dom2 的全平台兼容实现,注入到运行环境中。
es5 部分通过直接修改本地原生对象原型实现,运行时直接使用原生对象,这种做法值得推荐
。
其中比较重要的是:模拟实现 es5 中的属性描述 ...
html 符号解析问题
场景:
在页面上输出包含已有数据的 textarea ,一般的做法即是,将所有的数据从数据库取出后都 escapeHtml
一下:
<textarea><script>if(a&&1)alert(1);<script></textarea>
页面瞬时增大了很多,特别是对于富文本情况(包含了很多 < > &) 等,但这又是必须做的,否则会被恶意结束 textarea 标签而造成 script 注入问题,但还是 ...
这个还是很值得记下,一直存在的很大隐患终于解决,由于在 ie<9 中存在内存泄露
,我们经常采用类似 data
的方式来存储数据(其实是将数据关联到节点),但另一方面 ie<9 下又存在 attribute-property 混淆现象
。
那么当我们通过 data 存储数据时,其实节点上只是存放了一个指向存储数据的指针,这个指针作为 expando 存在于节点上,
node.expando=pointer
当调用 cloneNode
时对于其他浏览器都没影响,得到的新节点没有源节点的 expando ,而在 官方 msdn
却有很不起眼的一行 ...
深度复制和浅度复制
是当初初学 c 遇到的第一批问题,似乎使不少人困惑,而类 c 的 javascript 也同样存在这个问题.
第一版:
javascript 中引用类型(Object.prototype.toString.call(object))有 : Array 以及 Object , Date , RegExp ,Number, Function,Boolean .而可以修改自身的包括:
Array : 可修改自身单个元素
Object : 可修改自身单个属性
Date : 可修改自身日期,年份等
RegExp : 可修改 ...
模块的静态与动态循环依赖
- 博客分类:
- javascript
场景:
循环依赖
我是不支持的,但现实中似乎又确实需要循环依赖,例如前端的选择器场景 (ie<8):
首先实现了 DOM 模块来保证各个浏览器的兼容性以及 api 的易用性,其中包含必要简单的选择器逻辑
然后实现了高级选择器模块,但这并不是最常用,为了效率该模块是不放入核心 DOM 模块中的,而选择将它作为独立模块 :selector,显然 selector 模块依赖于 DOM 进行 dom 遍历.
S.add("selector",function(){
},{requires:["dom"]});
...
元素的可视矩阵(区域)计算
元素常常需要展现在用户的可视区域内,而元素是否出现在用户的可视区域实际上受以下因素的限制(目前已知,待补充) :
窗口 ( viewport
) 限制,随浏览器滚动条变化
自身是否使用了脱离文档流的定位 ( absolute fixed
)
父(祖先)元素是否定位
父(祖先)元素包括祖先元素是否设置了 overflow != visible
,限制了子孙元素的展现
我想要做的事情就是根据以上因素,确定可供元素展现的可视矩阵,后期再通过移动或缩放尽量智能得将元素放在这个矩阵内.
例如:
A ...
spring
基本不用介绍了,是目前最好的 IOC 容器了,它的 mvc 架构也十分出色,特别是基于标注的开发方式,免除了大多数框架庞大配置的缺点。而 mustache
则是新兴的模板语言,难能可贵的是在各个主流语言下都有对应的解析器,恰好有机会尝试将 spring mvc 的 view 层替换为 mustache ,感觉很不错~~
1.写个 controller
public class Product{
private String name;
// setter . getter
}
@Controller
public ...
事件模型也算是客户端兼容性的一个长期问题,早期 jquery 作者甚至因为这方面获过奖
?一般来说 attachEvent
以及 addEventListener
已经基本够用,特别是 attachEvent 可以给回调传递事件参数
了,不用考虑怪异的 window.event
div.onclick=function(){
alert(window.event==window.event); // => false
setTimeout(function(){
alert(window.event) // => null
},0);
}
...
场景:
在 xx.com/y.html
代码为:
<iframe id='ok' name='ok' src='http://zz.com/w.htm?authKey=ertwg'></iframe>
w.htm
需要根据 authKey
写入 cookie
,授权 y.html
嵌入 zz.com
站点的其他页面(例如即时重定向到另一个页面显示写入的 cookie
)。
w.htm
内容为:
if (request.getParameter("authKey") != null) {
...