javascript技巧参考

最新推荐文章于 2022-05-01 16:22:40 发布

aifenzhi6838

最新推荐文章于 2022-05-01 16:22:40 发布

阅读量58

点赞数

原文链接：http://www.cnblogs.com/yaunion/archive/2010/08/08/1795320.html

版权

事件源对象
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.captureEvents(Event.KEYDOWN); 访问窗体元素
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.οnmοusedοwn=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> 网页传递参数
location.search(); 可编辑
obj.contenteditable=true 执行菜单命令
obj.execCommand 双字节字符
/[^\x00-\xff]/
汉字
/[\u4e00-\u9fa5]/ 让英文字符串超出表格宽度自动换行
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 οncοntextmenu="return false" οndragstart="return false" onselectstart ="return false" οnselect="document.selection.empty()" οncοpy="document.selection.empty()" onbeforecopy="return false"οnmοuseup="document.selection.empty()> 禁止粘贴
<input type=text οnpaste="return false"> 地址栏图标
<link rel="Shortcut Icon" href="favicon.ico">
favicon.ico 名字最好不变16*16的16色,放虚拟目录根目录下 收藏栏图标
<link rel="Bookmark" href="favicon.ico"> 查看源码
<input type=button value=查看网页源代码 οnclick="window.location = 'view-source:'+ 'http://www.csdn.net/'"> 关闭输入法
<input style="ime-mode:disabled"> 自动全选
<input type=text name=text1 value="123" οnfοcus="this.select()"> ENTER键可以让光标移到下一个输入框
<input οnkeydοwn="if(event.keyCode==13)event.keyCode=9"> 文本框的默认值
<input type=text value="123" οnfοcus="alert(this.defaultValue)"> title换行
obj.title = "123 sdfs " 获得时间所代表的微秒
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)"><br> 获取选中内容
document.selection.createRange().duplicate().text 自动完成功能
<input type=text autocomplete=on>打开该功能
<input type=text autocomplete=off>关闭该功能 窗口最大化
<body οnlοad="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 οnmοuseοver="this.bgColor='#f0f0f0'" οnmοuseοut="this.bgColor='#ffffff'">

//各种尺寸

s += " 网页可见区域宽： " + document.body.clientWidth;

s += " 网页可见区域高： " + document.body.clientHeight;

s += " 网页可见区域高： " + document.body.offsetWeight + " (包括边线的宽) " ;

s += " 网页可见区域高： " + document.body.offsetHeight + " (包括边线的宽) " ;

s += " 网页正文全文宽： " + document.body.scrollWidth;

s += " 网页正文全文高： " + document.body.scrollHeight;

s += " 网页被卷去的高： " + document.body.scrollTop;

s += " 网页被卷去的左： " + document.body.scrollLeft;

s += " 网页正文部分上： " + window.screenTop;

s += " 网页正文部分左： " + window.screenLeft;

s += " 屏幕分辨率的高： " + window.screen.height;

s += " 屏幕分辨率的宽： " + window.screen.width;

s += " 屏幕可用工作区高度： " + window.screen.availHeight;

s += " 屏幕可用工作区宽度： " + window.screen.availWidth;

//正则匹配

匹配中文字符的正则表达式： [\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- ./?%&=]*)?
以下是例子：
利用正则表达式限制网页表单里的文本框输入内容：
用正则表达式限制只能输入中文：οnkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"
1.用正则表达式限制只能输入全角字符： οnkeyup="value=value.replace(/[^\uFF00-\uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\uFF00-\uFFFF]/g,''))"
2.用正则表达式限制只能输入数字：οnkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"
3.用正则表达式限制只能输入数字和英文：οnkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"

//消除图像工具栏

< IMG SRC ="mypicture.jpg" HEIGHT ="100px" WIDTH ="100px" GALLERYIMG ="false" >

< head >

< meta http-equiv ="imagetoolbar" content ="no" >

</ head >

//无提示关闭

function Close()

