网页常用小技巧JS整理

先来了解一下什么是ＪＳ吧：
javascript是一个解释式的、基于对象的脚本程序语言．虽然javascript比面向对象（obje
ct-oriented)譬如C++、Java等程序语言的功能少，但具备足够完整的功能．
　　javascript可以在客户端（client-side）以及服务器(server-side)上执行．　
　　javascript程序不能单独执行，须在浏览器或站点服务器上执行．目前能够支持的浏览
器以\"IE
3.x\"，\"Netscape 3.x\"以上版本的浏览器为主．
　　javascript可以串联和控制ActiveX Controls，在客户端浏览器上执行；也可以串联到
IIS的Active Server Pages的服务器上执行．

有时在一个表单中要求客户提交信息是，输入的值不能为空，这时有两种解决方法：

　　一种是在服务器端程序中实现。这种方案，它的缺点是客户端的请求必须在网络上传送
给服务器，然后由服务器程序进行判断，将结果返回客户端。为了判断一个条件在网上传送
了两次，这样既浪费了时间，也浪费了网络资源。

　　二是在客户端程序中进行判断。这样就出现了javascript，由于它是一种可以在浏览器
端运行的脚本语言，不必经过网络传送，因而有很高效率，而且它有很强的兼容性和灵活性
，这就要求一个Web程序员必须要会javascript。目前大多数浏览器都支持javascript。

1. oncontextmenu=\"window.event.returnvalue=false\" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)><td>no</table> 可用于Table

2. <body onselectstart=\"return false\"> 取消选取、防止复制

3. onpaste=\"return false\" 不准粘贴

4. oncopy=\"return false;\" oncut=\"return false;\" 防止复制

5. <link rel=\"Shortcut Icon\" href=\"favicon.ico\"> IE地址栏前换成自己的图标

6. <link rel=\"Bookmark\" href=\"favicon.ico\"> 可以在收藏夹中显示出你的图标

7. <input style=\"ime-mode:disabled\"> 关闭输入法

8. 永远都会带着框架
<script language=\"javascript\"></script>

9. 防止被人frame
<script LANGUAGE=javascript></script>

10. 网页将不能被另存为
<noscript><iframe src=*.html></iframe></noscript>

11. <input type=button value=查看网页源代码
onclick=\"window.location = \"view-source:\"+ \"http://www.51js.com/\";\">

12.删除时确认
<a href=\"javascript:if(confirm(\"确实要删除吗?\"))location=\"boos.asp?&areyou=删除
&page=1\"\">删

除</a>

