1. 动态调整select
<select id=test size=3>
<option>选项一</option>
<option>选项二</option>
<option>选项三</option>
</select>
<button onclick="up(test)">向上</button>
<script>
function up(obj)
{
if (obj.selectedIndex>0)
obj.options(obj.selectedIndex).swapNode(obj.options(obj.selectedIndex-1))
}
</script>
2. 实现select的细线边框
<span style="border:1px solid #000000; position:absolute; overflow:hidden"><select style="margin:-2px">
<option>1111</option>
<option>11111111111111</option>
<option>111111111</option>
</select></span>
3. 弹出窗口自动适应大小
<script>
function autoResize(src)
{
function resizeOpenWin()
{
var srcElem = event.srcElement
if (document.resized) return
window.setTimeout(function ()
{
window.resizeBy(srcElem.width-100, srcElem.height-100)
},1)
document.resized = true
}
var newbody = "<body style=margin:0px><script>"+resizeOpenWin.toString()+"</"+"script><img src="+src+" onreadystatechange=resizeOpenWin()></body>"
var newwin = window.open("", "", "width=100, height=100, toolbar=yes")
newwin.document.write(newbody)
newwin.document.close()
}
autoResize("http://www.imagegarden.net/photo/scan/view.php?url=/scan/084/21.jpg")
</script>
4. 捕获关闭按钮
<script>
window.onbeforeunload = function()
{
if (document.body.offsetWidth-50 < event.clientX && event.clientY<0)
return "是否关闭当前窗口"
}
</script>
5. 判断链接是否被访问
<style>
a {visited:false}
a:visited {visited:true}
</style>
<a href="###" onclick="alert(event.srcElement.currentStyle.visited);return false">link1</a>
<a href="abcd" onclick="alert(event.srcElement.currentStyle.visited);return false">link2</a>
6. expression 妙用
<script>
function test()
{
alert("expression function")
}
</script>
<style>
a {qiushuiwuhen:expression(this.onclick=test)}
</style>
<a href="javascript:;">expression</a>
7. 多彩链接
<style>
span {color: #FF6600}
a {color: #9299A6}
</style>
<a href="javascript:;"><span>link</span></a>
8. iframe 自动适应大小
<script>
function autoResize()
{
try
{
document.all["test"].style.height=test.document.body.scrollHeight
}
catch(e){}
}
</script>
<iframe id=test style="height:expression(1); aho:expression(autoResize())" src="\">
9. 用onmouseover、onmouseout 实现 onmouseenter 和 onmouseleave
onmouseover = if (!this.contains(event.fromElement)) {...}onmouseout = if (!this.contains(event.toElement)) {...}
10. 中文两端对齐
<DIV style="text-align:justify; text-justify:Distribute-all-lines;">搜易论坛搜易论坛</DIV>
11. 生成连续字符
<script>
alert(new Array(10).join("a"))
</script>
12. 强制图片载入
<img onerror="this.src=this.src" ...
13. 获取色盘颜色
<body>
<span style="background-color:buttonface" id=demo>buttonface</span>
<script>
var rng = document.body.createTextRange();
rng.moveToElementText(demo)
var bColor=rng.queryCommandValue("BackColor");
str=("000000"+bColor.toString(16)).match(/.{6}$/)
alert("#"+str.slice(-2)+str.slice(2,-2)+str.slice(2))
</script>
</body>
14. 不进行转义的字符串
<script>alert (/\n\r\t/.source)</script>
15. 判断日期是否合法
<script>
function isDate(strDate)
{
if (!strDate) return false
var date1 = new Array()
var date2 = null
try
{
date1[0] = strDate.match(/\d{4}/)
strDate = strDate.replace(date1[0],"")
date1[1] = parseInt(strDate.match(/\d+/g)[0])+1
strDate = strDate.replace(date1[1],"")
date1[2] = parseInt(strDate.match(/\d+/g))
date2 = new Date(date1.join("\/"))
return date1.join("\/") == date2.getYear() +"\/"+ (date2.getMonth()+1) +"\/"+ date2.getDate()
}
catch(e)
{
return false
}
}
alert(isDate("2003/01/01"))
alert(isDate("01/01/2003"))
alert(isDate("01-01-2003"))
alert(isDate("2003/21/01"))
alert(isDate("2003/01/01 20:00:00"))
</script>
16. 打开我的电脑，控制面板等
<a href="file:///::{20D04FE0-3AEA-1069-A2D8-08002B30309D}" target=_blank>我的电脑</a><br>
<a href="file:///c:/" target=_blank>本地C盘</a><br>
<a href="file:///d:/" target=_blank>本地D盘</a><br>
<a href="file:///c:/" target=_blank>本地E盘</a><br>
<a href="file:///::{208D2C60-3AEA-1069-A2D7-08002B30309D}" target=_blank>网上邻居</a><br>
<a href="file:///::{450D8FBA-AD25-11D0-98A8-0800361B1103}" target=_blank>我的文档</a><br>
<a href="file:///::{20D04FE0-3AEA-1069-A2D8-08002B30309D}/::{21EC2020-3AEA-1069-A2DD-08002B30309D}" target=_blank>控制面板</a><br>
<a href="file:///::{645FF040-5081-101B-9F08-00AA002F954E}" target=_blank>回收站</a><br>
17. 强制转为整型变量
<script>
alert (123|0)
alert (123.456|0)
alert ("abc"|0)
</script>
18. 把0-6的星期表示改为1-7表示的表示方法
<script>
for (var i=0; i<7; i++) alert(Math.ceil((i+7)%7.5))
</script>
19. 判断是否是工作日
<script>
alert(new Date().getDay()%6 ? "工作日" : "双休日")
</script>
20. 去除字符串首尾的空格
<script>
alert(" aaaa ".replace(/^\s*|\s*$/g, ""))
</script>
21. 获得本月的天数
<script>
alert(new Date(new Date().getYear(), new Date().getMonth()+1, 0).getDate())
</script>
22. 正则不匹配词组
不含"yes"或者"no":<br>
<script>
function d(s){document.write(s+"<br>")}
str=new Array("yes","no","auto","yseauto","sey","esyno");
for(i in str)
d(str[i].bold()+" : "+/^(y(?!es)|n(?!o)|[^yn])*$/.test(str[i]));
</script>
23. 使用模式窗口浏览网页
<script language=JavaScript>
showModalDialog("about:<iframe src=http://www.blueidea.com/bbswidth=100% height=100%></iframe>")
</script>
24. 随机重排数组
<script>
ars=[金,木,水,火,土,仁,义,礼,志,贤]
for (var i=0; i<10; i++)
document.write(ars.sort(function(){return Math.random( )*new Date%3-1})+"<br />")
</script>
25. 自动等分的Table
<style>
tr {
position: relative;
top: expression(-1*this.sectionRowIndex*(offsetHeight-2));
left: expression(this.sectionRowIndex*this.offsetWidth);
height: 100px;
}
td {
border: 1px solid buttonface;
font-size: 12px;
}
</style>
<table>
<tbody>
<tr><td><span CONTENTEDITABLE />
</body>
</html>