... {

var ua=navigator.userAgent

var ie=navigator.appName=="Microsoft Internet Explorer"?true:false

if(ie)

...{

var IEversion=parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE "))))

if(IEversion< 5.5)

...{

var str = '<object id=noTipClose classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">'

str += '<param name="Command" value="Close"></object>';

document.body.insertAdjacentHTML("beforeEnd", str);

document.all.noTipClose.Click();

}

else

...{

window.opener =null;

window.close();

}

else

...{

window.close()

}

//取得控件得绝对位置

< script language = " javascript " >

function getoffset(e)

... {

var t=e.offsetTop;

var l=e.offsetLeft;

while(e=e.offsetParent)

...{

t+=e.offsetTop;

l+=e.offsetLeft;

}

var rec = new Array(1);

rec[0] = t;

rec[1] = l;

return rec

}

</ script >

//光标停在文字最后

< 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() " >

//设置打印

< object id = " factory " style = " display:none " viewastext classid = " clsid:1663ed61-23eb-11d2-b92f-008048fdd814 " codebase = " http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360 " ></ object >

< input type = button value = 页面设置 onclick = " factory.printing.PageSetup() " >

< input type = button value = 打印预览 onclick = " factory.printing.Preview() " >

< script language = javascript >

function window.onload()

... {

// -- advanced features

factory.printing.SetMarginMeasure(2) // measure margins in inches

factory.printing.SetPageRange(false, 1, 3) // need pages from 1 to 3

factory.printing.printer = "HP DeskJet 870C"

factory.printing.copies = 2

factory.printing.collate = true

factory.printing.paperSize = "A4"

factory.printing.paperSource = "Manual feed"

// -- basic features

factory.printing.header = "居左显示&b居中显示&b居右显示页码，第&p页/共&P页"

factory.printing.footer = "（自定义页脚）"

factory.printing.portrait = false

factory.printing.leftMargin = 0.75

factory.printing.topMargin = 1.5

factory.printing.rightMargin = 0.75

factory.printing.bottomMargin = 1.5

}

function Print(frame)

... {

factory.printing.Print(true, frame) // print with prompt

}

</ script >

< input type = button value = " 打印本页 " onclick = " factory.printing.Print(false) " >

< input type = button value = " 页面设置 " onclick = " factory.printing.PageSetup() " >

< input type = button value = " 打印预览 " onclick = " factory.printing.Preview() " >< br >

< a href = " http://www.meadroid.com/scriptx/docs/printdoc.htm?static " target = _blank > 具体使用手册，更多信息，点这里 </ a >

//自带的打印预览

WebBrowser.ExecWB( 1 , 1 ) 打开

Web.ExecWB( 2 , 1 ) 关闭现在所有的IE窗口，并打开一个新窗口

Web.ExecWB( 4 , 1 ) 保存网页

Web.ExecWB( 6 , 1 ) 打印

Web.ExecWB( 7 , 1 ) 打印预览

Web.ExecWB( 8 , 1 ) 打印页面设置

Web.ExecWB( 10 , 1 ) 查看页面属性

Web.ExecWB( 15 , 1 ) 好像是撤销，有待确认

Web.ExecWB( 17 , 1 ) 全选

Web.ExecWB( 22 , 1 ) 刷新

Web.ExecWB( 45 , 1 ) 关闭窗体无提示

< style media = print >

.Noprint ... {display:none;}

.PageNext ... {page-break-after: always;}

</ style >

< object id = " WebBrowser " width = 0 height = 0 classid = " CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 " >

</ object >

< center class = " Noprint " >

< input type = button value = 打印 onclick = document.all.WebBrowser.ExecWB( 6 , 1 ) >

< input type = button value = 直接打印 onclick = document.all.WebBrowser.ExecWB( 6 , 6 ) >

< input type = button value = 页面设置 onclick = document.all.WebBrowser.ExecWB( 8 , 1 ) >

</ p >

< p > < input type = button value = 打印预览 onclick = document.all.WebBrowser.ExecWB( 7 , 1 ) >

</ center >

//去掉打印时的页眉页脚

< script language = " JavaScript " >

var HKEY_Root,HKEY_Path,HKEY_Key;

HKEY_Root = " HKEY_CURRENT_USER " ;

HKEY_Path = " \Software\Microsoft\Internet Explorer\PageSetup\ " ;

// 设置网页打印的页眉页脚为空

function PageSetup_Null()

... {

try

...{

var Wsh=new ActiveXObject("WScript.Shell");

HKEY_Key="header";

Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");

HKEY_Key="footer";

Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"");

}

catch(e)...{}

}

// 设置网页打印的页眉页脚为默认值

function PageSetup_Default()

... {

try

...{

var Wsh=new ActiveXObject("WScript.Shell");

HKEY_Key="header";

Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&w&b页码,&p/&P");

HKEY_Key="footer";

Wsh.RegWrite(HKEY_Root+HKEY_Path+HKEY_Key,"&u&b&d");

}

catch(e)...{}

}

</ script >

< input type = " button " value = " 清空页码 " onclick = PageSetup_Null() >

< input type = " button " value = " 恢复页码 " onclick = PageSetup_Default() >

//浏览器验证

function checkBrowser()

... {

this.ver=navigator.appVersion

this.dom=document.getElementById?1:0

this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;

this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;

this.ie4=(document.all && !this.dom)?1:0;

this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;

this.ns4=(document.layers && !this.dom)?1:0;

this.mac=(this.ver.indexOf('Mac') > -1) ?1:0;

this.ope=(navigator.userAgent.indexOf('Opera')>-1);

this.ie=(this.ie6 || this.ie5 || this.ie4)

this.ns=(this.ns4 || this.ns5)

this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns5 || this.ns4 || this.mac || this.ope)

this.nbw=(!this.bw)

return this;

}

