便便代码人生

关注技术, 偶尔动动手

Archive for the 'JavaScript' Category

All about JavaScript, :)

Next Entries »

[原] 整理了小百合BBS的Javascript脚本，注意关键字

Posted by bianbian on 2008-02-29 12:56


本文Tags: , ,

随着脚本越来越大，原有的funtion式已经不利于维护。
正好凑着有兴致，一个通宵把Net库完善了一下，Net.Dom, Net.Event, Net.Drag, Net.Dialog, Net.Ajax等，应该能满足日常需要。
另外把BBS的脚本分类到Net.BBS, Net.BBS.Html等命名空间下。
现在pack了以后约50K，以后会更大一点。
有兴趣的可以提意见：http://bbs.nju.edu.cn/jssrc/bbs.full.js
另外谢谢oznyang@Lilybbs指出，Javascript关键字在IE里要小心，其实IE也该聪明一点，很显然是个属性嘛：

  1. addComm: function (id) {
  2.   var url = Net.Util.toQuery("pntcomm", {board: G.c.Brd, "id": id, do: "add"});
  3.   //上句do是关键字，在IE里会报错“缺少标识符、字符串或数字”，应该"do"引起来
  4.  }

人累了确实会变笨，这么低级的错误debug了我几个小时。哎。。。更关键的是IE这个SX报错不准确，再度鄙视

标签: , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 4 Comments »

[啊] 淘宝整天改版，自动发货又升级

Posted by bianbian on 2007-11-16 10:02


本文Tags: , ,

自动发货的又要改了。
现在淘宝的发货页面用了Yahoo UI Library，每个按钮都用了后期事件绑定，每个事件又和很多代码相关，于是分析起来比较困难。估计是故意的。
经过1个小时的代码分析。终于搞定。
其实偷偷告诉大家，不需要分析那些事件到底改动了哪些form里的数值。
因为我们的脚本能控制页面的所有元素，把form改成我们需要的样子submit上去就OK了。
帖主要代码：

  1. //发货
  2. gFrm["_fmu.g._0.goo"].value = gTips[gID];
  3. //先把页面里的几个发货单全删了
  4. $(d, "reComPartners").parentNode.removeChild($(d, "reComPartners"));
  5. $(d, "otherPartners").parentNode.removeChild($(d, "otherPartners"));
  6.  
  7. var div = d.createElement("DIV");
  8. var divHTML;
  9. if (gID <= 1) //邮政
  10. {
  11.     divHTML = '<input type="hidden" name="companyCode1"  value="POST"/>' +
  12.         '<input type="hidden" name="checked1" class="hidden logis:chooseCompanyId"   value="true"  />' +
  13.         '<input name="mailNo1" value="' + (gID > 0 ? hh : "POST") + '" />';
  14.     gFrm["methordId"].value = 0;
  15. }
  16. else if (gID == 4) //韵达
  17. {
  18.     divHTML = '<input name="orderType" type="hidden" value="2" />' +
  19.         '<input type="hidden" name="companyId"  value="102"/>' +
  20.         '<input type="hidden" name="companyCode"  value="YUNDA"/>' +
  21.         '<input type="hidden" name="checked" class="hidden logis:chooseCompanyId" value="true" />' +
  22.         '<input name="mailNo" value="' + hh + '" />';
  23.     gFrm["methordId"].value = 1;
  24. }
  25. else if (gID == 2) //南京100
  26. {
  27.     divHTML = '<input name="companyCode1" value="OTHER" />' +
  28.         '<input value="南京壹零零速递" name="companyName"/>' +
  29.         '<input name="checked1" value="true">' +
  30.         '<input name="mailNo1" value="' + hh + '" />';
  31.     gFrm["methordId"].value = 0;
  32. }
  33.    
  34. div.innerHTML = divHTML;
  35. gFrm.appendChild(div);
  36. gFrm.submit();
标签: , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | No Comments »

[原]一种blog日历的JSON压缩输出算法

Posted by bianbian on 2007-10-17 11:56


本文Tags: , , ,

一般高效的blog日历会将所有发表日期单独存储到js中，由客户端脚本负责输出日历链接。
以前都是按yyyymmdd输出blog日历的，如果发文多的话会特别长（特别是几年下来）。
最近用JSON输出blog日历的时候，发现一种更简单、更高效、更省数据量的方法：

