📄 javascript小技巧 .html
字号:
<br/><style>
<br/>@media print{
<br/>* {display:none}
<br/>}
<br/></style>
</p></font>
<p><font size="2"><strong>//移动的图层，拖动
<br/></strong></font>
</p><font size="2">
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee">1.<span style='position:absolute;width:200;height:200;background:red' onmousedown=MouseDown(<span style="COLOR: #0000ff">this</span>) onmousemove=MouseMove() onmouseup=MouseUp()>meizz</span>
<br/><script language=javascript>
<br/><span style="COLOR: #0000ff">var</span> Obj;
<br/><span style="COLOR: #0000ff">function</span> MouseDown(obj)
<br/>{
<br/>  Obj=obj;
<br/>  Obj.setCapture();
<br/>  Obj.l=event.x-Obj.style.pixelLeft;
<br/>  Obj.t=event.y-Obj.style.pixelTop;
<br/>}
<br/><span style="COLOR: #0000ff">function</span> MouseMove()
<br/>{
<br/>  <span style="COLOR: #0000ff">if</span>(Obj!=<span style="COLOR: #0000ff">null</span>)
<br/>  {
<br/>    Obj.style.left = event.x-Obj.l;
<br/>    Obj.style.top = event.y-Obj.t;
<br/>  }
<br/>}
<br/><span style="COLOR: #0000ff">function</span> MouseUp()
<br/>{
<br/>  <span style="COLOR: #0000ff">if</span>(Obj!=<span style="COLOR: #0000ff">null</span>)
<br/>  {
<br/>    Obj.releaseCapture();
<br/>    Obj=<span style="COLOR: #0000ff">null</span>;
<br/>  }
<br/>}
<br/></script>
<br/>2.
<br/><div id=<span style="COLOR: #ff00ff">"myDiv"</span> src=<span style="COLOR: #ff00ff">"logo.gif"</span> ondrag=<span style="COLOR: #ff00ff">"doDrag();"</span> onmouseover=<span style="COLOR: #ff00ff">"this.style.cursor='hand'"</span> style=<span style="COLOR: #ff00ff">"position:absolute;left=100;top=100;"</span> onmousedown=<span style="COLOR: #ff00ff">"doMouseDown();"</span>>
<br/><a href=<span style="COLOR: #ff00ff">"#"</span> onclick=<span style="COLOR: #ff00ff">"return false"</span>><h1>wlecome</h1></a>
<br/></div>
<br/><script language=<span style="COLOR: #ff00ff">"JavaScript"</span> type=<span style="COLOR: #ff00ff">"text/javascript"</span>>
<br/><span style="COLOR: #0000ff">var</span> orgMouseX;
<br/><span style="COLOR: #0000ff">var</span> orgMouseY;
<br/><span style="COLOR: #0000ff">var</span> orgObjX;
<br/><span style="COLOR: #0000ff">var</span> orgObjY;
<br/><span style="COLOR: #0000ff">function</span> doDrag()
<br/>{
<br/><span style="COLOR: #0000ff">var</span> myObject=document.all.myDiv;
<br/>
<br/><span style="COLOR: #0000ff">var</span> x=event.clientX;
<br/><span style="COLOR: #0000ff">var</span> y=event.clientY;
<br/>myObject.style.left=x-(orgMouseX-orgObjX);
<br/>myObject.style.top=y-(orgMouseY-orgObjY);
<br/> 
<br/>}
<br/><span style="COLOR: #0000ff">function</span> doMouseDown()
<br/>{
<br/>orgMouseX=event.clientX;
<br/>orgMouseY=event.clientY;
<br/>orgObjX=parseInt(document.all.myDiv.style.left);
<br/>orgObjY=parseInt(document.all.myDiv.style.top);
<br/>}
<br/>
<br/></script>
<br/> 
</div>
<p><font size="2"><strong>//文档状态改变
<br/></strong></font>
</p></font><font size="2">
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee"><iframe src=<span style="COLOR: #ff00ff">"a.html"</span> id=<span style="COLOR: #ff00ff">"f"</span> name=<span style="COLOR: #ff00ff">"f"</span> scrolling=<span style="COLOR: #ff00ff">"no"</span> frameborder=0 marginwidth=0 marginheight=0></iframe>
<br/><script>
<br/><span style="COLOR: #0000ff">var</span> doc=window.frames[<span style="COLOR: #ff00ff">"f"</span>].document;
<br/><span style="COLOR: #0000ff">function</span> s(){
<br/> <span style="COLOR: #0000ff">if</span> (doc.readyState==<span style="COLOR: #ff00ff">"complete"</span>){
<br/>  document.all.f.style.height=doc.body.scrollHeight
<br/>  document.all.f.style.width=doc.body.scrollWidth
<br/> }
<br/>}
<br/>doc.onreadystatechange=s
<br/></script>
<br/><span style="COLOR: #008000"></span>
</div></font>
<p><font size="2"><strong>//刷新后不变的文本框</strong>
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee"><HTML>
<br/><HEAD>
<br/><META NAME=<span style="COLOR: #ff00ff">"save"</span> CONTENT=<span style="COLOR: #ff00ff">"history"</span>>
<br/><STYLE>
<br/>   .sHistory {behavior:url(#default#savehistory);}
<br/></STYLE>
<br/></HEAD>
<br/><BODY>
<br/><INPUT class=sHistory type=text id=oPersistInput>
<br/></BODY>
<br/></HTML>
</div></font>
</p>
<p><font size="2"><strong>//访问剪贴板</strong>
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee">(1)拖拽访问
<br/>event.dataTransfer.setData(<span style="COLOR: #ff00ff">"URL"</span>, oImage.src);
<br/>sImageURL = event.dataTransfer.getData(<span style="COLOR: #ff00ff">"URL"</span>)
<br/>(2)普通访问
<br/>window.clipboardData.setData(<span style="COLOR: #ff00ff">"Text"</span>,oSource.innerText);
<br/>window.clipboardData.getData(<span style="COLOR: #ff00ff">"Text"</span>);
</div></font>
</p>
<p><font size="2"><strong>//操作COOKIE</strong>
<br/></font>
</p><font size="2">
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee"><span style="COLOR: #0000ff">function</span> SetCookie(sName, sValue)
<br/>{
<br/> document.cookie = sName + <span style="COLOR: #ff00ff">"="</span> + escape(sValue) + <span style="COLOR: #ff00ff">"; "</span>;
<br/>}
<br/><span style="COLOR: #0000ff">function</span> GetCookie(sName)
<br/>{
<br/> <span style="COLOR: #0000ff">var</span> aCookie = document.cookie.split(<span style="COLOR: #ff00ff">"; "</span>);
<br/> for (<span style="COLOR: #0000ff">var</span> i=0; i < aCookie.length; i++)
<br/> {
<br/>  
<br/>  <span style="COLOR: #0000ff">var</span> aCrumb = aCookie[i].split(<span style="COLOR: #ff00ff">"="</span>);
<br/>  <span style="COLOR: #0000ff">if</span> (sName == aCrumb[0]) 
<br/>  <span style="COLOR: #0000ff">return</span> unescape(aCrumb[1]);
<br/> }
<br/> 
<br/>}
<br/><span style="COLOR: #0000ff">function</span> DelCookie(sName)
<br/>{
<br/>document.cookie = sName + <span style="COLOR: #ff00ff">"="</span> + escape(sValue) + <span style="COLOR: #ff00ff">"; expires=Fri, 31 Dec 1999 23:59:59 GMT;"</span>;
<br/>}
</div>
<p><strong>//setTimeout增加参数</strong>
</p></font>
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee"><script>
<br/><span style="COLOR: #0000ff">var</span> _st = window.setTimeout;
<br/>window.setTimeout = <span style="COLOR: #0000ff">function</span>(fRef, mDelay) {
<br/> <span style="COLOR: #0000ff">if</span>(typeof fRef == '<span style="COLOR: #0000ff">function</span>'){
<br/>  <span style="COLOR: #0000ff">var</span> argu = <span style="COLOR: #ff0000">Array</span>.prototype.slice.call(arguments,2);
<br/>  <span style="COLOR: #0000ff">var</span> f = (<span style="COLOR: #0000ff">function</span>(){ fRef.apply(<span style="COLOR: #0000ff">null</span>, argu); });
<br/>  <span style="COLOR: #0000ff">return</span> _st(f, mDelay);
<br/> }
<br/> <span style="COLOR: #0000ff">return</span> _st(fRef,mDelay);
<br/>}
<br/><span style="COLOR: #0000ff">function</span> test(x){
<br/> alert(x);
<br/>}
<br/>window.setTimeout(test,1000,'fason');
<br/></script>
</div>
<p>
<br/><font size="2"><strong>//自定义的apply,call</strong></font>
</p>
<div style="BORDER-RIGHT: #8a8a8a 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #8a8a8a 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 12px; PADDING-BOTTOM: 4px; MARGIN: 4px; OVERFLOW: auto; BORDER-LEFT: #8a8a8a 1px solid; PADDING-TOP: 4px; BORDER-BOTTOM: #8a8a8a 1px solid; FONT-FAMILY: Courier New; BACKGROUND-COLOR: #eeeeee">Function.prototype.apply = <span style="COLOR: #0000ff">function</span> (obj, argu) {
<br/> <span style="COLOR: #0000ff">if</span> (obj) obj.constructor.prototype._caller = <span style="COLOR: #0000ff">this</span>; 
<br/> <span style="COLOR: #0000ff">var</span> argus =⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -