<a href="about.html" id="anc">a link with href="about.html"</a>
var anchor = document.getElementById('anc');
console.log(anchor.href);
console.log(anchor.getAttribute('href'));
以上代码，对于第一个 log，希望得到形如 //liunian.info/about.html 的绝对路径，对于第二个 log，希望得到 about.html 这个相对路径。
但在 ie 下，第二个却也由相对路径变为绝对路径了。
兼容的处理方法是使用第二个参数，这个参数是 IE 私有的，但由于 JavaScript 的语言特性，多参数并不会导致出错，所以，对于 Chrome、FF 等将仍是原来的方法。
anchor.getAttribute('href', 2);
References
对于以下代码，仅 ie6 中会 alert 3 次，别的都仅第一次有。
<!DOCTYPE html>
<html>
<head>
<title>modify script's attribute</title>
<meta charset="utf-8" />
</head>
<body>
<script type="text/javascript" src="a.js"></script>
<script type="text/javascript">
var scr = document.scripts[0];
// use setAttribute to modify script's src
scr.setAttribute('src', 'b.js');
</script>
<script type="text/javascript">
// reset script's src attribute
scr.src = 'c.js';
</script>
</body>
</html>
其中 a/b/c 这 3 个 js 文件中的内容类似下面的：
// a.js
var a = 'a.js';
alert(a);
对于下面这段代码，当 focus 表单（如输入框）时，提交按钮在 IE 6/7 中将会出现一个黑色边框。
<style>
input{border:1px solid red;}
</style>
<form>
<input type="text" value="" />
<input type="submit" value="submit" />
</form>
如果需要对按钮做美化，保持各浏览器一致（比如设定背景和border等），那么需要处理这个问题。
解决方法是：把 submit 按钮的 border 设为 none，然后如果需要 border，那么采用在其外面包一层元素的方法来实现。
text-overflow:ellipsis 配合 overflow:hidden 可以用来实现字符串截断显示为更多的效果，而不用精确截字输出。
text-overflow 的基本单值用法就连 IE6 都支持，所以是可以放心使用的。
默认值是 clip，即简单地分割，可能会导致字符显示一半； 而 ellipsis 可以截字然后补上 …，效果更好。
<style type="text/css" media="screen">
#inner{border:1px solid #ccc;}
#inner p{width:200px; white-space:nowrap; overflow:hidden;}
#inner p.t1{text-overflow:clip;}
#inner p.t2{text-overflow:ellipsis;}
</style>
<div id="inner">
<p class="t1">text-overflow:clip more text here</p>
<p class="t2">text-overflow:ellipsis more text here</p>
<p class="t1">text-overflow:clip 中文测试跟多更多</p>
<p class="t2">text-overflow:ellipsis 中文测试更多更多</p>
</div>
结果如下：
text-overflow:clip more text here
text-overflow:ellipsis more text here
text-overflow:clip 中文测试跟多更多
text-overflow:ellipsis 中文测试更多更多
IE6 有个多个 class 样式的 bug，具体表现为：当为一个元素连用 2 个及以上的 class 来匹配样式时（如：p.a.b），ie6 会识别为样式规则中最后一个 class 的定义（即：p.b）。
这样一来，不但多 class 的样式不正确，还可能会覆盖掉原对应 class 的样式（如 .b 的样式）。
下面截图最后一行有误，class 应为 “a c”
上面截图最后一行有误，class 应为 “a c”
JavaScript 中，可以使用 Math.random() 来获得 [0, 1) 之间的随机数，但没有直接的获取一给定范围内的随机数，出于使用频率还算多，可以写成一个函数。
// mod from: http://roshanbh.com.np/2008/09/get-random-number-range-two-numbers-javascript.html
function randomToN(maxVal, floatVal) {
var randVal = Math.random() * maxVal;
return typeof floatVal === 'undefined' ?
Math.floor(randVal) : randVal.toFixed(floatVal);
}
function randomXToY(minVal, maxVal, floatVal) {
var randVal = minVal + Math.random() * (maxVal - minVal);
return typeof randVal === 'undefined' ?
Math.floor(randVal) : randVal.toFixed(floatVal);
}
// example usages:
randomToN(50); // => 35
randomToN(50, 3); // => 37.748
randomXToY(30, 80); // => 51
randomXToY(30, 80, 2); // => 68.36
在 JavaScript 中， 函数中的隐藏变量 arguments 和用 getElementsByTagName 获得的元素集合（NodeList）都不是真正的数组，不能使用 push 等方法，在有这种需要的时候只能先转换为真正的数组。
对于 arguments，可以使用 Array.prototype.slice.call(arguments); 来达到转换的目的，但对于 NodeList 则不行了，其在 IE8 及以下将会报错，只能说其 JS 引擎有所限制。
因此，如果需要把 NodeList 转换为真正的数组，则需要做下兼容处理。
function realArray(c) {
try {
return Array.prototype.slice.call(c);
} catch (e) {
var ret = [], i = 0, len = c.length;
for (; i < len; i++) {
ret[i] = (c[i]);
}
return ret;
}
}
References
有如下代码：
<img src="http://placehold.it/300" height="" />
其在 IE 下的解析将会是：
可以看到，写了 height 属性，但没写值时，IE 下会把其当作 1，而 Chrome 等则会忽视该属性，从而导致了 Chrome 等下是原图大小，而 IE 下则看不到图片。
如果爱，请深爱；如果写，请不空。
P.S. 像这种情况，可能极少遇到，但种种原因，我遇到了，故记录之。