小心Dom元素的name属性

对于一个用 JavaScript 获取到一个 DOM 节点的后,在说到属性的时候需要注意的是指 DOM 节点的属性还是 JavaScript 对象的属性(或说字段名)。一般来说,前者用 getAttribute/setAttribute 来访问/修改,后者用 object.field 来访问。然而,对于像 id、className 这些却属于 DOM 节点的 Attribute 范围。在说到 name 属性的时候,就更加复杂一点了,因为牵涉到 IE 的特殊处理。

当想用 setAttribute 给一个已有的(或动态创建的) DOM 元素设置 name 属性时,将会发现 IE6/7 跟 form 及相关表单元素合不来,根本就没有设置成功。

微软的文档,在 IE6/7 中,form 表单时的 name 属性是有些特殊的,用来标志提交的数据,跟平常的用途有些不一样。

When you submit a form, use the name property to bind the value of the control. The name is not the value displayed for the input type=button, input type=reset, and input type=submit input types. The internally stored value is submitted with the form, not the displayed value.

综合标准的做法,可以得到这样一个创建带 name 属性的 DOM 节点的代码: 继续阅读“小心Dom元素的name属性”

于悄无声息中获取你的访问记录

当访问某个网站时,不经意中,就被别人猜测到你是否访问过某个网站,而这却没有什么技术性的东西,也不算是违法的行为。

奥秘在于浏览器对于访问过的链接会用伪类 :visited 来标识。

那么很容易想到的一个方法就是,用 a:visited 来设定一个特定的颜色值,比如 red。然后从一个 URL 列表中来动态创建一个链接,然后获取其颜色(各浏览器返回的结果不完全一致,可能是 rgb 值,也可能是 hex 值),如果跟设定的颜色一致,那么就可以确定用户在当前浏览器访问过该链接。

实际测试中会发现,新版本的浏览器(如Chrome 14, IE9, FF5)对于 a:visited 的样式是成功应用的,但获取到的颜色却不是对应的设定,而是 a:link、a 甚至是默认的颜色,从而无法判断用户是否访问过该链接。这是现代浏览器在这方面的安全保护,一方面使样式可以正常生效,另一方面却防止了 JS 窃听。然而,在一些旧版本的浏览器(比如IE6~8, FF3)上面却没有这个保护措施,因而可以判断出是否在该浏览器上访问过该链接。

对于以上依赖于 JavaScript 的窃听,很容易想到的一个防止方法就是禁止 JavaScript 的运行。没错,抛开种种不便来说,的确可以达到防止以上窃听的目的,即便是 IE6 等老一代浏览器。但是,却防止不了 CSS 的窃听方式。

又是如何利用 CSS 来进行判断窃听的吗? 继续阅读“于悄无声息中获取你的访问记录”

Lingoes惹的祸

顺手将 Lingoes 升级到了最新版本,结果发现鼠标一直在闪(处于忙碌状态),CPU 接近100,卸载后一切正常。

当然,排查的过程并不是那么直接,因为同时我还开着不少的程序,一个个都结束后无法解决;注销无法解决;干掉了占 CPU 大比例的几个进程,这下不闪了,不过是系统进程,于是重启了。

开机后,依然在闪。看看任务管理器,发现 Lingoes 的踪迹,而我是不设这个开机自启动的,果断尝试。关闭进程,提示无法。卸载程序,中间提示xx错误,无视之,完毕终解决。

P.S. 系统:Win7 SP1, 32位

敬意

对那些一直坚持的人表示敬意,特别是未曾腐败的清官甚至是仅小小腐败的官员。

因为我开始慢慢了解到,不随波逐流是多么困难的一件事情,一直不随波逐流更是一件困难的事情。

因为即便是不随着绝大多数人在看着没车时果断踩着红灯过马路,我也不知道自己还能坚持多久。看着大家都过去了,对面的车刚好在那了或者来了,过去还是不过去呢,这是一个艰难的选择。

不管你信不信,反正我是信了。

Photoshop删除切片

有切片时,保存为 Web 格式将自动切割而无法得到完整的图片,故需要删除切片。

方法:

视图 => 清除切片


P.S. 鄙视下自己,很早就说要学Photoshop,很早就开始学Photoshop,但到了现在,进度还是近乎零。

再P.S. 找个借口:往往在忙完一件事情后,刚想着最近有些空,学点新东西,结果下一刻就被拉走了。

jQuery tmpl

动态请求数据来更新页面是现在非常常用的方法,比如博客评论的分页动态加载,微博的滚动加载和定时请求加载等。

这些情况下,动态请求返回的数据一般不是已拼好的 HTML 就是 JSON 或 XML,总之不在浏览器端拼数据就在服务器端拼数据。不过,从传输量方面来看,返回 HTML 不划算,而在 web 传输方面,现在更多的是使用 JSON 而不是 XML。

浏览器端根据 JSON 生成 HTML 有个很苦恼的地方就是,结构不复杂的时候还好,结构一复杂,就想死了,需要很小心很小心地写出几乎无法维护的 JavaScript 代码。

如同为解决 PHP 拼数据这方面的问题而有了 Smarty 这些模版,JavaScript 也可以利用模版来解决这些问题,比如基于 jQuery 的 jquery.tmpl,现在已经被接受为官方的模版插件了。详细的 API 在 jQuery 的 Templates 里,内置的 demo 也尽情地演示了各种用法。

就我自己的几次使用,感觉很不错,用更加直观方面的 HTML 写法而不是 JavaScript 拼凑 来写结构,然后用 JSON 变量来占位的方式来填充数据,代码看起来好多了。

Update

需要说明的是,由于我相对熟悉的是 PHP,尽管是使用 $ 作为变量开始符号,但与 tmpl 的 ${} 标识没有冲突;而 JSP 本身使用 ${} 来作为变量内容输出,所以在 JSP 会导致模版无法正常工作,这里是一些相关问答

解决方法:

  1. 禁用(本项目) JSP 的 ${} 标签功能, 方法见相关问答;但明显代价太大。
  2. 对 tmpl 中的 ${} 进行转义,即使用 \${}的方式;这样将静态 demo 转为 开发版本需要细心更正一下。
  3. 不想用模版的就依然手动拼字符串;仍想用模版的就切换到别的不是使用 ${} 来解析的模版。

主机和VirtualBox虚拟机互访

通过 VirtualBox 的网络设置,让虚拟机在能访问 Internet 的同时可以访问主机网络,同时让主机也能通过 IP 来访问虚拟机的网络。这里主要说的是基于 HTT P协议的 we b服务,FTP 的大抵也如此。

普通的主机和 VirtualBox 中的虚拟机的『文件共享』可以简单地通过『数据空间』来实现,此文主要是记录两者 web 互访的方法。

一般情况下,通过设置虚拟系统的网络连接为 NAT 来达到上网的目的,同时也可以通过主机的 IP 来访问主机上的服务器(前提是启用了服务器),但主机却不能访问虚拟系统中的服务器,但偏偏有时候有这个需求。

这种需求可以通过启用多一个网络连接的方式来解决,下面以 Windows 下虚拟 ubuntu 来说明。

首先当然是保持原来的网络连接

VirtualBox网络连接1

继续阅读“主机和VirtualBox虚拟机互访”