Javascript收藏（一）

最新推荐文章于 2025-12-08 09:18:56 发布

原创最新推荐文章于 2025-12-08 09:18:56 发布 · 357 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #正则表达式 #autocomplete #input #vbscript #function

本文提供了一系列网页操作技巧，包括事件处理、元素操作、样式修改、窗口控制等，适用于前端开发者掌握和提升网页交互能力。

事件源对象

event.srcElement.tagName
event.srcElement.type

捕获释放

event.srcElement.setCapture();  event.srcElement.releaseCapture();

事件按键

event.keyCode
event.shiftKey
event.altKey
event.ctrlKey

事件返回值

event.returnValue

鼠标位置
event.x
event.y

窗体活动元素
document.activeElement

绑定事件

访问窗体元素

document.all("txt").focus(); document.all("txt").select();

窗体命令
document.execCommand
窗体COOKIE
document.cookie
菜单事件
document.oncontextmenu
创建元素

document.createElement("SPAN");

根据鼠标获得元素：

document.elementFromPoint(event.x,event.y).tagName=="TD
document.elementFromPoint(event.x,event.y).appendChild(ms)

窗体图片
document.images[索引]
窗体事件绑定
document.onmousedown=scrollwindow;
元素
document.窗体.elements[索引]
对象绑定事件

document.all.xxx.detachEvent('onclick',a);

插件数目
navigator.plugins

取变量类型

typeof($js_libpath) == "undefined"

下拉框
下拉框.options[索引]
下拉框.options.length

查找对象
document.getElementsByName("r1");
document.getElementById(id);

定时

timer=setInterval('scrollwindow()',delay); clearInterval(timer);

UNCODE编码
escape() ,unescape

父对象
obj.parentElement(dhtml)
obj.parentNode(dom)

交换表的行

 TableID.moveRow(2,1)

替换CSS
document.all.csss.href = "a.css";
并排显示
display:inline
隐藏焦点
hidefocus=true
根据宽度换行
style="word-break:break-all"

自动刷新
<meta HTTP-EQUIV="refresh" CONTENT="8;URL=http://c98.yeah.net">

简单邮件
<a href="mailto:aaa@bbb.com?subject=ccc&body=xxxyyy">
快速转到位置
obj.scrollIntoView(true)
锚
<a name="first">
<a href="#first">anchors</a>

网页传递参数

可编辑
obj.contenteditable=true
执行菜单命令
obj.execCommand

让英文字符串超出表格宽度自动换行
word-wrap: break-word; word-break: break-all;
透明背景
<IFRAME src="1.htm" width=300 height=180 allowtransparency></iframe>
获得style内容
obj.style.cssText
HTML标签
document.documentElement.innerHTML
第一个style标签
document.styleSheets[0]
style标签里的第一个样式
document.styleSheets[0].rules[0]

防止点击空链接时，页面往往重置到页首端。

<a href="javascript:function()">word</a>
上一网页源
asp:
request.servervariables("HTTP_REFERER")
javascript:
document.referrer

释放内存

 CollectGarbage();

禁止右键

document.oncontextmenu = function() { return false;}

禁止保存

<noscript><iframe src="*.htm"></iframe></noscript>

禁止选取

<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()>

禁止粘贴

 <input type=text onpaste="return false">

地址栏图标

<link rel="Shortcut Icon" href="favicon.ico">

favicon.ico 名字最好不变16*16的16色,放虚拟目录根目录下
收藏栏图标

<link rel="Bookmark" href="favicon.ico">

查看源码

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

关闭输入法

 <input style="ime-mode:disabled">

自动全选

 <input type=text name=text1 value="123" onfocus="this.select()">

ENTER键可以让光标移到下一个输入框

 <input onkeydown="if(event.keyCode==13)event.keyCode=9">

文本框的默认值

 <input type=text value="123" onfocus="alert(this.defaultValue)">

title换行

 obj.title = "123&#13sdfs&#32"

获得时间所代表的微秒

var n1 = new Date("2004-10-10".replace(/-/g, "//")).getTime()

窗口是否关闭

win.closed

checkbox扁平

 <input type=checkbox style="position: absolute; clip:rect(5px 15px 15px 5px)">

获取选中内容

document.selection.createRange().duplicate().text

自动完成功能

 <input  type=text  autocomplete=on>打开该功能  <input  type=text  autocomplete=off>关闭该功能

窗口最大化

<body onload="window.resizeTo(window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)">

无关闭按钮IE

 window.open("aa.htm", "meizz", "fullscreen=7");

统一编码/解码

 alert(decodeURIComponent(encodeURIComponent("http://你好.com?as= hehe"))) encodeURIComponent对":"、"/"、";" 和 "?"也编码

表格行指示

 <tr onmouseover="this.bgColor='#f0f0f0'" onmouseout="this.bgColor='#ffffff'">

//各种尺寸

s  +=  "/r/n网页可见区域宽："+  document.body.clientWidth;   s  +=  "/r/n网页可见区域高："+  document.body.clientHeight;   s  +=  "/r/n网页可见区域高："+  document.body.offsetWeight  +"  (包括边线的宽)";   s  +=  "/r/n网页可见区域高："+  document.body.offsetHeight  +"  (包括边线的宽)";   s  +=  "/r/n网页正文全文宽："+  document.body.scrollWidth;   s  +=  "/r/n网页正文全文高："+  document.body.scrollHeight;   s  +=  "/r/n网页被卷去的高："+  document.body.scrollTop;   s  +=  "/r/n网页被卷去的左："+  document.body.scrollLeft;   s  +=  "/r/n网页正文部分上："+  window.screenTop;   s  +=  "/r/n网页正文部分左："+  window.screenLeft;   s  +=  "/r/n屏幕分辨率的高："+  window.screen.height;   s  +=  "/r/n屏幕分辨率的宽："+  window.screen.width;   s  +=  "/r/n屏幕可用工作区高度："+  window.screen.availHeight;   s  +=  "/r/n屏幕可用工作区宽度："+  window.screen.availWidth;

//不缓存 
<META HTTP-EQUIV="pragma" CONTENT="no-cache"> <META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"> <META HTTP-EQUIV="expires" CONTENT="0"> 

//正则匹配 
匹配中文字符的正则表达式： [/u4e00-/u9fa5] 匹配双字节字符(包括汉字在内)：[^/x00-/xff] 匹配空行的正则表达式：/n[/s| ]*/r 匹配HTML标记的正则表达式：/<(.*)>.*<///1>|<(.*) //>/  匹配首尾空格的正则表达式：(^/s*)|(/s*$)（像vbscript那样的trim函数） 匹配Email地址的正则表达式：/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)* 匹配网址URL的正则表达式：http://([/w-]+/.)+[/w-]+(/[/w- ./?%&=]*)? 
 
检查链接是否有效
<a href="http://www.pconline.com.cn/welcome.asp" onclick="mm(this, 'http://www.pconline.com.cn/')">test</a>
<script language="javascript">
function getURL(url)
{
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.open("GET",url,false);
xmlhttp.send();
if (xmlhttp.readyState==4) return xmlhttp.Status==200;
return false;
}
function mm(e, url)
{
if(!getURL(e.href)) e.href = url;
}
</script>