存档
FireFox 的插件 ColorZilla 利用 ColorZilla 您可以从浏览器中的任一点读取色彩值，快速调节颜色并粘贴到其他应用程序。您可以缩放正在查看的页面或测量页面任意两点之间的距离。内建的调色板浏览器允许您从预定义的颜色集中选择颜色或将最常用颜色保存到自定义调色板。DOM 侦测功能让您可以快速、容易地获得关于 DOM 元素的各种信息。还有更多功能…… Web Developer Web Developer 作为 FireFox 的插件存在，主要功能表现在几个重要的方面： 对页面中的文本、图像、媒体文件进行控制，对网页所应用的CSS文件的id与class辅助查看，表格辅助查看，可以实现修改 CSS文件实时显示出得到的页面效果等等。 Web Developer 插件能够帮助我们对 CSS 网站进行分析，我们使用 FireFox 对网页进行浏览，运用 Web Developer 插件不仅仅只是能看到对方的源代码，还能方便的分析出页面的布局结构，CSS 书写方式，鼠标所在位置的id或class是什么等等，使 我们能迅速的理解、学习别人的成功经验，进而更加方便快捷的掌握 CSS 布局技术。 Firebug Firebug 和 firefox 整合在一起，使你浏览网页时手边有了一套强大的网页开发工具。你可以编辑、调试和监控任何网页上的 CSS、HTML 和 Javascript 。要查阅文档、截图和论坛请访问Firebug的网站：http://www.getfirebug.com YSlow YSlow 是 Yahoo 美国开发的一个页面评分插件，基于 Firebug, 非常的棒，从中我们可以看出我们页面上的很多不足，并且可以知道我们改怎么却改进和优化。YSlow 从 Firebug 收集当前网页和该网页的访问信息后进行分析，如有必要则给出如何提高页面加载速度的建议，比如减少 DNS 查询，使用外部并压缩 Javascript 等。
如果 Web 是一位世界名流，那么 2009 年的报纸头条可能包括：“云计算与服务器的亲密接触”、“外星来客 Twitter：‘我们为和平而来’” 和 “真人 TV 秀中的 Gosselin：8 个浏览器就足够了”。 毫不夸张地讲，云计算、实时内容以及浏览器速度和功能上的进步使 Web 比以往更引人注目了。健壮的基础设施 —— 从用于存储的 Amazon 简单存储服务 (S3) 到实现了可扩展电子邮件功能的 SendGrid —— 现在只需单击几下鼠标就可以租用。在任何时刻从任何地方发送的 Tweets 和 Flickr 更新成为了即时信息的特征，是一项必须满足的社会需求。Google Chrome、Apple Safari、Mozilla Firefox 和 Windows® Internet Explorer® 之间的激烈竞争使浏览器逐渐向独立平台转变，而 Chrome 成为了全新的操作系统的核心。 当然，在 2010 年，追逐技术发展的热心记者将继续跟踪这些故事，挖掘关于微软自己的云产品、Twitter 的艰辛发展以及浏览器开发者之间的竞争的抢先报道和图片。但是其他软件、开发和趋势等在 2010 年必定会成为开发人员所关注的头条新闻。让我们预测一下在技术报道中会看到哪些重要新闻。 HTML 的大力整改 这并不是对刚出道的明星进行整形手术。流行的超文本标记语言也正在进行大变脸。毫不奇怪，已有 10 年历史的 HTML 格式正在努力跟上创新的步伐。毕竟，HTML 是发明用来构造和打包文档的，而不是处理 Web 应用程序。 HTML [...]
8，尽量使用ID代替Class。 前面性能优化已经说过，ID选择器的速度是最快的。所以在HTML代码中，能使用ID的尽量使用ID来代替class。 看下面的一个例子： // 创建一个list var $myList = $(‘#myList’); var myListItems = ‘<ul>’; for (i = 0; i < 1000; i++) { myListItems += ‘<li class=”listItem’ + i + ‘”>This is a list item</li>’; //这里使用的是class }
4，对直接的DOM操作进行限制 这里的基本思想是在内存中建立你确实想要的东西，然后更新DOM 。 这并不是一个jQuery最佳实践，但必须进行有效的JavaScript操作 。直接的DOM操作速度很慢。 例如，你想动态的创建一组列表元素，千万不要这样做,如下所示： var top_100_list = [...], // 假设这里是100个独一无二的字符串 $mylist = $(“#mylist”); // jQuery 选择到 <ul> 元素 for (var i=0, l=top_100_list.length; i<l; i++){ $mylist.append(“<li>” + top_100_list[i] + “</li>”); }
1，总是从ID选择器开始继承 在jQuery中最快的选择器是ID选择器，因为它直接来自于JavaScript的getElementById()方法。 例如有一段HTML代码： <div id=”content”> <form method=”post” action=”#”> <h2>交通信号灯</h2> <ul id=”traffic_light”> <li><input type=”radio” class=”on” name=”light” value=”red” /> 红色</li> <li><input type=”radio” class=”off” name=”light” value=”yellow” /> 黄色</li> <li><input type=”radio” class=”off” name=”light” value=”green” /> 绿色</li> </ul> <input class=”button” id=”traffic_button” type=”submit” value=”Go” /> </form> </div>
一些简单的代码简化 下面是一个简单示例，它说明了 jQuery 对代码的影响。要执行一些真正简单和常见的任务，比方说为页面的某一区域中的每个链接附加一个单击（click）事件，您可以使用纯 JavaScript 代码和 DOM 脚本来实现，如 清单 1 所示。 清单 1. 没有使用 jQuery 的 DOM 脚本 var external_links = document.getElementById(‘external_links’); var links = external_links.getElementsByTagName(‘a’); for (var i=0;i < links.length;i++) { var link = links.item(i); link.onclick = function() { return confirm(‘You are going to visit: ‘ + this.href); }; [...]
1、$fx() （仅3.7K) 简介：$fx()是一个轻量级的动画库，一些复杂的动画，可以由多个简单的动画效果进行组合，但是提供的是混淆压缩过的代码，对于研究动画源码的朋友可能特别不爽 API：http://fx.inetcat.com/manuals.php 主页: http://fx.inetcat.com/
最新评论