奇技淫巧？其实不能算是什么特别的东西，但有些小技巧还是可以试试的，比如说第一个，我们一般都会是用setInterval，然后每1秒执行一次，10秒后取消，但setTimeout也可以。只是意义不大而已喽
原文来自：http://www.cnblogs.com/nothingbrother/archive/2011/12/19/2293131.html
应用案例:比如你想一个函数循环执行10次,怎么办?以前通常是先setInterval,然后clearInterval,技巧一就是克服这个问题
JavaScript代码
- (function () {
- var i = 0;
- function job() {
- console.log(i++);
- if (i < 10) {
- setTimeout(job, 1000);
- }
- }
- job();
-
- })();
上面这个job函数就只会乖乖的执行10次.然后自动停止
技巧二之高效的for循环
应用案例:抛弃传统的循环方式
JavaScript代码
- (function () {
- var arr=[];
- for(var i=arr.length;i--;){
- doStuff();
- }
- })();
这个方式为什么高效?
一:少了一个参数l=arr.length;
二:for语句中间那个玩意少进行了一次计算,以前的话是for(i=0;i<l;i++)这样的话中间的语句会先比较i<l 然后比较出来的结果在
跟true 或者false比较,自然多了次计算
技巧三之高效赋值
应用案例:抛弃传统的if判断赋值
JavaScript代码
- var i=1,ret;
- ret=i!==1||true;
- console.log(ret);
以上代码会很神奇的告诉你ret会是true.高效吧不用if(i!==1)了在赋值了
技巧四之强悍的简短的attr
应用案例:setAttribute,getAttribute.这个方法不仅可以设置标准的属性,还可以设置任意属性,兼容好
JavaScript代码
- function attr(elem, name, value) {
- var ret;
- if (value) {
- if (/msie [6-7]\.0/i.test(navigator.userAgent)) {
- ret = elem.getAttributeNode(name);
- if (!ret) {
- ret = document.createAttribute(name);
- elem.setAttributeNode(ret);
- }
- ret.nodeValue = value + "";
- } else {
- elem.setAttribute(name, value);
- }
- return elem;
- } else {
- ret = elem.getAttribute(name);
- fixIe = elem.getAttributeNode(name).nodeValue;
- ret = ret ? ret : fixIe ? fixIe : undefined;
- return ret;
- }
- }
以上方法如何测试呢?
attr(document.getElementById("test"), "classxx", "xx")
alert(attr(document.getElementById("test"),"classxx"));
技巧五之getElementsByClassName.
应用案例 :以前js没什么框架的时候,大家都再模仿这个方法,看看今天我是怎么高效的模仿出它来.这也不愧是js初学者的经典代码
JavaScript代码
- (function () {
- var getElementsByClassName=function(cls,context){
- var root = context || document;
- return document.querySelectorAll ? root.querySelectorAll("." + cls) : root.getElementsByClassName ?
- root.getElementsByClassName(cls) : help("*", cls, context);
- }
- var help=function(tagName,cls,context){
- var root= context || document,
- ret=[],elems,i,
- rcls=new RegExp("^|\\s+"+cls+"\\s+|$");
- elems = root.getElementsByTagName(tagName || "*");
- for(i=elems.length;i--;){
- if(rcls.test(elem[i].className)){
- ret.push(elems[i]);
- }
- }
- return ret;
- }
- })();
以上几个js淫荡技巧还是蛮实用的,前提是你没用使用别人的js框架,用原生创造效率为前提的代码.
----------
上面的代码其实真要说的话也就这样样了，但如果你以前没有接触过原生代码，还是可以折腾的。比如最后一个函数，在JS的高版本中（或者说FF5以上，Safari5以上，）都在支持了querySelector了。这个玩意可是直接支持.class或者#id之类（就象jQuery的选择器）
多学一点东西还是有好处的。
这也太夸张了吧。。。。用javascript实现jvm来运行java???
看到这个新闻我真的震精了，javascript什么时候也变得这么牛了？也就是说我们在javascript上都看轻了很多。
上原新闻：
Java不同于一般的编译语言和解释语言。它首先将源代码编译成字节码，然后依赖各种不同平台上的虚拟机来解释执行字节码，从而实现了“一次编译、到处执行”的跨平台特性。借助JavaScript引擎性能提升的东风，程序员Artur Ventura在JavaScript中实现了JVM虚拟机大部分标准，在Github上发布了BicaVM的源代码。
原文来自：http://developers.solidot.org/article.pl?sid=11/11/22/1129220&from=rss
真的很惊讶，原来javascript可以这样牛。
其实这很正常，也不意外，这么久了。。。也该正式版了
不过，jQueryMobile里我想找那个DoubleTap事件也没有好好找到。可能是我没有仔细关注吧？
然后一些clientX移动的事件，也不是特别的爽。。。
OK，去官网看看吧，http://jquerymobile.com
官方说这次正式版的性能提高了很多，在这里有一张图片：http://jquerymobile.com/blog/2011/11/16/announcing-jquery-mobile-1-0/
demo其实也能看，不过要好效果的话，还是建议使用webkit核心的浏览器：Demos & Documentation
今天在为ipad上的一个图片加上点击效果，在safari浏览器里一切正常，但到了ipad上，点击效果就死活出不来。
折腾了很久我才发现，我原来的触发的一个效果是写在a标签上的，也就是说，它是一个链接，然后onclick效果就起作用了。
于是我CreateElement了一个a，为它加上了onclick效果，果然，起作用了。。
------------
事实上很多人都和我说，div是有onclick事件的，嗯，我用Safari也测试确实有，但就是在ipad上无法实现。好吧。我承认我烂，可能是。。。。
可是我都一一在代码中测试了。
附上我那恶心至极的代码 （这是其中的一段，纯备份了）：
JavaScript代码
- function ee(elem,popLayer) {
- var e = document.createElement("a"),scb=popLayer[0].querySelector('.showCaptionBody');
- e.setAttribute("href", "###");
- e.style.cursor = "pointer";
- e.style.position = "absolute";
- e.style.zIndex = 9;
- e.style.display = "block";
- e.style.right = "3px";
- e.style.bottom = "3px";
- e.style.width = "16px";
- e.style.height = "16px";
- e.style.backgroundImage = "url(data:image/gif;base64,R0lGODlhEAAQAIAAAMzMzP///yH5BAAHAP8ALAAAAAAQABAAAAIahI+py+0RHILy0Aoug7zH5HnPV2mSOWLqihUAOw==)";
- e.onclick = function() {
- var s = document.createElement("img");
- s.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAAElSURBVEiJ1ZZNioQwEIVfhiYXqtmIIIokJxaRuEgOYM7hCdxas2gMbWKrDJ1FF9SmKr7PpJ4/gpmRMx4AIISYcogz8+9PDuHXeERE+oSoEMIfAtZ1/YT+LuId5AXk2MFuyOu67lJKiaIokvqWRVFASpnU3wKYeZdEBO89yrJMemVZwnsPIkp6iEUBTACmZVk4TiJiAExEp7XX3PSY+XoGzjnUdQ3vPaqqAoBw5865y7ndcpG1Fk3TwPunvYkI1tpbrvu3i+6uvQVQSoVjAZ5H1LYtxnG8BJy6iJl34sYYGGOCu5RSh9e8BcR+1loH8WEYQn0YhgDRWt9/DuKFm3jf90mv7/sAOQOczmCe58P6Fl3XnfYTwFe+7LIDBDN/9zdZ5P5t+QPZ7357iXsw1QAAAABJRU5ErkJggg==";
- scb.innerHTML = elem.innerHTML.split("\n").join("<br />");
- scb.removeChild(scb.querySelector("a"));
- scb.appendChild(s);
- popLayer[0].style.display="block";
- popLayer[0].querySelectorAll(".closeShow")[0].onclick = function(){
- popLayer[0].style.display="none";
- }
- };
- elem.appendChild(e);
- delete e;
- }
阿强说，是因为div没有宽度和高度，我说是100%,他说100％的话就是0。
好吧，我不是前端，我开始的时候没明白，但我没有时间来处理，我也没有空设定固定宽度，因为要考虑横竖屏。。所以先用临时方法替代了。
很明显，这段内容是ctrl+c,ctrl+v而来的，做备份和资料查询用，挺好的。
原文来自：http://www.chencheng.org/blog/2008/10/25/f2e-manual/#f2e-manual-s1
快捷导航：
另外还搞了个Firefox插件《前端开发工具集》，把资源整合到一个菜单下，方便查询。数据放在线上(Google AppEngine)，速度应该会有保证，更新也会比较方便。
在线工具集
- 书籍类：
- JavaScript类：
- CSS类：
- 其他：
常用Firefox插件
IE下的调试工具
- Fiddle2 —— 非常强悍的一款http流查看工具，默认支持IE，其他浏览器可以设置将{Document}\Scripts\BrowserPAC.js设为代理进行使用。Firefox下可用上述”Fiddler 开关”进行快速切换。支持插件。
- IE Developer Toolbar —— 查看元素、禁用缓存、禁用CSS\JS、Outline元素、查看生成的源码等功能，IE8自带了一个加强版的。
- Microsoft Script Debugger + Companion.JS —— 调试JS用，虽然报错还是有误差，但是我已经满足了。安装顺序是：Microsoft Script Debugger，Companion.JS，在”IE选项-高级”里取消禁用脚本调试。
- 多版本IE共存两种方案：
- IE7/8 + IE Tester —— 大众型配置，可以基本满足日常需要。
- IE6 + Internet Explorer Collection —— 在IE 6用户占绝对优势以及IE 6神奇bug满天飞的时代，我还是推荐这种方案，因为只有神奇的原装IE 6，才能抵挡运营神奇的问题。另外如果还有其他机器可供支配的话，建议再装个IE 8 + IE Tester，因为IE 8下的Developer Toolbar还是有很大改进的，调试起来会方便一些。
- 以下三个软件相对不重要些：
参考手册
批处理工具
IDE及其他工具
Bookmarklet(右键另存)
开发者社区及权威网站
推荐订阅的博客和网站(排名不分先后)
－－－－－－
看了上面的内容，其实可以感觉得到国内的站点是什么样的。个人博客中还是有很多人研究一些东西，但走来走去，还是那些人的小圈子。你说呢?
如果你打不开原文地址的话，那么我就不得不说几句了，有时候，有个个人博客还是很有用的。
1、记录自己的开发心得，用与和其他人交流
2、摘抄一些信息，用于做数据的储存
3、也正是有了博客，除了做交流外，还能赚一些域名费和空间费（当然，我的服务器是我自己买 的和托管的，巨亏啊）
