j2ee之前端分享_补充后几页.pptVIP

J2EE之前端分享 开发和调试 插件利用 性能 易错点 开发和调试 查看元素绑定事件 开发和调试 开发和调试 开发和调试 插件 HostAdmin 插件 Firebug FireQuery 插件 HttpRequester 插件 UserAgentSwitcher (切换useragent 方便调试手机页面) 插件 Fiddler2 替换文件在线调试 模拟慢网速 性能 保持从一个#ID来继承 div id=content form method=post action=/ h2Traffic Light/h2 ul id=traffic_light liinput type=radio class=on name=light value=red / Red/li liinput type=radio class=off name=light value=yellow / Yellow/li liinput type=radio class=off name=light value=green / Green/li /ul input class=button id=traffic_button type=submit value=Go / /form /div 单个var traffic_button = $(#traffic_button); 多个元素var traffic_lights = $(#traffic_light input); 性能 缓存jquery对象 //不推荐这样使用 $(#traffic_light input.on).bind(click, function(){...}); $(#traffic_light input.on).css(border, 3px dashed yellow); $(#traffic_light input.on).css(background-color, orange); $(#traffic_light input.on).fadeIn(slow); //先保存对象到一个本地的变量中，再进行操作，如下： var $active_light = $(#traffic_light input.on); $active_light.bind(click, function(){...}); $active_light.css(border, 3px dashed yellow); $active_light.css(background-color, orange); $active_light.fadeIn(slow); 性能 减少直接的DOM操作 var top_100_list = [...], // assume this has 100 unique strings $mylist = $(#mylist); // jQuery selects our ul element for (var i=0, l=top_100_list.length; il; i++) { $mylist.append(li + top_100_list[i] + /li); } 应该这样 var top_100_list = [...], // assume this has 100 unique strings $mylist = $(#mylist), // jQuery selects our ul element top_100_li = ; // This will store our list items for (var i=0, l=top_100_list.length; il; i++) { top_100_li += li + top_100_list[i] + /li; } $mylist.html(top_100_li); 性能 利用强大的链接 var $active_light = $(#traffic_light input.on);$active_light.bind(click, function(){...}) .css(border, 3px dashed yellow) .css(background-color, orange) .fadeIn(slow); 易错 JavaScript 是弱类型语言，这就意味着，等于操作符会为了比较两个值而进行强制类型转换。 == 0 // false 0 == /