原生态纯JavaScript 100大技巧大收集---你值得拥有

原生态纯JavaScript 100大技巧大收集---你值得拥有
1、原生JavaScript实现字符串长度截取

String.prototype.trim = function() {
var reExtraSpace = /^\s*(.*?)\s+$/;
return this.replace(reExtraSpace, "$1")
}
4、原生JavaScript替换全部

String.prototype.replaceAll = function(s1, s2) {
return this.replace(new RegExp(s1, "gm"), s2)
}
5、原生JavaScript转义html标签

function HtmlEncode(text) {
return text.replace(/&/g, '&').replace(/\"/g, '"').replace(/</g, '<').replace(/>/g, '>')
}
6、原生JavaScript还原html标签

function HtmlDecode(text) {
return text.replace(/&/g, '&').replace(/"/g, '\"').replace(/</g, '<').replace(/>/g, '>')
}
7、原生JavaScript时间日期格式转换

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
}
8、原生JavaScript判断是否为数字类型

function isDigit(value) {
var patrn = /^[0-9]*$/;
if (patrn.exec(value) == null || value == "") {
return false
} else {
return true
}
}
9、原生JavaScript设置cookie值

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;"
}
10、原生JavaScript获取cookie值

function getCookie(name) {
var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
if (arr != null) return unescape(arr[2]);
return null
}
11、原生JavaScript加入收藏夹

function AddFavorite(sURL, sTitle) {
try {
window.external.addFavorite(sURL, sTitle)
} catch(e) {
try {
window.sidebar.addPanel(sTitle, sURL, "")
} catch(e) {
alert("加入收藏失败，请使用Ctrl+D进行添加")
}
}
}
12、原生JavaScript设为首页

var ua = navigator.userAgent.toLowerCase();
var isIE6 = ua.indexOf("msie 6") > -1;
if (isIE6) {
try {
document.execCommand("BackgroundImageCache", false, true)
} catch(e) {}
}
14、原生JavaScript加载样式文件

function stripscript(s) {
return s.replace(/<script.*?>.*?<\/script>/ig, '');
}
17、原生JavaScript动态加载脚本文件

function $(id) {
return !id ? null : document.getElementById(id);
}
19、原生JavaScript返回浏览器版本内容

function addEventSamp(obj,evt,fn){
if (obj.addEventListener) {
obj.addEventListener(evt, fn, false);
}else if(obj.attachEvent){
obj.attachEvent('on'+evt,fn);
}
}
23、原生JavaScript光标停在文字的后面，文本框获得焦点时调用

function focusLast(){
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart('character',e.value.length);
r.collapse(true);
r.select();
}
24、原生JavaScript检验URL链接是否有效

function yasuoCss (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];
}
27、原生JavaScript获取当前路径

var currentPageUrl = "";
if (typeof this.href === "undefined") {
currentPageUrl = document.location.toString().toLowerCase();
}
else {
currentPageUrl = this.href.toString().toLowerCase();
}
28、原生JavaScriptIP转成整型

function _ip2int(ip){
var num = 0;
ip = ip.split(".");
num = Number(ip[0]) * 256 * 256 * 256 + Number(ip[1]) * 256 * 256 + Number(ip[2]) * 256 + Number(ip[3]);
num = num >>> 0;
return num;
}
29、原生JavaScript整型解析为IP地址

function _int2iP(num){
var str;
var tt = new Array();
tt[0] = (num >>> 24) >>> 0;
tt[1] = ((num << 8) >>> 24) >>> 0;
tt[2] = (num << 16) >>> 24;
tt[3] = (num << 24) >>> 24;
str = String(tt[0]) + "." + String(tt[1]) + "." + String(tt[2]) + "." + String(tt[3]);
return str;
}
30、原生JavaScript实现checkbox全选与全不选

(31~40)移动篇
31、原生JavaScript判断是否移动设备

function isMobileUserAgent(){
return (/iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(window.navigator.userAgent.toLowerCase()));
}
33、原生JavaScript判断是否苹果移动设备访问

function isAppleMobileDevice(){
return (/iphone|ipod|ipad|Macintosh/i.test(navigator.userAgent.toLowerCase()));
}
34、原生JavaScript判断是否安卓移动设备访问