{
"年份":["一月天", "二月天", ...., "五月天", .... , "十二月天"]
}

即年份作为JSON属性，值是十二个月天数构成的数组（五月天纯粹是增加关键字 – -）。
一个月最多有31天，如果用数字表示得用62个长度的字符。我决定用单个可打印字符的ASCII码代替。
在ASCII表里找了一段：从61-91（”=>?@ABCDEF……UVWXYZ["）满足要求（刚好是天数+60）
于是，原来比如2006每个月各发表1篇blog的数据从：

"20060111,20060212,20060313,20060414,20060515,20060616,20060717,20060818,20060919,20061020,20061121,20061222"

就可以压缩到（106是linux下struct tm的year，是1900+的，106+1900=2006）：

{"106":["G","H","I","J","K","L","M","N","O","P","Q","R"]}

当然这只是一个特殊例子，实际上用户写blog都有一段时间的连续性。用这种办法输出的日历数据在
数据量大的情况下会更加省空间。（显然原来的方法重复了很多年份、月份数据）。
下面是一个勤劳用户从04到07年的blog日历（几乎天天有文章更新）：
总数据量1K不到，如果用yyyymmdd的方法估计要是这个的5-6倍

b_date={"104":["=@DEGJO[","?CGHLP","BDEHIPTUY[","?ELNOPQRSUVZ","?ABGIKLMOPSTZ[",">CHIJLMNOPSUX",">AFGNT[",">GNOPQV","DUWZ","BDGHKNOQR","=?CDFLNOSTUVXYZ","=>?@BCDEFIJOPQSTWXYZ["],
"105":["?@BCEFGHIJMNOPQSTUV[","=>?@ABCGIJKLMNOPQRSTUVWX","=>?@ABCDEFGHIJKLMNOP","VWXYZ","=>ABCDEFGHIJLMN","BCDEFIJKLMOPQRSUWXYZ","=?@BCDEFGHIJNOPQRUVWY","=>BNRSUVWZ",">ABCDFGHIJKMOQTVWYZ","DEFGHIJLNOPQRUVW[","=>?@BCDEFGHIJKLQSTWXZ","=>@AHIJKNOPQRSVYZ"],
"106":["@ABFILMOPSTU",">DEFGIJKMNPQ",">BCDEFGHIJKOPQSTWXYZ","=?@ABEFGHIJLMNOPQRSTUVWX","DFLNORY[",">ABEFGHIJLOPQSUVWZ","=>ABCEFIJMNQUVW[","=>CEIJORSTUXYZ[","=>ACEGHKOPQRTUVWX","?@BDEFGHIJLNOPQSTUVWX","=>?AFHIJOPQSTWXYZ","=ABCGJNORUV["],
"107":[">@JKLNOPQRSTUVWXY[","=>?BDFGIKLSTUVWX",">@ABCEGHIKOPQRUVWXY[","=ABEFGHIKLMOPQSUVWXZ","?CDFHIJKLMNOQRSTUVWYZ","=?@ABCDEFGHIKLMNOPQRUWY","=?ADFGHIKMNOPSUWZ[","=>?@ABCDFGHIKLMNOPRSVWXY",">?@ABCDEFGIJKMNPQRTVXY",">ACDEGHJKL","",""]
}

用客户端Javascript解析的时候也比原来方便直接。原来需要split然后循环判断（如果排序了可以用二分法）。而JSON不需要这种解析，直接可以拿来用：使用String.fromCharCode(60+天)获得某天的字符，然后在当月中查找一下：

  1. //b_date={}
  2. function HasPost(Y, M, D)
  3. {
  4.     if (!b_date)
  5.         return false;
  6.     if (!b_date[Y])
  7.         return false;
  8.     var ds = b_date[Y][M];
  9.     return (ds.indexOf(String.fromCharCode(60+D)) > -1);
  10. }

（当然，如果要更省空间，甚至可以把各月的数据用一个字符串表示、用逗号隔开；不过这样就得在客户端split然后再解析了。我认为这是不必要的：每年只省下22个字节而已）

标签: , , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 3 Comments »

[原]iframe跨域访问解决方案

Posted by bianbian on 2007-08-24 03:09


本文Tags: , , ,

跨域访问提示“没有权限”，真是伤脑筋。研究几天以后，终于得到了所有解决方案。
如
A：www.bianbian.org
B：test.bianbian.org
C：www.other.com
从A跨域访问B、C，并能控制B、C的页面内容

方案（1）目标页面是自己的（即可以改页面输出），从A->B
最简单的，在B页面输出个

  1. <script>document.domain="www.bianbian.org";</script>

骗骗浏览器就行了，在IE下测试成功。由于我的应用只需要IE，未测试其他浏览器

方案（2）目标页面是别人的，从A->C
比较头疼，只能用后台语言 2.1）做个proxy，2.2）做个JS输出（类似JSON方式了）

标签: , , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 9 Comments »

[原] 淘宝(taobao.com)卖家自动好评工具

Posted by bianbian on 2007-08-01 02:23


本文Tags: , , ,

哈哈，每天点好评太郁闷了，这下爽了。写了一晚上，有什么问题请留言阿。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
taobao卖家自动好评工具 v1.1
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
解压后运行Setup.exe来安装和卸载（第一次运行安装，下一次卸载，再下一次安装。。。。）

安装和卸载都要重新打开浏览器（IE和IE核心的）才有效。

使用的时候：右键点击“评价”链接，选择“taobao卖家自动好评”
淘宝卖家自动好评

因浏览器的关系，会弹出一个对话框，等待自动评价完成（否则浏览器立刻返回就不灵了）

评价的内容修改请用记事本或写字板打开“Haoping.html”第36行参照说明修改

有什么问题，请到我的blog留言：http://bianbian.org

最后做个广告：

欢迎光临必胜客优惠券打折卡专卖：http://shop34553802.taobao.com

保留作者信息下随意复制本程序

bianbian

http://bianbian.org

http://shop34553802.taobao.com

07.8.1

下载：淘宝卖家自动好评工具v1.1 (43K)

原理就是JS控制页面元素啦，还是比较有意思的。
源码：

  1. //***************************************************************
  2. //   Function   : 淘宝卖家自动好评
  3. //   File name  : Haoping.html
  4. //   Author     : bianbian (bianbian.org#gmail.com)
  5. //   Blog       : http://bianbian.org
  6. //   Shop       : http://shop34553802.taobao.com
  7. //   Copyright  : 保留作者信息下随意复制
  8. //   Version    : 1.0  created,      bianbian @ 07-7-31 18:46
  9. //                1.1  解决跨域问题, bianbian @ 07-8-1 1:43
  10. //***************************************************************
  11.  
  12. /*
  13. 在下一行修改你的好评内容，注意如果多行要用"\n"隔开，如：
  14.  
  15. content = "欢迎再次\n光临\n必胜客优惠券打折卡\n专卖\n shop34553802.taobao.com";
  16.  
  17. 也可以写成这样：
  18.  
  19. content = "欢迎再次\n" +
  20. "光临\n" +
  21. "必胜客优惠券打折卡\n" +
  22. "专卖\n" +
  23. " shop34553802.taobao.com";
  24.  
  25. 也可以这样：
  26.  
  27. content = "欢迎再次\n\
  28. 光临\n\
  29. 必胜客优惠券打折卡\n\
  30. 专卖\n\
  31. shop34553802.taobao.com\
  32. ";
  33. */
  34. content = "欢迎再次光临必胜客优惠券打折卡专卖~ shop34553802.taobao.com";
  35.  
  36.  
  37. //
  38. // 下面不需要修改 ***********************************************
  39. //
  40. try
  41. {
  42.     haoping();
  43. }
  44. catch(e)
  45. {
  46.     alert("出错了噢~ 请和 yuelinniao 联系");
  47. }
  48.  
  49. function haoping()
  50. {
  51.     var d = external.menuArguments.document;
  52.     var e = external.menuArguments.event;
  53.     var a = d.elementFromPoint(e.clientX, e.clientY);
  54.     var p = a.parentElement;
  55.     var done = 0;
  56.    
  57.     if (a.innerText != "评价")
  58.     {
  59.         alert("你点错了吧~~~");
  60.         return;
  61.     }
  62.     a.innerText = "好评中..";
  63.     var fr = d.createElement("IFRAME");
  64.     fr.width = 1;
  65.     fr.height = 1;
  66.     //bianbian: 这里涉及iframe的跨域问题，暂时先改成同个域解决
  67.     fr.src = a.href.replace("http:\/\/my\.taobao\.com", "");
  68.     fr.onreadystatechange = function ()
  69.     {
  70.         if (fr.readyState == "complete")
  71.         {
  72.             if (done == 0) //submit form
  73.             {
  74.                 if (submitfrm(fr.contentWindow.document.forms))
  75.                 {
  76.                     done = 1;
  77.                     return;
  78.                 }
  79.                 else //failed, roll back
  80.                 {
  81.                     p.removeChild(fr);
  82.                     a.innerText = "评价";
  83.                 }
  84.             }
  85.             else if (done == 1) //submited, clear
  86.             {
  87.                 p.removeChild(fr);
  88.                 p.removeChild(a);
  89.                 var span = d.createElement("SPAN");
  90.                 span.innerText = "好评OK!";
  91.                 p.appendChild(span);               
  92.             }
  93.             done = 99;
  94.         }
  95.     };
  96.     p.appendChild(fr);
  97.     //bianbian: 这里必须弹出个对话框，否则IE会清空资源直接返回，onreadystatechange就失效了
  98.     alert('好评进行中，完成才能点击"确定"关闭本对话框噢~');
  99.     if (!done)
  100.     {
  101.         p.removeChild(fr);
  102.         a.innerText = "评价";
  103.         alert("提早关闭对话框，无法取得结果，请重试");
  104.     }
  105. }
  106.  
  107. function submitfrm(fms)
  108. {
  109.     for (var i = 0; i < fms.length; i++)
  110.     {
  111.         var f = fms[i];
  112.         if (f.name == "addfeedback")
  113.         {
  114.             f["_fmmy.r._0.r"][0].checked = true;
  115.             f["_fmmy.r._0.c"][0].checked = true;
  116.             f["_fmmy.r._0.t"][0].checked = true;
  117.             f["_fmmy.r._0.f"].value = content;
  118.             f.submit();
  119.             return true;
  120.         }
  121.     }
  122.     return false;
  123. }
标签: , , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 5 Comments »

[原] C的struct和JSON交互

Posted by bianbian on 2007-07-15 04:55


本文Tags: ,

经过一天努力，现在百合涂鸦板用了JSON传递数据：http://bbs.nju.edu.cn/pntdoc?board=beginner
虽然把数据和页面分开了，不过觉得过程还是比较麻烦：
1）新建JSON对象，C读取struct，把值插入
2）输出to_JSON_String
3）Javascript解析JSON，通过JST模板生成页面

实在是比较麻烦，有没有可能把一个struct直接转成JSON对象？
或者直接丢struct的字节码（加上描述信息）过去让Javascript负责解析成JSON对象？

struct就是一段长度固定的二进制码，如果想个办法能和JSON对象之间转换，应该能大大解放C作FastCGI的生产力。我的意思是这样：
C:
struct obj {
char name[3];
int age;
};

JSON:
obj {
name: “12″,
age: int
}

让我想想。

标签: ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in C/C++, JavaScript, Technology | 1 Comment »

[原] IE在UTF-8下解析JavaScript的bug

Posted by bianbian on 2006-10-20 09:57


本文Tags: , , ,

莫名其妙的脚本问题，脚本肯定没有写错，在IE中就是报错，在Firefox中一切正常：页面是UTF-8的，脚本用了插入页面。
（略去若干抓狂文字。。。。。。）
bianbian.js是ANSI编码的，用记事本保存为UTF-8编码，错误没有了。我觉得是IE的bug：页面是UTF-8编码的，为什么一定要求引用的其他文件也是UTF-8？
下次遇到IE下脚本很奇怪的错误不如看看JavaScript脚本和页面的编码是不是一致。

标签: , , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 1 Comment »

[原]Create Tree menu from HHC file automatically (HHC转为树形菜单)

Posted by bianbian on 2006-09-08 02:16


本文Tags: , ,

最近写了自动把HHC代码（HHC是CHM帮助文件过程中的目录结构描述文件）生成树形菜单，方便提供在线帮助手册；否则还得手动编写在线帮助的目录结构。支持IE和Firefox、Opera，其他浏览器未测试。使用也很简单，将下载的文件解压到images目录里，然后将HHC文件后缀改为htm（我们拿dir.htm举例），并添加两行代码既可：

sorry for my poor English: I wrote a script to change a HHC file(providing tree index file structure used by CHM-help-format) to tree menu. It's useful when providing online help after having produced CHM help, or you must produce a index-page manually - it's tedious, right? I tested it under IE 6.0, firefox 1.5, and Opera 0.9. It's also easy to use: you only need unzip it to "images" directory, change *.HHC file to *.HTM(dir.htm e.g.), and add two simple lines:

  1. <link type="text/css" rel="stylesheet" href="images/hhc_tree.css" />
  2. <script src="images/hhc_tree.js"></script>

当然了，你得增加个框架，左边引用dir.htm，右边是其他帮助文件。（我的代码会自动找到宽度最大的框架，并把树形菜单里的链接target指向这个框架，所以不用担心框架的命名问题，只要命名过就可以）。像这样：

sorry again: Certainly, you need add a frame page, dir.htm on left maybe, rightside is main help area. My script will set the links' target of tree menu with the frame's name which has the maximized width. So needn't care about the name of frames-but you must set one. like this:

  1. <html>
  2. <head><title>Online Help</title></head>
  3. <frameset cols="200,600">
  4.   <frame src="dir.htm" name="index">
  5.   <frame src="main.htm" name="main">
  6. </frameset>
  7. <body>
  8. <!--let search-engine work :)-->
  9. Your browser does not support frames: <a href="dir.htm">Index</a> <a href="main.htm">Main</a>
  10. </body>
  11. </html>