//计算内容宽和高

< SCRIPT language = " javascript " >

function test(obj)

... {

var range = obj.createTextRange();

alert("内容区宽度:" + range.boundingWidth + "px 内容区高度:" + range.boundingHeight + "px");

}

</ SCRIPT >

< BODY >

< Textarea id = " txt " height = " 150 " > sdf </ textarea >< INPUT type = " button " value = " 计算内容宽度 " onClick = " test(txt) " >

</ BODY >

//无模式的提示框

function modelessAlert(Msg)

... {

window.showModelessDialog("javascript:alert(""+escape(Msg)+"");window.close();","","status:no;resizable:no;help:no;dialogHeight:height:30px;dialogHeight:40px;");

}

//屏蔽按键

<html>

<head>

<title>屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+F4、F11、F5刷新、退格键</title>

</head>

<body>

<!--

//屏蔽鼠标右键、Ctrl+N、Shift+F10、F11、F5刷新、退格键

// Author: meizz(梅花雨) 2002-6-18

function document.oncontextmenu()...{event.returnValue=false;} //屏蔽鼠标右键

function window.onhelp()...{return false} //屏蔽F1帮助

function document.onkeydown()

... {

if ((window.event.altKey)&&

((window.event.keyCode==37)|| //屏蔽 Alt+ 方向键 ←

(window.event.keyCode==39))) //屏蔽 Alt+ 方向键 →

...{

alert("不准你使用ALT+方向键前进或后退网页！");

event.returnValue=false;

}

/**//* 注：这还不是真正地屏蔽 Alt+ 方向键，

因为 Alt+ 方向键弹出警告框时，按住 Alt 键不放，

用鼠标点掉警告框，这种屏蔽方法就失效了。以后若

有哪位高手有真正屏蔽 Alt 键的方法，请告知。*/

if ((event.keyCode==8) || //屏蔽退格删除键

(event.keyCode==116)|| //屏蔽 F5 刷新键

(event.ctrlKey && event.keyCode==82)) //Ctrl + R

...{

event.keyCode=0;

event.returnValue=false;

}

if (event.keyCode==122)...{event.keyCode=0;event.returnValue=false;} //屏蔽F11

if (event.ctrlKey && event.keyCode==78) event.returnValue=false; //屏蔽 Ctrl+n

if (event.shiftKey && event.keyCode==121)event.returnValue=false; //屏蔽 shift+F10

if (window.event.srcElement.tagName == "A" && window.event.shiftKey)

window.event.returnValue = false; //屏蔽 shift 加鼠标左键新开一网页

if ((window.event.altKey)&&(window.event.keyCode==115)) //屏蔽Alt+F4

...{

window.showModelessDialog("about:blank","","dialogWidth:1px;dialogheight:1px");

return false;

}

</script>

屏蔽鼠标右键、Ctrl+N、Shift+F10、Alt+ F4、F11、F5刷新、退格键

</body>

</html>

//屏蔽打印

<style>

@media print{...} {

* {display:none}

}

</style>

//移动的图层，拖动

<span style='position:absolute;width:200;height:200;background:red' onmousedown=MouseDown(this) onmousemove=MouseMove() onmouseup=MouseUp()>meizz</span>

var Obj;

function MouseDown(obj)

...{

Obj=obj;

Obj.setCapture();

Obj.l=event.x-Obj.style.pixelLeft;

Obj.t=event.y-Obj.style.pixelTop;

}

function MouseMove()

...{

if(Obj!=null)

...{

Obj.style.left = event.x-Obj.l;

Obj.style.top = event.y-Obj.t;

}

function MouseUp()

...{

if(Obj!=null)

...{

Obj.releaseCapture();

Obj=null;

}

</script>

<a href="#" onclick="return false"><h1>wlecome</h1></a>

</div>

var orgMouseX;

var orgMouseY;

var orgObjX;

var orgObjY;

function doDrag()

...{

var myObject=document.all.myDiv;

var x=event.clientX;

var y=event.clientY;

myObject.style.left=x-(orgMouseX-orgObjX);

myObject.style.top=y-(orgMouseY-orgObjY);

}

function doMouseDown()

...{

orgMouseX=event.clientX;

orgMouseY=event.clientY;

orgObjX=parseInt(document.all.myDiv.style.left);

orgObjY=parseInt(document.all.myDiv.style.top);

}

</script>

//文档状态改变

<script>...

var doc=window.frames["f"].document;

function s()

...{

if (doc.readyState=="complete")

...{

document.all.f.style.height=doc.body.scrollHeight

document.all.f.style.width=doc.body.scrollWidth

}

doc.onreadystatechange=s

</script>

//操作COOKIE

function SetCookie(sName, sValue)

... {

document.cookie = sName + "=" + escape(sValue) + "; ";

}

function GetCookie(sName)

... {

var aCookie = document.cookie.split("; ");

for (var i=0; i < aCookie.length; i++)

...{

var aCrumb = aCookie[i].split("=");

if (sName == aCrumb[0])

return unescape(aCrumb[1]);

}

function DelCookie(sName)

... {

document.cookie = sName + "=" + escape(sValue) + "; expires=Fri, 31 Dec 1999 23:59:59 GMT;";

}

//setTimeout增加参数

var _st = window.setTimeout;

window.setTimeout = function (fRef, mDelay)

... {

if(typeof fRef == 'function')

...{

var argu = Array.prototype.slice.call(arguments,2);

var f = (function()...{ fRef.apply(null, argu); });

return _st(f, mDelay);

}

return _st(fRef,mDelay);

}

function test(x)

... {

alert(x);

}

window.setTimeout(test,1000,'fason' );

</script>

//下载文件

function DownURL(strRemoteURL,strLocalURL)

... {

try

...{

var xmlHTTP=new ActiveXObject("Microsoft.XMLHTTP");

xmlHTTP.open("Get",strRemoteURL,false);

xmlHTTP.send();

var adodbStream=new ActiveXObject("ADODB.Stream");

adodbStream.Type=1;//1=adTypeBinary

adodbStream.Open();

adodbStream.write(xmlHTTP.responseBody);

adodbStream.SaveToFile(strLocalURL,2);

adodbStream.Close();

adodbStream=null;

xmlHTTP=null;

}

catch(e)

...{

window.confirm("下载URL出错!");

}

//window.confirm("下载完成.");

}

//检查网页是否存在

function CheckURL(URL)

... {

var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

xmlhttp.Open("GET",URL, false);

try

...{

xmlhttp.Send();

var result = xmlhttp.status;

}

catch(e) ...{return(false); }

if(result==200)

...{

return true;

}

xmlhttp = null;

return false;

}

//连接数据库

//用 JavaScript 写服务器端连接数据库的代码示例

var conn = new ActiveXObject("ADODB.Connection" );

conn.Open("Provider=SQLOLEDB.1;Data Source=localhost;User ID=sa;"+"Password=; Initial Catalog=pubs" );

var rs = new ActiveXObject("ADODB.Recordset" );

var sql="select * from authors" ;

rs.open(sql, conn);

shtml = "<table width='100%' border=1>" ;

shtml +="<tr bgcolor='#f4f4f4'><td>au_id</td><td>au_lname</td><td>au_fname</td><td>phone</td><td>address</td><td> city</td><td>state</td><td>zip</td></tr>" ;

while(! rs.EOF)

... {

shtml += "<tr><td>" + rs("au_id") + "</td><td>" + rs("au_lname") + "</td><td>" + rs("au_fname") + "</td><td>" + rs("phone") + "</td><td>" + rs("address") + "</td><td>" + rs("city") + "</td><td>" + rs("state") + "</td><td>" + rs("zip") + "</td></tr>";

rs.moveNext;

}

shtml += "</table>" ;

document.write(shtml);

rs.close();

rs = null ;

conn.close();

conn = null ;

</script>

转载于:https://www.cnblogs.com/yaunion/archive/2010/08/08/1795320.html

aifenzhi6838

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript技巧参考

事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode event.shiftKey event.altKey event....
复制链接

扫一扫