13. 取得控件的绝对位置
//javascript
<script language=\"javascript\">
function getIE(e){
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
alert(\"top=\"+t+\"/nleft=\"+l);
}
</script>

//VBscript
<script language=\"VBscript\"></script>

14. 光标是停在文本框文字的最后
<script language=\"javascript\">
function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart(\"character\",e.value.length);
r.collapse(true);
r.select();
}
</script>
<input type=text name=text1 value=\"123\" onfocus=\"cc()\">

15. 判断上一页的来源
javascript:
document.referrer

16. 最小化、最大化、关闭窗口
<object id=hh1 classid=\"clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11\">
<param name=\"Command\" value=\"Minimize\"></object>
<object id=hh2 classid=\"clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11\">
<param name=\"Command\" value=\"Maximize\"></object>
<OBJECT id=hh3 classid=\"clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11\">
<PARAM NAME=\"Command\" value=\"Close\"></OBJECT>

<input type=button value=最小化 onclick=hh1.Click()>
<input type=button value=最大化 onclick=hh2.Click()>
<input type=button value=关闭 onclick=hh3.Click()>
本例适用于IE

17.屏蔽功能键Shift,Alt,Ctrl
<script>
function look(){
if(event.shiftKey)
alert(\"禁止按Shift键!\"); //可以换成ALT　CTRL
}
document.onkeydown=look;
</script>

18. 网页不会被缓存
<META HTTP-EQUIV=\"pragma\" CONTENT=\"no-cache\">
<META HTTP-EQUIV=\"Cache-Control\" CONTENT=\"no-cache, must-revalidate\">
<META HTTP-EQUIV=\"expires\" CONTENT=\"Wed, 26 Feb 1997 08:21:57 GMT\">
或者<META HTTP-EQUIV=\"expires\" CONTENT=\"0\">

19.怎样让表单没有凹凸感？
<input type=text style=\"border:1 solid #000000\">
或
<input type=text style=\"border-left:none; border-right:none; border-top:none;
border-bottom:

1 solid #000000\"></textarea>

20.<div><span>&<layer>的区别？
<div>(division)用来定义大段的页面元素，会产生转行
<span>用来定义同一行内的元素，跟<div>的唯一区别是不产生转行
<layer>是ns的标记，ie不支持，相当于<div>

21.让弹出窗口总是在最上面:
<body onblur=\"this.focus();\">

22.不要滚动条?
让竖条没有:
<body style=\"overflow:scroll;overflow-y:hidden\">
</body>
让横条没有:
<body style=\"overflow:scroll;overflow-x:hidden\">
</body>
两个都去掉？更简单了
<body scroll=\"no\">
</body>

23.怎样去掉图片链接点击后，图片周围的虚线？
<a href=\"#\" onFocus=\"this.blur()\"><img src=\"logo.jpg\" border=0></a>

24.电子邮件处理提交表单
<form name=\"form1\" method=\"post\" action=\"mailto:****@***.com\" enctype=\"text/pl
ain\">
<input type=submit>
</form>

25.在打开的子窗口刷新父窗口的代码里如何写？
window.opener.location.reload()

26.如何设定打开页面的大小
<body onload=\"top.resizeTo(300,200);\">
打开页面的位置<body onload=\"top.moveBy(300,200);\">

27.在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动
<STYLE>
body
{background-image:url(logo.gif); background-repeat:no-repeat;

background-position:center;background-attachment: fixed}
</STYLE>

28. 检查一段字符串是否全由数字组成
<script language=\"javascript\"></script>

29. 获得一个窗口的大小
document.body.clientWidth; document.body.clientHeight

30. 怎么判断是否是字符
if (/[^/x00-/xff]/g.test(s)) alert(\"含有汉字\");
else alert(\"全是字符\");

31.TEXTAREA自适应文字行数的多少
<textarea rows=1 name=s1 cols=27 onpropertychange=\"this.style.posHeight=this.s
crollHeight\">
</textarea>

32. 日期减去天数等于第二个日期
<script language=javascript>
function cc(dd,dadd)
{
//可以加上错误处理
var a = new Date(dd)
a = a.valueOf()
a = a - dadd * 24 * 60 * 60 * 1000
a = new Date(a)
alert(a.getFullYear() + \"年\" + (a.getMonth() + 1) + \"月\" + a.getDate() + \"日\")
}
cc(\"12/23/2002\",2)
</script>

33. 选择了哪一个Radio
<HTML><script language=\"vbscript\">
function checkme()
for each ob in radio1
if ob.checked then window.alert ob.value
next
end function
</script><BODY>
<INPUT name=\"radio1\" type=\"radio\" value=\"style\" checked>Style
<INPUT name=\"radio1\" type=\"radio\" value=\"barcode\">Barcode
<INPUT type=\"button\" value=\"check\" onclick=\"checkme()\">
</BODY></HTML>

34.脚本永不出错
<script LANGUAGE=\"javascript\">

</script>

35.ENTER键可以让光标移到下一个输入框
<input onkeydown=\"if(event.keyCode==13)event.keyCode=9\">

36. 检测某个网站的链接速度：
把如下代码加入<body>区域中:
<script language=javascript>
tim=1
setInterval(\"tim++\",100)
b=1

var autourl=new Array()
autourl[1]=\"www.njcatv.net\"
autourl[2]=\"javacool.3322.net\"
autourl[3]=\"www.sina.com.cn\"
autourl[4]=\"www.nuaa.edu.cn\"
autourl[5]=\"www.cctv.com\"

function butt(){
document.write(\"<form name=autof>\")
for(var i=1;i<autourl.length;i++)
document.write(\"<input type=text name=txt\"+i+\" size=10 value=测试中……> =》
<input type=text

name=url\"+i+\" size=40> =》<input type=button value=GO

onclick=window.open(this.form.url\"+i+\".value)><br>\")
document.write(\"<input type=submit value=刷新></form>\")
}
butt()
function auto(url){
document.forms[0][\"url\"+b].value=url
if(tim>200)
{document.forms[0][\"txt\"+b].value=\"链接超时\"}
else
{document.forms[0][\"txt\"+b].value=\"时间\"+tim/10+\"秒\"}
b++
}
function run(){for(var i=1;i<autourl.length;i++)document.write(\"<img

src=http://\"+autourl+\"/\"+Math.random()+\" width=1 height=1

onerror=auto(http://\";+autourl+\"\")>\")}
run()</script>

37. 各种样式的光标
auto ：标准光标
default ：标准箭头
hand ：手形光标
wait ：等待光标
text ：I形光标
vertical-text ：水平I形光标
no-drop ：不可拖动光标
not-allowed ：无效光标
help ：?帮助光标
all-scroll ：三角方向标
move ：移动标
crosshair ：十字标
e-resize
n-resize
nw-resize
w-resize
s-resize
se-resize
sw-resize

38.页面进入和退出的特效
进入页面<meta http-equiv=\"Page-Enter\" content=\"revealTrans(duration=x, transit
ion=y)\">
推出页面<meta http-equiv=\"Page-Exit\" content=\"revealTrans(duration=x, transiti
on=y)\">
这个是页面被载入和调出时的一些特效。duration表示特效的持续时间，以秒为单位。tran
sition表示使

用哪种特效，取值为1-23:
　　0 矩形缩小
　　1 矩形扩大
　　2 圆形缩小
　　3 圆形扩大
　　4 下到上刷新
　　5 上到下刷新
　　6 左到右刷新
　　7 右到左刷新
　　8 竖百叶窗
　　9 横百叶窗
　　10 错位横百叶窗
　　11 错位竖百叶窗
　　12 点扩散
　　13 左右到中间刷新
　　14 中间到左右刷新
　　15 中间到上下
　　16 上下到中间
　　17 右下到左上
　　18 右上到左下
　　19 左上到右下
　　20 左下到右上
　　21 横条
　　22 竖条
　　23 以上22种随机选择一种

39.在规定时间内跳转
<META http-equiv=V=\"REFRESH\" content=\"5;URL=http://www.51js.com\">

40.网页是否被检索
<meta name=\"ROBOTS\" content=\"属性值\">
　　其中属性值有以下一些:
　　属性值为\"all\": 文件将被检索，且页上链接可被查询；
　　属性值为\"none\": 文件不被检索，而且不查询页上的链接；
　　属性值为\"index\": 文件将被检索；
　　属性值为\"follow\": 查询页上的链接；
　　属性值为\"noindex\": 文件不检索，但可被查询链接；
　　属性值为\"nofollow\": 文件不被检索，但可查询页上的链接。

41.检测浏览器类型并用声音提示
这个脚本检测访问者的浏览器类型，并用不同的MIDI来提示，非常的COOL！
　　将代码加入<BODY>区：声音文件自己随便选择.

<script LANGUAGE=\"javascript\">

</script>

　　检测访问者使用的浏览器是IE还是NS，然后根据检测结果带领他们去相应的页面，可以
有效地避免浏览器的不兼容导致的页面浏览异常，下面再给出一种方法：
代码非常简单，将如下代码加入HTML的<head>区：

<script LANGUAGE=\"javascript\">

</script>

<script LANGUAGE=\"javascript\">

</script>

继续阅读：养生健康偏方治疗

此文由林心小筑编辑，未经允许不得转载！：首页 > 潮·科技 » 网页常用小技巧JS整理

相关推荐