没有版权，随意使用，代码内的作者不要删掉就可以。:)

sorry last: Copyleft, as long as the author-line remains unchanged.
download here: HHC to Tree Menu (2.5K)

标签: , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 2 Comments »

[原] IE和Firefox在DOM解析childNodes上的不同

Posted by bianbian on 2006-09-07 06:25


本文Tags: , ,

一个问题困扰我，涉及到firstChild和lastChild的代码工作不正常。为了简单，我把问题抽象到下面这个代码，你猜点击按钮后的结果是什么？

  1. <html><body>
  2. <UL id="main">
  3.   <LI>1</LI>
  4.   <LI>2</LI>
  5. </UL>
  6. <input type=button value="click me!"
  7.   onclick="alert(document.getElementById('main').childNodes.length)">
  8. </body></html>

呵呵，在IE里提示2，在Firefox里提示5，这是怎么回事呢？UL下明明只有两个子节点，Firefox为什么提示5个子节点呢？通过查看IE和firefox的DOM结构，发现了问题的所在：
IE:IE Firefox:firefox
你也应该发现了吧？“#text”表示文本（实际是无意义的空格和换行等）在Firefox里也会被解析成一个节点，在IE里只有有实际意义的文本才会解析成“#text”。所以对firefox而言，上例中UL的fistChild并不是第一个LI，而是#text（UL和第一个LI之间的无意义文本），lastChild也并不是最后一个LI，而是最后一个LI和/UL之间的无意义文本。