function isAndroidMobileDevice(){
return (/android/i.test(navigator.userAgent.toLowerCase()));
}
35、原生JavaScript判断是否Touch屏幕

function isTouchScreen(){
return (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch);
}
36、原生JavaScript判断是否在安卓上的谷歌浏览器

function isViewportOpen() {
return !!document.getElementById('wixMobileViewport');
}
38、原生JavaScript获取移动设备初始化大小

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;
}
}
42、原生JavaScript根据样式名称检索元素对象

String.prototype.startWith = function (s) {
return this.indexOf(s) == 0
}
44、原生JavaScript判断是否以某个字符串结束

String.prototype.endWith = function (s) {
var d = this.length - s.length;
return (d >= 0 && this.lastIndexOf(s) == d)
}
45、原生JavaScript返回IE浏览器的版本号

function getIE(){
if (window.ActiveXObject){
var v = navigator.userAgent.match(/MSIE ([^;]+)/)[1];
return parseFloat(v.substring(0, v.indexOf(".")))
}
return false
}
46、原生JavaScript获取页面高度

function getPageHeight(){
var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat"
? a
: g.documentElement;
return Math.max(f.scrollHeight, a.scrollHeight, d.clientHeight);
}
47、原生JavaScript获取页面scrollLeft

function getPageScrollLeft(){
var a = document;
return a.documentElement.scrollLeft || a.body.scrollLeft;
}
48、原生JavaScript获取页面可视宽度

function getPageViewWidth(){
var d = document, a = d.compatMode == "BackCompat"
? d.body
: d.documentElement;
return a.clientWidth;
}
49、原生JavaScript获取页面宽度

function getPageWidth(){
var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat"
? a
: g.documentElement;
return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth);
}
50、原生JavaScript获取页面scrollTop

function getPageScrollTop(){
var a = document;
return a.documentElement.scrollTop || a.body.scrollTop;
}
51、原生JavaScript获取页面可视高度

function getPageViewHeight() {
var d = document, a = d.compatMode == "BackCompat"
? d.body
: d.documentElement;
return a.clientHeight;
}
52、原生JavaScript跨浏览器添加事件

