Posts Tagged ‘javascript’

jquery 学习笔记

推荐书籍 
Learning jQuery Better Interaction Design and Web Development with Simple Javascript Technigues
author Jonathan chaffer & Karl Swedberg
 
 
选择语法
$(‘#goods_category dd’) or $(‘#goods_category dd:not(.red)’)
$(‘a:odd’).addClass(‘red’) or $(‘a:even’).addClass(‘green’)
$(‘a’).filter(‘:odd’).addClass(‘red’);
 
获取某个dom元素 
alert($(‘#goods_category dd:not(.red)’).get(0).tagName) or alert($(‘#goods_category dd:not(.red)’)[0].tagName);
 
事件绑定
.bind() and unbind()
.bind(‘click’ function(event){}) = .click(function(event){})
.toggle()   .toggleClass() 切换
 
事件传播与默认操作
.StopPropagation()
.preventDefault()
如果处理事件函数返回 false 将同时执行两着
 
事件只绑定后只使用一次使用
.one()
 
模仿用户行为
.trigger(‘click’) = .click()
 
数据的批量提交
.find(‘input’).serialize() 需要hack一下,当多选项时有问题,可以自己修正一下
 
jquery 1.4版本以后增加
.slice()
你可能在javascript数组里见过这个方法–这对你来说太幸运了,因为他们的所产生的行为是一样的。这个方法用来从匹配的jQuery对象中分离出一部分jQuery对象的再好不过了。下面是调用slice()方法的一些正确方式:
 
JavaScript代码
$(“div”).slice(0,1); // 第一个 div   
$(“div”).slice(-1); // 最后一个 div   
$(“div”).slice(1,-1); // 除第一个最后一个的所有 div
$(“div”).slice(1,3); // 第二个和第三个 div
$(“div”).slice(7,8); [...]

js检测firefox3是否读取了缓存页面

firefox 3 浏览器会忽略

等标签。详情请参看 https://bugzilla.mozilla.org/show_bug.cgi?id=327790#c8.
这样在某些情况下即使用户使用强制刷新页面,firefox仍然会去读取他的高速缓存,而根本没去请求服务器。
在ecmall后台使用的一个解决方法是:在页面onload事件中,用js去检测当前页面是否是缓存页面,如果是,则在但前页面url后面加上一个时间戳后,在reload一下,就能获取到最新的页面。
检测原理如下:
服务器每次请求都把请求时间写入cookie,要防止缓存的页面把页面修改时间也该改当前请求时间。页面onload事件中用js检查是否两个事件是否一致,如果页面修改时间小于cookie中时间,说明该页面是从高速缓存中读取的。
php中设置cooke请求时间代码:

set_cooke(‘lastModified’, gmdate(‘D, d M Y H:i:s’));

php设置稳定修改时间代码:

header(‘Last-Modified: ‘. gmdate(‘D, d M Y H:i:s’) . ‘ GMT’); //last modified

js检测代码

//只有firefox 3 才检查
if (navigator.userAgent.toLowerCase().indexOf(“firefox/3″) != – 1){
$doc_last_date = new Date(document.lastModified);
//document.getCookie 是emall获取cooke的一个函数,具体代码会js都应该知道吧
$cookie_last_date = new Date(document.getCookie(‘lastModified’).replace(/\+/g, ‘ [...]

js缓存类 Storage.js

这个是可以将用户数据缓存到本地浏览器.据说可以缓存100k以上数据,支持ie,firefox2以上,不占用cookie.当cookie 数据太大时这个可以是首选.
以下是Web boy 为 ecmall 写的一个缓存类.
写得很优美的一个类. 所有方法使用动态绑定.在确认浏览器后才把对应的方法绑定上去.
该类使用了ecmall自己的框架,我把涉及的部分都放到Storage类后面.该类还缺一个json解析类,可以自己去找.

var Storage = new Object();
Object.extend(Storage, (function(){
var _storage = false;
if (navigator.isIE()) document.documentElement.addBehavior(“#default#userdata”);
if (typeof(sessionStorage) != ‘undefined’) _storage = sessionStorage;
if (navigator.isIE()){
var _add = function(key, value){
with(document.documentElement)
try {
[...]