Home > Web Front-end > JS Tutorial > JavaScript Tips Highly Recommended_Javascript Tips

JavaScript Tips Highly Recommended_Javascript Tips

PHP中文网
Release: 2016-05-16 19:26:56
Original
1003 people have browsed it

Event source object
event.srcElement.tagName
event.srcElement.type
Capture release
event.srcElement.setCapture();
event.srcElement.releaseCapture();
Event key
event.keyCode
event.shiftKey
event.altKey
event.ctrlKey
Event return value
event.returnValue
Mouse position
event. x
event.y
Form active element
document.activeElement
Bind event
document.captureEvents(Event.KEYDOWN);
Access form element
document. all("txt").focus();
document.all("txt").select();
Form command
document.execCommand
Form COOKIE
document. cookie
Menu event
document.oncontextmenu
Create element
document.createElement("SPAN");
Get element based on mouse:
document.elementFromPoint(event.x,event. y).tagName=="TD
document.elementFromPoint(event.x,event.y).appendChild(ms)
Form pictures
document.images[index]
Form event binding Define
document.onmousedown=scrollwindow;
Element
document.Form.elements[index]
Object binding event
document.all.xxx.detachEvent('onclick',a) ;
Number of plug-ins
navigator.plugins
Get variable type
typeof($js_libpath) == "undefined"
Drop-down box
Drop-down box.options[index]
Drop-down Box.options.length
Find object
document.getElementsByName("r1");
document.getElementById(id);
Timing
timer=setInterval('scrollwindow()',delay );
clearInterval(timer);
UNCODE encoding
escape(),unescape
Parent object
obj.parentElement(dhtml)
obj.parentNode(dom)
Exchange Table rows
TableID.moveRow(2,1)
Replace CSS
document.all.csss.href = "a.css";
Display side by side
display:inline
Hide focus
hidefocus=true
Wrap line according to width
style="word-break:break-all"
Auto refresh

Simple email

Quick Go to location
obj.scrollIntoView(true)
Anchors

anchors
Web page passing parameters
location.search();
Editable
obj.contenteditable=true
Execute menu command
obj.execCommand
Double-byte characters
/[ ^x00-xff]/
Chinese characters
/[u4e00-u9fa5]/
Let the English string automatically wrap when it exceeds the width of the table
word-wrap: break-word; word-break: break-all ;
Transparent background

Get style content
obj.style.cssText
HTML Tag
document.documentElement.innerHTML
The first style tag
document.styleSheets[0]
The first style in the style tag
document.styleSheets[0].rules[0 ]
Prevent the page from being reset to the top of the page when clicking on an empty link.
word
Previous web page source
asp:
request.servervariables("HTTP_REFERER")
javascript:
document.referrer
Release memory
CollectGarbage();
Disable right click
document.oncontextmenu = function() { return false;}
Disable saving

Disable selection
Address bar icon

favicon.ico The name is preferably the same 16*16 colors and placed in the root directory of the virtual directory
Favorite bar icon

View source code

Turn off input method

Automatically select all
< input type=text name=text1 value="123" onfocus="this.select()">
ENTER key can move the cursor to the next input box

Default value of text box

title newline
obj.title = "123 sdfs "
Get the microsecond represented by the time
var n1 = new Date("2004-10-10".replace(/-/g, "/")).getTime()
Whether the window Close
win.closed
checkbox flat


Get selected content
document.selection.createRange().duplicate().text
Autocomplete function
Turn on this function
Maximize window

No close button IE
window.open("aa.htm", "meizz", "fullscreen=7");
Uniform encoding/decoding
alert(decodeURIComponent(encodeURIComponent( "http://hello.com?as= hehe")))
encodeURIComponent also encodes ":", "/", ";" and "?"
Table row instructions
< tr onmouseover="this.bgColor='#f0f0f0'" onmouseout="this.bgColor='#ffffff'">
Various sizes

Copy code The code is as follows:


s = "rnVisible area width of web page:" document.body.clientWidth;
s = "Height of visible area of ​​rn web page:" document.body .clientHeight;
s = "rnThe height of the visible area of ​​the webpage:" "document.body.offsetWeight" (including the width of the edge)"; Including the width of the edge)";
s = "rnThe full text width of the webpage body:" document.body.scrollWidth;
s = "rnThe full text height of the webpage body:" document.body.scrollHeight;
s = "rnThe webpage was scrolled high:" document.body.scrollTop;
s = "rnThe webpage was scrolled to the left:" document.body.scrollLeft;
s = "rnThe main body of the webpage:" window.screenTop;
s = "rnThe left side of the text of the web page:" window.screenLeft;
s = "The high screen resolution:" window.screen.height;
s = "rnScreen resolution Rate width: " window.screen.width;
s = "rnScreen available work area height:" window.screen.availHeight;
s = "Screen available work area width:" window.screen.availWidth ;



Filter numbers

Copy code The code is as follows:




// Special purpose

Copy code The code is as follows:










No caching

Copy code The code is as follows:






Regular matching

Copy code The code is as follows:


match Chinese characters Regular expression: [u4e00-u9fa5]
Matching double-byte characters (including Chinese characters): [^x00-xff]
Regular expression matching blank lines: n[s| ]*r
Regular expression matching HTML tags: /<(.*)>.*|<(.*) />/
Regular expression matching leading and trailing spaces: (^ s*)|(s*$) (trim function like vbscript)
Regular expression matching email address: w ([- .]w )*@w ([-.]w )*.w ( [-.]w )*
Regular expression matching URL: http://([w-] .) [w-] (/[w- ./?%&=]*)?
The following is an example:
Use regular expressions to limit the input content of the text box in the web form:
Use regular expressions to limit only Chinese input: onkeyup="value=value.replace(/[^u4E00-u9FA5 ]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^u4E00-u9FA5]/g,''))"
1. Use regular expressions to limit the input of only full-width characters: onkeyup="value=value.replace(/[^uFF00-uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData(' text').replace(/[^uFF00-uFFFF]/g,''))"
2. Use regular expressions to limit the input of numbers: onkeyup="value=value.replace(/[^d] /g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))"
3. Use regular expressions Only numbers and English can be entered: onkeyup="value=value.replace(/[W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace (/[^d]/g,''))"


Clear image toolbar

Copy code The code is as follows:


or





Close silently

Copy code The code is as follows:


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  = '
       str  = ''; 
       document.body.insertAdjacentHTML("beforeEnd", str); 
       document.all.noTipClose.Click(); 
  } 
      else 
  { 
       window.opener =null; 
       window.close(); 
      } 
   } 
 else 
 { 
  window.close() 
   } 



取得控件得绝对位置(1)


[Ctrl A 全选 注:如需引入外部Js需刷新才能执行]


获得控件的绝对位置(2)

复制代码 代码如下:


oRect = obj.getBoundingClientRect(); 
oRect.left 
oRect. 


光标停在文字最后


[Ctrl A 全选 注:如需引入外部Js需刷新才能执行]



//Special effects for page entry and exit

Enter page
Exit page
This is the page being loaded Some special effects when entering and calling out. duration represents the duration of the special effect, in seconds. Transition indicates which special effect to use
, the value is 1-23:
0 Rectangular reduction Refresh from top to bottom
5 Refresh from top to bottom
6 Refresh from left to right
7 Refresh from right to left
8 Vertical blinds
9 Horizontal blinds
10 Misaligned horizontal blinds
11 Misaligned Vertical blinds
12 point spread
13 left and right to middle refresh
14 middle to left and right refresh
15 middle to upper and lower
16 upper and lower to middle
17 lower right to upper left
18 Upper right to lower left
19 Upper left to lower right
20 Lower left to upper right
21 Horizontal bar ;meta name="ROBOTS" content="Attribute value">
The attribute values ​​include the following:
The attribute value is "all": the file will be retrieved, and the links on the page can be queried;
Attribute value is "none": the file will not be retrieved, and the link on the page will not be queried;
Attribute value is "index": the file will be retrieved;
Attribute value is "follow": the link on the page will be queried Link;
The attribute value is "noindex": the file is not retrieved, but the link can be queried;
The attribute value is "nofollow":



//Print pagination


page1


page2



//Set up printing