function removeUrlPrefix(a){
a=a.replace(/：/g,":").replace(/．/g,".").replace(/／/g,"/");
while(trim(a).toLowerCase().indexOf("http://")==0){
a=trim(a.replace(/http:\/\//i,""));
}
return a;
}
55、原生JavaScript随机数时间戳

function uniqueId(){
var a=Math.random,b=parseInt;
return Number(new Date()).toString()+b(10*a())+b(10*a())+b(10*a());
}
56、原生JavaScript全角半角转换,iCase: 0全到半，1半到全，其他不转化

function getScrollXY() {
return document.body.scrollTop ? {
x: document.body.scrollLeft,
y: document.body.scrollTop
}: {
x: document.documentElement.scrollLeft,
y: document.documentElement.scrollTop
}
}
59、原生JavaScript另一种正则日期格式化函数+调用方法

Date.prototype.format = function(format){ //author: meizz
var o = {
"M+" : this.getMonth()+1, //month
"d+" : this.getDate(), //day
"h+" : this.getHours(), //hour
"m+" : this.getMinutes(), //minute
"s+" : this.getSeconds(), //second
"q+" : Math.floor((this.getMonth()+3)/3), //quarter
"S" : this.getMilliseconds() //millisecond
}
if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
(this.getFullYear()+"").substr(4 - RegExp.$1.length));
for(var k in o)if(new RegExp("("+ k +")").test(format))
format = format.replace(RegExp.$1,
RegExp.$1.length==1 ? o[k] :
("00"+ o[k]).substr((""+ o[k]).length));
return format;
}
alert(new Date().format("yyyy-MM-dd hh:mm:ss"));
60、原生JavaScript时间个性化输出功能

/*
1、< 60s, 显示为“刚刚”
2、>= 1min && < 60 min, 显示与当前时间差“XX分钟前”
3、>= 60min && < 1day, 显示与当前时间差“今天 XX:XX”
4、>= 1day && < 1year, 显示日期“XX月XX日 XX:XX”
5、>= 1year, 显示具体日期“XXXX年XX月XX日 XX:XX”
*/
function timeFormat(time){
var date = new Date(time)
, curDate = new Date()
, year = date.getFullYear()
, month = date.getMonth() + 1
, day = date.getDate()
, hour = date.getHours()
, minute = date.getMinutes()
, curYear = curDate.getFullYear()
, curHour = curDate.getHours()
, timeStr;

if(year < curYear){
timeStr = year +'年'+ month +'月'+ day +'日 '+ hour +':'+ minute;
}else{
var pastTime = curDate - date
, pastH = pastTime/3600000;

if(pastH > curHour){
timeStr = month +'月'+ day +'日 '+ hour +':'+ minute;
}else if(pastH >= 1){
timeStr = '今天 ' + hour +':'+ minute +'分';
}else{
var pastM = curDate.getMinutes() - minute;
if(pastM > 1){
timeStr = pastM +'分钟前';
}else{
timeStr = '刚刚';
}
}
}
return timeStr;
}
61、原生JavaScript解决offsetX兼容性问题

// 针对火狐不支持offsetX/Y
function getOffset(e){
var target = e.target, // 当前触发的目标对象
eventCoord,
pageCoord,
offsetCoord;

// 计算当前触发元素到文档的距离
pageCoord = getPageCoord(target);

// 计算光标到文档的距离
eventCoord = {
X : window.pageXOffset + e.clientX,
Y : window.pageYOffset + e.clientY
};

// 相减获取光标到第一个定位的父元素的坐标
offsetCoord = {
X : eventCoord.X - pageCoord.X,
Y : eventCoord.Y - pageCoord.Y
};
return offsetCoord;
}

function getPageCoord(element){
var coord = { X : 0, Y : 0 };
// 计算从当前触发元素到根节点为止，
// 各级 offsetParent 元素的 offsetLeft 或 offsetTop 值之和
while (element){
coord.X += element.offsetLeft;
coord.Y += element.offsetTop;
element = element.offsetParent;
}
return coord;
}
62、原生JavaScript常用的正则表达式

//正整数
/^[0-9]*[1-9][0-9]*$/;
//负整数
/^-[0-9]*[1-9][0-9]*$/;
//正浮点数
/^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/;
//负浮点数
/^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/;
//浮点数
/^(-?\d+)(\.\d+)?$/;
//email地址
/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
//url地址
/^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$/;
//年/月/日（年-月-日、年.月.日）
/^(19|20)\d\d[- /.](0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])$/;
//匹配中文字符
/[\u4e00-\u9fa5]/;
//匹配帐号是否合法(字母开头，允许5-10字节，允许字母数字下划线)
/^[a-zA-Z][a-zA-Z0-9_]{4,9}$/;
//匹配空白行的正则表达式
/\n\s*\r/;
//匹配中国邮政编码
/[1-9]\d{5}(?!\d)/;
//匹配身份证
/\d{15}|\d{18}/;
//匹配国内电话号码
/(\d{3}-|\d{4}-)?(\d{8}|\d{7})?/;
//匹配IP地址
/((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)/;
//匹配首尾空白字符的正则表达式
/^\s*|\s*$/;
//匹配HTML标记的正则表达式
< (\S*?)[^>]*>.*?|< .*? />;
63、原生JavaScript实现返回顶部的通用方法

// 用法：如果地址是 test.htm?t1=1&t2=2&t3=3, 那么能取得：GET["t1"], GET["t2"], GET["t3"]
function get_get(){
querystr = window.location.href.split("?")
if(querystr[1]){
GETs = querystr[1].split("&")
GET =new Array()
for(i=0;i<GETs.length;i++){
tmp_arr = GETs[i].split("=")
key=tmp_arr[0]
GET[key] = tmp_arr[1]
}
}
return querystr[1];
}
65、原生JavaScript实现全选通用方法

function uncheckAll(form) {
for (var i=0;i<form.elements.length;i++){
var e = form.elements[i];
if (e.name != 'chkall')
e.checked=!e.checked;
}
}
67、原生JavaScript实现打开一个窗体通用方法

function get_checkbox_value(field){
if(field&&field.length){
for(var i=0;i<field.length;i++){
if(field[i].checked && !field[i].disabled){
return field[i].value;
}
}
}else {
return;
}
}

(71~80)验证篇这一篇文章主要是10个比较常用表单验证功能，包括了邮箱、危险字符、验证长度、验证网址、验证小数、整数、浮点数等常用的验证，有了这些代码片段，平时的表单验证也可以不需要jquery的验证插件了，希望可以帮到大家。。。
71、原生JavaScript判断是否为邮箱

function isValidLength(chars, len) {
if (chars.length < len) {
return false;
}
return true;
}
74、原生JavaScript判断字符串是为网址不区分大小写

function isValidDecimal( chars ) {
var re=/^\d*\.?\d{1,2}$/;
if (chars.match(re) == null)
return false;
else
return true;
}
76、原生JavaScript判断字符串是否为整数

function isNumber( chars ) {
var re=/^\d*$/;
if (chars.match(re) == null)
return false;
else
return true;
}
77、原生JavaScript判断字符串是否为浮点数

function isLetters( str ){
var re=/^[A-Za-z]+$/;
if (str.match(re) == null)
return false;
else
return true;
}
79、原生JavaScript判断字符串是否邮政编码

function isValidPost( chars ) {
var re=/^\d{6}$/;
if (chars.match(re) == null)
return false;
else
return true;
}
80、原生JavaScript判断字符是否空NULL

function isNULL( chars ) {
if (chars == null)
return true;
if (jsTrim(chars).length==0)
return true;
return false;
}
81、原生JavaScript用正则表达式提取页面代码中所有网址

Array.prototype.unique=function(){
return this.reverse().join(",").match(/([^,]+)(?!.*\1)/ig).reverse();
}
83、原生JavaScript用正则表达式清除相同的数组(高效率)

String.prototype.unique=function(){
var x=this.split(/[\r\n]+/);
var y='';
for(var i=0;i<x.length;i++){
if(!new RegExp("^"+x[i].replace(/([^\w])/ig,"\\$1")+"$","igm").test(y)){
y+=x[i]+"\r\n"
}
}
return y
}
84、原生JavaScript用正则表达式按字母排序，对每行进行数组排序

function SetSort(){
var text=K1.value.split(/[\r\n]/).sort().join("\r\n");//顺序
var test=K1.value.split(/[\r\n]/).sort().reverse().join("\r\n");//反序
K1.value=K1.value!=text?text:test;
}
85、原生JavaScript字符串反序

function IsReverse(text){
return text.split('').reverse().join('');
}
86、原生JavaScript用正则表达式清除html代码中的脚本

function clear_script(){
K1.value=K1.value.replace(/<script.*?>[\s\S]*?<\/script>|\s+on[a-zA-Z]{3,16}\s?=\s?"[\s\S]*?"|\s+on[a-zA-Z]{3,16}\s?=\s?'[\s\S]*?'|\s+on[a-zA-Z]{3,16}\s?=[^ >]+/ig,"");
}
87、原生JavaScript动态执行JavaScript脚本

function javascript(){
try{
eval(K1.value);
}catch(e){
alert(e.message);
}
}
88、原生JavaScript动态执行VBScript脚本

/**
* 判断变量是否空值
* undefined, null, '', false, 0, [], {} 均返回true，否则返回false
*/
function empty(v){
switch (typeof v){
case 'undefined' : return true;
case 'string' : if(trim(v).length == 0) return true; break;
case 'boolean' : if(!v) return true; break;
case 'number' : if(0 === v) return true; break;
case 'object' :
if(null === v) return true;
if(undefined !== v.length && v.length==0) return true;
for(var k in v){return false;} return true;
break;
}
return false;
}
94、原生JavaScript实现base64解码

function getViewSize(){
var de=document.documentElement;
var db=document.body;
var viewW=de.clientWidth==0 ? db.clientWidth : de.clientWidth;
var viewH=de.clientHeight==0 ? db.clientHeight : de.clientHeight;
return Array(viewW ,viewH);
}
97、原生JavaScript判断IE版本号（既简洁、又向后兼容！）

var _IE = (function(){
var v = 3, div = document.createElement('div'), all = div.getElementsByTagName('i');
while (
div.innerHTML = '',
all[0]
);
return v > 4 ? v : false ;
}());
98、原生JavaScript获取浏览器版本号

posted @ 2016-11-08 15:20 sunsian 阅读(212) 评论(0) 编辑收藏举报

刷新页面返回顶部

原生态纯JavaScript 100大技巧大收集---你值得拥有

公告