本文中,收集了一些比较常用的Javascript函数,希望对学习JS的朋友们有所帮助。
1. 字符串长度截取
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
function
cutstr(str, len) {
var
temp,
icount
= 0,
patrn
= /[^\x00-\xff]/,
strre
= "" ;
for
( var
i = 0; i < str.length; i++) {
if
(icount < len - 1) {
temp
= str.substr(i, 1);
if
(patrn.exec(temp) == null )
{
icount
= icount + 1
}
else
{
icount
= icount + 2
}
strre
+= temp
}
else
{
break ;
}
}
return
strre + "..."
}
|
2. 替换全部
1
2
3
|
String.prototype.replaceAll
= function (s1,
s2) {
return
this .replace( new
RegExp(s1, "gm" ),
s2)
}
|
3. 清除空格
1
2
3
4
|
String.prototype.trim
= function ()
{
var
reExtraSpace = /^\s*(.*?)\s+$/;
return
this .replace(reExtraSpace,
"$1" )
}
|
4. 清除左空格/右空格
1
2
|
function
ltrim(s){ return
s.replace( /^(\s*| *)/, "" );
}
function
rtrim(s){ return
s.replace( /(\s*| *)$/, "" );
}
|
5. 判断是否以某个字符串开头
1
2
3
|
String.prototype.startWith
= function
(s) {
return
this .indexOf(s)
== 0
}
|
6. 判断是否以某个字符串结束
1
2
3
4
|
String.prototype.endWith
= function
(s) {
var
d = this .length
- s.length;
return
(d >= 0 && this .lastIndexOf(s)
== d)
}
|
7. 转义html标签
1
2
3
|
function
HtmlEncode(text) {
return
text.replace(/&/g, '&' ).replace(/\ "/g,
'" ').replace(/</g,
'<' ).replace(/>/g,
'>' )
}
|
8. 时间日期格式转换
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
Date.prototype.Format
= function (formatStr)
{
var
str = formatStr;
var
Week = [ '日' ,
'一' ,
'二' ,
'三' ,
'四' ,
'五' ,
'六' ];
str
= str.replace(/yyyy|YYYY/, this .getFullYear());
str
= str.replace(/yy|YY/, ( this .getYear()
% 100) > 9 ? ( this .getYear()
% 100).toString() : '0'
+ ( this .getYear()
% 100));
str
= str.replace(/MM/, ( this .getMonth()
+ 1) > 9 ? ( this .getMonth()
+ 1).toString() : '0'
+ ( this .getMonth()
+ 1));
str
= str.replace(/M/g, ( this .getMonth()
+ 1));
str
= str.replace(/w|W/g, Week[ this .getDay()]);
str
= str.replace(/dd|DD/, this .getDate()
> 9 ? this .getDate().toString()
: '0'
+ this .getDate());
str
= str.replace(/d|D/g, this .getDate());
str
= str.replace(/hh|HH/, this .getHours()
> 9 ? this .getHours().toString()
: '0'
+ this .getHours());
str
= str.replace(/h|H/g, this .getHours());
str
= str.replace(/mm/, this .getMinutes()
> 9 ? this .getMinutes().toString()
: '0'
+ this .getMinutes());
str
= str.replace(/m/g, this .getMinutes());
str
= str.replace(/ss|SS/, this .getSeconds()
> 9 ? this .getSeconds().toString()
: '0'
+ this .getSeconds());
str
= str.replace(/s|S/g, this .getSeconds());
return
str
}
|
9. 判断是否为数字类型
1
2
3
4
5
6
7
8
|
function
isDigit(value) {
var
patrn = /^[0-9]*$/;
if
(patrn.exec(value) == null
|| value == "" )
{
return
false
}
else
{
return
true
}
}
|
10. 设置cookie值
1
2
3
4
5
6
7
8
9
|
function
setCookie(name, value, Hours) {
var
d = new
Date();
var
offset = 8;
var
utc = d.getTime() + (d.getTimezoneOffset() * 60000);
var
nd = utc + (3600000 * offset);
var
exp = new
Date(nd);
exp.setTime(exp.getTime()
+ Hours * 60 * 60 * 1000);
document.cookie
= name + "="
+ escape(value) + ";path=/;expires="
+ exp.toGMTString() + ";domain=360doc.com;"
}
|
11. 获取cookie值
1
2
3
4
5
|
function
getCookie(name) {
var
arr = document.cookie.match( new
RegExp( "(^|
)"
+ name + "=([^;]*)(;|$)" ));
if
(arr != null )
return
unescape(arr[2]);
return
null
}
|
12. 加入收藏夹
1
2
3
4
5
6
7
8
9
10
11
|
function
AddFavorite(sURL, sTitle) {
try
{
window.external.addFavorite(sURL,
sTitle)
}
catch (e)
{
try
{
window.sidebar.addPanel(sTitle,
sURL, "" )
}
catch (e)
{
alert( "加入收藏失败,请使用Ctrl+D进行添加" )
}
}
}
|
13. 设为首页
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
function
setHomepage() {
if
(document.all) {
document.body.style.behavior
= 'url(#default#homepage)' ;
document.body.setHomePage( 'http://w3cboy.com' )
}
else
if
(window.sidebar) {
if
(window.netscape) {
try
{
netscape.security.PrivilegeManager.enablePrivilege( "UniversalXPConnect" )
}
catch (e)
{
alert( "该操作被浏览器拒绝,如果想启用该功能,请在地址栏内输入
about:config,然后将项 signed.applets.codebase_principal_support 值该为true" )
}
}
var
prefs = Components.classes[ '@mozilla.org/preferences-service;1' ].getService(Components.interfaces.nsIPrefBranch);
prefs.setCharPref( 'browser.startup.homepage' ,
'http://w3cboy.com' )
}
}
|
14. 加载样式文件
1
2
3
4
5
6
7
8
9
10
11
12
|
function
LoadStyle(url) {
try
{
document.createStyleSheet(url)
}
catch (e)
{
var
cssLink = document.createElement( 'link' );
cssLink.rel
= 'stylesheet' ;
cssLink.type
= 'text/css' ;
cssLink.href
= url;
var
head = document.getElementsByTagName( 'head' )[0];
head.appendChild(cssLink)
}
}
|
15. 返回脚本内容
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
function
evalscript(s) {
if (s.indexOf( '<script' )
== -1) return
s;
var
p = /<script[^\>]*?>([^\x00]*?)<\/script>/ig;
var
arr = [];
while (arr
= p.exec(s)) {
var
p1 = /<script[^\>]*?src=\"([^\>]*?)\"[^\>]*?(reload=\"1\")?(?:charset=\"([\w\-]+?)\")?><\/script>/i;
var
arr1 = [];
arr1
= p1.exec(arr[0]);
if (arr1)
{
appendscript(arr1[1],
'' ,
arr1[2], arr1[3]);
}
else
{
p1
= /<script(.*?)>([^\x00]+?)<\/script>/i;
arr1
= p1.exec(arr[0]);
appendscript( '' ,
arr1[2], arr1[1].indexOf( 'reload=' )
!= -1);
}
}
return
s;
}
|
16. 清除脚本内容
1
2
3
|
function
stripscript(s) {
return
s.replace(/<script.*?>.*?<\/script>/ig, '' );
}
|
17. 动态加载脚本文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
function
appendscript(src, text, reload, charset) {
var
id = hash(src + text);
if (!reload
&& in_array(id, evalscripts)) return ;
if (reload
&& $(id)) {
$(id).parentNode.removeChild($(id));
}
evalscripts.push(id);
var
scriptNode = document.createElement( "script" );
scriptNode.type
= "text/javascript" ;
scriptNode.id
= id;
scriptNode.charset
= charset ? charset : (BROWSER.firefox ? document.characterSet : document.charset);
try
{
if (src)
{
scriptNode.src
= src;
scriptNode.onloadDone
= false ;
scriptNode.onload
= function
() {
scriptNode.onloadDone
= true ;
JSLOADED[src]
= 1;
};
scriptNode.onreadystatechange
= function
() {
if ((scriptNode.readyState
== 'loaded'
|| scriptNode.readyState == 'complete' )
&& !scriptNode.onloadDone) {
scriptNode.onloadDone
= true ;
JSLOADED[src]
= 1;
}
};
}
else
if (text){
scriptNode.text
= text;
}
document.getElementsByTagName( 'head' )[0].appendChild(scriptNode);
}
catch (e)
{}
}
|
18. 返回按ID检索的元素对象
function $(id) { return !id ? null : document.getElementById(id); }
19. 跨浏览器绑定事件
1
2
3
4
5
6
7
8
9
10
|
function
addEventSamp(obj,evt,fn){
if (!oTarget){ return ;}
if
(obj.addEventListener) {
obj.addEventListener(evt,
fn, false );
} else
if (obj.attachEvent){
obj.attachEvent( 'on' +evt,fn);
} else {
oTarget[ "on"
+ sEvtType] = fn;
}
}
|
20. 跨浏览器删除事件
1
2
3
4
5
6
7
8
9
10
|
function
delEvt(obj,evt,fn){
if (!obj){ return ;}
if (obj.addEventListener){
obj.addEventListener(evt,fn, false );
} else
if (oTarget.attachEvent){
obj.attachEvent( "on"
+ evt,fn);
} else {
obj[ "on"
+ evt] = fn;
}
}
|
21. 为元素添加on方法
1
2
3
4
5
6
7
8
|
Element.prototype.on
= Element.prototype.addEventListener;
NodeList.prototype.on
= function
(event, fn) {、
[][ 'forEach' ].call( this ,
function
(el) {
el.on(event,
fn);
});
return
this ;
};
|
22. 为元素添加trigger方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
Element.prototype.trigger
= function
(type, data) {
var
event = document.createEvent( 'HTMLEvents' );
event.initEvent(type,
true ,
true );
event.data
= data || {};
event.eventName
= type;
event.target
= this ;
this .dispatchEvent(event);
return
this ;
};
NodeList.prototype.trigger
= function
(event) {
[][ 'forEach' ].call( this ,
function
(el) {
el[ 'trigger' ](event);
});
return
this ;
};
|
23. 检验URL链接是否有效
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
function
getUrlState(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 );
}
}
}
|
24. 格式化CSS样式代码
1
2
3
4
5
6
7
8
9
|
function
formatCss(s){ //格式化代码
s
= s.replace(/\s*([\{\}\:\;\,])\s*/g, "$1" );
s
= s.replace(/;\s*;/g, ";" );
//清除连续分号
s
= s.replace(/\,[\s\.\ #\d]*{/g,
"{");
s
= s.replace(/([^\s])\{([^\s])/g, "$1
{\n\t$2" );
s
= s.replace(/([^\s])\}([^\n]*)/g, "$1\n}\n$2" );
s
= s.replace(/([^\s]);([^\s\}])/g, "$1;\n\t$2" );
return
s;
}
|
25. 压缩CSS样式代码
1
2
3
4
5
6
7
8
|
function
compressCss (s) { //压缩代码
s
= s.replace(/\/\*(.|\n)*?\*\ //g,
""); //删除注释
s
= s.replace(/\s*([\{\}\:\;\,])\s*/g, "$1" );
s
= s.replace(/\,[\s\.\ #\d]*\{/g,
"{"); //容错处理
s
= s.replace(/;\s*;/g, ";" );
//清除连续分号
s
= s.match(/^\s*(\S+(\s+\S+)*)\s*$/); //去掉首尾空白
return
(s == null )
? ""
: s[1];
}
|
26. 获取当前路径
1
2
3
4
5
6
|
var
currentPageUrl = "" ;
if
( typeof
this .href
=== "undefined" )
{
currentPageUrl
= document.location.toString().toLowerCase();
} else
{
currentPageUrl
= this .href.toString().toLowerCase();
}
|
27. 判断是否移动设备
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
function
isMobile(){
if
( typeof
this ._isMobile
=== 'boolean' ){
return
this ._isMobile;
}
var
screenWidth = this .getScreenWidth();
var
fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport ||rendererModel.runningExperiments.fixviewport;
var
fixViewPortsExperimentRunning = fixViewPortsExperiment && (fixViewPortsExperiment.toLowerCase() ===
"new" );
if (!fixViewPortsExperiment){
if (! this .isAppleMobileDevice()){
screenWidth
= screenWidth/window.devicePixelRatio;
}
}
var
isMobileScreenSize = screenWidth < 600;
var
isMobileUserAgent = false ;
this ._isMobile
= isMobileScreenSize && this .isTouchScreen();
return
this ._isMobile;
}
|
28. 判断是否移动设备访问
1
2
3
|
function
isMobileUserAgent(){
return
(/iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(window.navigator.userAgent.toLowerCase()));
}
|
29. 判断是否苹果移动设备访问
1
2
3
|
function
isAppleMobileDevice(){
return
(/iphone|ipod|ipad|Macintosh/i.test(navigator.userAgent.toLowerCase()));
}
|
30. 判断是否安卓移动设备访问
1
2
3
|
function
isAndroidMobileDevice(){
return
(/android/i.test(navigator.userAgent.toLowerCase()));
}
|
31. 判断是否Touch屏幕
1
2
3
|
function
isTouchScreen(){
return
(( 'ontouchstart'
in
window) || window.DocumentTouch && document instanceof
DocumentTouch);
}
|
32. 判断是否打开视窗
1
2
3
|
function
isViewportOpen() {
return
!!document.getElementById( 'wixMobileViewport' );
}
|
33. 获取移动设备初始化大小
1
2
3
4
5
6
7
8
9
10
|
function
getInitZoom(){
if (! this ._initZoom){
var
screenWidth = Math.min(screen.height, screen.width);
if ( this .isAndroidMobileDevice()
&& ! this .isNewChromeOnAndroid()){
screenWidth
= screenWidth/window.devicePixelRatio;
}
this ._initZoom
= screenWidth /document.body.offsetWidth;
}
return
this ._initZoom;
}
|
34. 获取移动设备最大化大小
1
2
3
4
5
6
7
8
9
10
11
12
13
|
function
getZoom(){
var
screenWidth = (Math.abs(window.orientation) === 90) ? Math.max(screen.height, screen.width) : Math.min(screen.height, screen.width);
if ( this .isAndroidMobileDevice()
&& ! this .isNewChromeOnAndroid()){
screenWidth
= screenWidth/window.devicePixelRatio;
}
var
FixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport;
var
FixViewPortsExperimentRunning = FixViewPortsExperiment && (FixViewPortsExperiment ===
"New"
|| FixViewPortsExperiment === "new" );
if (FixViewPortsExperimentRunning){
return
screenWidth / window.innerWidth;
} else {
return
screenWidth / document.body.offsetWidth;
}
}
|
35. 获取移动设备屏幕宽度
1
2
3
4
5
6
7
8
9
10
11
|
function
getScreenWidth(){
var
smallerSide = Math.min(screen.width, screen.height);
var
fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport;
var
fixViewPortsExperimentRunning = fixViewPortsExperiment && (fixViewPortsExperiment.toLowerCase() ===
"new" );
if (fixViewPortsExperiment){
if ( this .isAndroidMobileDevice()
&& ! this .isNewChromeOnAndroid()){
smallerSide
= smallerSide/window.devicePixelRatio;
}
}
return
smallerSide;
}
|
36. 完美判断是否为网址
1
2
3
4
5
6
7
8
|
function
IsURL(strUrl) {
var
regular = /^\b(((https?|ftp):\/\/)?[-a-z0-9]+(\.[-a-z0-9]+)*\.(?:com|edu|gov|int|mil|net|org|biz|info|name|museum|asia|coop|aero|[a-z][a-z]|((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]\d)|\d))\b(\/[-a-z0-9_:\@&?=+,.!\/~%\$]*)?)$/i
if
(regular.test(strUrl)) {
return
true ;
} else
{
return
false ;
}
}
|