解决办法是先用 .getElementsByTagName(“LI”) 得到所有LI的节点。我觉得firefox这样处理比较令程序员头痛，也没有必要。

标签: , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 5 Comments »

[原]利用JavaScript解析UBB标签生成HTML

Posted by bianbian on 2006-08-27 06:11


本文Tags: , ,

UBB标签作为HTML标签的安全替代，在网络上应用已经十分广泛。常规的做法是服务器端解析，这类代码几乎泛滥，我就不贴了。唯一的问题是比较耗服务器的CPU（字符串匹配、正则匹配），其实这种活我都喜欢让客户端做。

作为演示，我下面的代码将解析[b]、[i]、[url]、[img]、[color]、[wma]、[flash]这几个常见的UBB标签。主要利用了JavaScript的正则表达式。正则表达式语法可以察看：正则表达式语法，下面代码的测试可以察看：测试UBB标签解析。

  1. function text2html(s)
  2. {
  3.     if(s.indexOf("://") > 0)
  4.     {
  5.         //url
  6.         s = s.replace(/(^|[^\"\'\]])(http|ftp|mms|rstp|news|https)\:\/\/([^\s\033\[\]\"\']+)/gi, "$1[url]$2://$3[/url]");
  7.         //img
  8.         s = s.replace(/\[url\](http\:\/\/\S+\.)(gif|jpg|jpeg|png)\[\/url\]/gi, "[img]$1$2[/img]");
  9.     }
  10.     //ubb: 匹配[UBB]...[/UBB]形式
  11.     if(s.match(/\[(\w+)([^\[\]\s]*)\].*\[\/\1\]/))
  12.     {
  13.         s = s.replace(/\[url\](.+?)\[\/url\]/gi,"<a href=$1 target=_blank>$1</a>");
  14.         s = s.replace(/\[img\](.+?\.(?:gif|jpg|jpeg|png))\[\/img\]/gi, "<img src='$1' alt='$1'>");
  15.         s = s.replace(/\[flash\](.+?\.swf)\[\/flash\]/gi, "<embed src='$1' quality=high wmode=transparent type='application/x-shockwave-flash' width=400 height=300></embed><br> FLASH: <a href='$1' target=_blank>$1</a><br>");
  16.         s = s.replace(/\[wma\](.+?\.(?:wma|mp3))\[\/wma\]/gi, "<embed src='$1' height=40 AutoStart=0></embed><br> WMA: <a href='$1' target=_blank>$1</a><br>");
  17.         s = s.replace(/\[color=([#0-9a-zA-Z]{1,10})\](.+?)\[\/color\]/gi, "<font color='$1'>$2</font>");
  18.         s = s.replace(/\[b\](.+?)\[\/b\]/gi, "<b>$1</b>");
  19.         s = s.replace(/\[i\](.+?)\[\/i\]/gi, "<i>$1</i>");
  20.     }
  21.     return s;
  22. }

接下来的问题是怎样把文本传递到函数里，一个自己的经验是把待解析的文本放到textarea里，这样可以避免<和>等特殊符号的转义（即&lt;、&gt;），放到textarea里转义的工作就自动被浏览器做了。

唯一的也是比较严重的问题是待解析的文本里不能有“</textarea>”，否则浏览器会认为本文已经结束，其后的文本将被浏览器当成HTML代码——这是很危险的，想想看，用户输入“</textarea>”之后就可以插入任何HTML代码！解决的办法是服务器端输出文本内容的时候，将“</textarea”拆开，比如输出“< /textarea”或“</text area”都是可以的。要注意，不能整个搜寻替换“</textarea>”，因为有可能别有用心的用户会输入“</textarea >”，这会带来同样的问题（最近部分小百合用户的说明档被改就是因为这个漏洞）。也许你会问，这样不是服务器端每次生成页面的时候又进行字符串匹配了吗？对性能有什么提高呢？OK，我们可以在用户提交数据的时候进行这样的替换，“绝对不要相信客户端”，这是一个web程序员应该具有的基本观念。

标签: , ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 2 Comments »

[原]小心使用JavaScript的局部和全局变量

Posted by bianbian on 2006-08-26 10:44


本文Tags: ,

一直以为自己对JavaScript已经很精通了，这次却犯了一个低级错误。这个错误带来的后果就是：如果你最近用浏览器上小百合的话，发现点击左边导航菜单的链接都会打开新窗口。。。其次的后果是害我调试了一下午加晚上。。。

先是这样的，为了DOM设置属性的方便，我自己写了个方法，省得每次都setAttribute：

  1. Net = {};
  2. Net.Dom = {};
  3. Net.Dom.setProperties = function(obj)
  4. {
  5.     for(var i=1; i<arguments .length; i++)
  6.     {
  7.         if(typeof arguments[i]=="object")
  8.         {
  9.             for(name in arguments[i])
  10.                 obj[name] = arguments[i][name];
  11.         }
  12.     }
  13. }
  14.  
  15. //这样原来：
  16. div.setAttribute("width", "100px");
  17. div.setAttribute("height", "100%");
  18. ......
  19. //就可以写成：
  20. Net.Dom.setProperties(div, {width:"100px", height: "100%"});

上面的setProperties代码里面有个错误，会导致改变window的name属性。因为window是可以省略的（直接打document其实是window.document），而“for(name in arguments[i])”的表示方法浏览器会解析成“for(window.name in arguments[i])”。也就是框架的name变了，这样左边设的target自然就失效了，导致链接都以新窗口打开。改成“for(var name in arguments[i])”就好了。

因为JavaScript相对比较自由，写变量一定要注意，而且这种错误比较隐蔽，难以发现。局部变量一定要以var申明，否则是全局变量；要用全局变量时候也要注意一下命名方法，以”g_”开头或者全大写都是可行的办法。

最后我们一起复习一下JavaScript的局部变量和全局变量：
Read the rest of this entry »

标签: ,

遵守创作共用协议，转载请链接形式注明来自http://bianbian.org 做人要厚道

相关日志

Posted in JavaScript, Technology | 1 Comment »

Next Entries »