朋友“小平的 fans ”和我讨论一个问题，他发一个文件给我，说 JavaScript 不能取到一个元素的前一个元素。
test.html 代码如下
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
< html >
< head >
< title > test </ title >
< script type = "text/javascript" >
function f(){
var sub = document.getElementById( "ME-26934" );
alert(sub .getAttribute( "id" ) );
}
</ script >
</ head >
< body onload = "f();" >
< input type = "text" id = "ME-26933" value = "aaa" > dddddd </ input >
< input type = "text" id = "ME-26934" > eeee </ input >
< input type = "text" id = "ME-26935" > rrr </ input >
</ body >
</ html >
这个问题我遇到过， previousSibling 返回元素之前紧随的兄弟节点。
元素后面会有一个文本节点，无论它是不是含有文本。所以这里的脚本应修改
sub = sub .previousSibling .previousSibling;
alert(sub.getAttribute( "id" ));
我用的 FireFox3.6 ，试了下，可以了，就发给朋友。
过了一会儿他回复说， IE6 下还是不行，输出（ alert ）了空字符串。
我实验了下，果真不行，看不出来出了什么问题。
sub = sub.previousSibling.previousSibling;
alert(sub.nodeType+ ":" +sub.getAttribute( "id" ));
IE6 输出的是 1:
1 代表的是元素 element ，这没错啊，取到元素了。
我首先想到的是令人郁闷的浏览器差异，惯性的想是不是方法兼容问题。
于是试着换了几个方法、属性，结果都不行。
正卡壳，忽然想到干嘛这么毫无逻辑的瞎猜，既然有输出（虽然是空字符串），那么方法是可用的，可能是取错了。
alert(sub.nodeType+ ":" +sub.tagName);
IE6 下输出的是 1:/INPUT
发现问题了！
< input type = "text" id = "ME-26933" value = "aaa" > dddddd </ input >
IE6 下这种书写格式，同级节点分别是： <input> 元素、 </input> 元素 、文本节点。
FireFox3.6 下 <input> 元素 &</input> 元素算一个元素。
如此，问题迎刃而解。整理后的文档如下：
test.html 文件
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
< html >
< head >
< title > test </ title >
< script type = "text/javascript" >
function f(){
var sub = document.getElementById( "ME-26934" );
sub = sub.previousSibling.previousSibling;
alert(sub.nodeType+ ":" +sub.tagName+ ":" +sub.getAttribute( "id" ));
var sub1 = document.getElementById( "ME-26935" );
sub1 = sub1.previousSibling.previousSibling;
alert(sub1.nodeType+ ":" +sub1.tagName);
}
</ script >
</ head >
< body onload = "f();" >
< input type = "text" id = "ME-26933 " value = "aaa" /> dddddd
< input type = "text" id = "ME-26934" > eeee </ input >
< input type = "text" id = "ME-26935" > rrr </ input >
</ body >
</ html >
第一个 alert ： 1:INPUT: ME-26933
第二个 alert ： 1:/INPUT
小结： 1. < input type = "text" id = "ME-26933" value = "aaa" > dddddd </ input >
IE6 下这种书写格式，同级节点分别是： <input> 元素、 </input> 元素、文本节点。
2. 分析问题要条理清晰，步步为营，而不是“投机式”的试错，虽然有些时候“投机式”方法能够快速的解决问题，但分析问题就不太适用了，什么问题用什么方法。