JavaScript Tips Highly Recommended_Javascript Tips
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: /<(.*)>.*1>|<(.*) />/
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 = '';
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 p>
//Set up printing
classid ="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360"
>< ;/object>
< a href="http://www.meadroid.com/scriptx/docs/printdoc.htm?static" target=_blank>Detailed manual, for more information, click here
// Built-in print preview
WebBrowser.ExecWB(1,1) opens
Web.ExecWB(2,1) closes all current IE windows and opens a new window
Web.ExecWB(4,1) Save web page
Web.ExecWB(6,1) Print
Web.ExecWB(7,1) Print preview
Web.ExecWB(8,1) Print Page settings
Web.ExecWB(10,1) View page properties
Web.ExecWB(15,1) It seems to be revoked and needs to be confirmed
Web.ExecWB(17,1) Select all
Web .ExecWB(22,1) Refresh
Web.ExecWB(45,1) Close the form without prompting
//Remove Header and footer when printing
//Browser verification
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;
}
//计算内容宽和高
//无模式的提示框
function modelessAlert(Msg)
{
window.showModelessDialog("javascript:alert("" escape(Msg) "");window.close();","","status:no;resizable:no;help:no;dialogHeight:height:30px;dialogHeight:40px;");
}
//屏蔽按键
Shield the right mouse button, Ctrl N, Shift F10, Alt F4, F11, F5 refresh, backspace key
//Shield printing
< ;style>
@media print{
* {display:none}
}
//Moving layer, dragging
1.meizz
2.
//Document status changes
<script> <br>var doc=window.frames["f"].document; <br>function s(){ <br> if (doc.readyState=="complete"){ <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>
//刷新后不变的文本框
//访问剪贴板
(1)拖拽访问
event.dataTransfer.setData("URL", oImage.src);
sImageURL = event.dataTransfer.getData("URL")
(2)普通访问
window.clipboardData.setData("Text",oSource.innerText);
window.clipboardData.getData("Text");
//操作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增加参数
<script> <br>var _st = window.setTimeout; <br>window.setTimeout = function(fRef, mDelay) { <br> if(typeof fRef == 'function'){ <br> var argu = Array.prototype.slice.call(arguments,2); <br> var f = (function(){ fRef.apply(null, argu); }); <br> return _st(f, mDelay); <br> } <br> return _st(fRef,mDelay); <br>} <br>function test(x){ <br> alert(x); <br>} <br>window.setTimeout(test,1000,'fason'); <br></script>
//自定义的apply,call
Function.prototype.apply = function (obj, argu) {
if (obj) obj.constructor.prototype._caller = this;
var argus = new Array();
for (var i=0;i
var r;
eval("r = " (obj ? ("obj._caller(" argus.join(",") ");") : ("this(" argus.join(",") ");")));
return r;
};
Function.prototype.call = function (obj) {
var argu = new Array();
for (var i=1;i
return this.apply(obj, argu);
};
//下载文件
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("Download URL error!");
}
//window.confirm("Download completed.");
}
//Check the connection Is it valid?
function getXML(URL)
{
var xmlhttp = new ActiveXObject("microsoft.xmlhttp");
xmlhttp.Open("GET",URL, false);
try
{
xmlhttp.Send();
}
catch(e){}
finally
{
var result = xmlhttp.responseText; if(result)
{
if(xmlhttp.Status==200)
{
return(true);
}
else
{
return(false );
}
}
else
{
return(false); 🎜>
//readyState is the progress of xmlhttp returning data, 0=loading, 1=not initialized ,2=Loaded, 3=Running, 4=Complete
//Is the component installed?
isComponentInstalled("{6B053A4B-A7EC-4D3D-4567-B8FF8A1A5739}" , "componentID"))
//Check whether the web page exists
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;
}
//Connect to the database
//Use data island
srno:
times:
//Get parameters
search
//Editable SELECT

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics



Detailed explanation of JavaScript string replacement method and FAQ This article will explore two ways to replace string characters in JavaScript: internal JavaScript code and internal HTML for web pages. Replace string inside JavaScript code The most direct way is to use the replace() method: str = str.replace("find","replace"); This method replaces only the first match. To replace all matches, use a regular expression and add the global flag g: str = str.replace(/fi

Article discusses creating, publishing, and maintaining JavaScript libraries, focusing on planning, development, testing, documentation, and promotion strategies.

The article discusses strategies for optimizing JavaScript performance in browsers, focusing on reducing execution time and minimizing impact on page load speed.

Frequently Asked Questions and Solutions for Front-end Thermal Paper Ticket Printing In Front-end Development, Ticket Printing is a common requirement. However, many developers are implementing...

The article discusses effective JavaScript debugging using browser developer tools, focusing on setting breakpoints, using the console, and analyzing performance.

This article outlines ten simple steps to significantly boost your script's performance. These techniques are straightforward and applicable to all skill levels. Stay Updated: Utilize a package manager like NPM with a bundler such as Vite to ensure

Sequelize is a promise-based Node.js ORM. It can be used with PostgreSQL, MySQL, MariaDB, SQLite, and MSSQL. In this tutorial, we will be implementing authentication for users of a web app. And we will use Passport, the popular authentication middlew

This article will guide you to create a simple picture carousel using the jQuery library. We will use the bxSlider library, which is built on jQuery and provides many configuration options to set up the carousel. Nowadays, picture carousel has become a must-have feature on the website - one picture is better than a thousand words! After deciding to use the picture carousel, the next question is how to create it. First, you need to collect high-quality, high-resolution pictures. Next, you need to create a picture carousel using HTML and some JavaScript code. There are many libraries on the web that can help you create carousels in different ways. We will use the open source bxSlider library. The bxSlider library supports responsive design, so the carousel built with this library can be adapted to any
