javascript小功能
/**
* 功能说明: 是否为数组
*
**/function isArray(value) {
if(typeof Array.isArray === "function") {
//ES5新增加的判断数组的方法，IE9+支持
return Array.isArray(value);
} else {
return Object.prototype.toString.call(value) === "[object Array]";
}
}---------------------------------------------------------------------------------/**
* 功能说明: 合并数组
*
**/function arrayConnect(array1,array2){
Array.prototype.push.apply(array1,array2);}
---------------------------------------------------------------------------------
/**
* 功能说明: 邮箱验证
*
**/utils.isEmail=function(str){
var reg = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;
return reg.test(str);
}---------------------------------------------------------------------------------/**
* 功能说明: 判断密码强度
* @param: val<密码值>
**/
verifyCheck.pwdStrong = function (val){
var lv = 0;
if (val.match(/[a-z]/g)) { lv++; }
if (val.match(/[A-Z]/g)) { lv++; }
if (val.match(/[0-9]/g)) { lv++; }
if (val.match(/(.[^a-z0-9A-Z])/g)) { lv++; }
if (lv > 4) { lv = 4; }
if (lv === 0) return false;
return lv;
};
---------------------------------------------------------------------------------
/**
* 功能说明: 获取属性值
* @param: obj<元素> ，attr<属性> 参数不能有空格* 调用实例： getStyle(oDiv,"maxWidth");
**/
function getStyle(obj,attr) { return obj.currentStyle ?obj.currentStyle[attr]:getComputedStyle(obj)[attr];}
---------------------------------------------------------------------------------
/**
* 功能说明: 全选
* @param:
**/
$("#checkboxAll").click(function(){
var state = $(this).prop('checked');
$("input:checkbox[name='checkbox']").prop('checked',state);
});
---------------------------------------------------------------------------------
/**
* 功能说明: IE6浏览器提示
* @param:* 调用实例： getStyle(oDiv,"maxWidth");
**/
<!--[if IE 6]>
<script>
var fRemindBox = $('<div class="FRemindBox"></div>');
var fRemind = $('<div class="FRemind"></div>');
var femindInfo = $('<div class="RemindInfo"><span>您的浏览器版本过旧，请升级您的浏览器。</span></div>');
var femindLogo = $('<div class="RemindLogo"><a class="ChromeLogo" href="http://www.google.cn/chrome/intl/zh-CN/landing_chrome.html" target="_blank">' +
'<img src="/Content/themes/images/ChromeLogo.jpg" /></a><a class="firefoxLogo" href="http://www.firefox.com.cn/download/" target="_blank">' +
'<img src="/Content/themes/images/FFLogo.jpg" /></a><a class="ieLogo" href="http://www.iefans.net/" target="_blank">' +
'<img src="/Content/themes/images/ieLogo.jpg" /></a></div>');
fRemindBox.append(fRemind.append(femindInfo).append(femindLogo));
$("body").prepend(fRemindBox);
</script>
<![endif]-->
---------------------------------------------------------------------------------
/**
* 功能说明: string格式化
* @param:* 调用实例：expample var template1="我是{0}，今年{1}了"; var result1=template1.format("loogn",22);
**/
String.prototype.format = function (args) {
var result = this;
if (arguments.length > 0) {
if (arguments.length == 1 && typeof (args) == "object") {
for (var key in args) {
if (args[key] != undefined) {
var reg = new RegExp("({" + key + "})", "g");
result = result.replace(reg, args[key]);
}
}
}//example var template2="我是{name}，今年{age}了";var result2=template2.format({name:"loogn",age:22});
else {
for (var i = 0; i < arguments.length; i++) {
if (arguments[i] != undefined) {
var reg = new RegExp("({)" + i + "(})", "g");
result = result.replace(reg, arguments[i]);
}
}//expample var template1="我是{0}，今年{1}了"; var result1=template1.format("loogn",22);
}
}
return result;
}
---------------------------------------------------------------------------------
/**
* 功能说明: 判断浏览器是否支持 placeholder属性
* @param:* 调用实例：
**/
function isPlaceholder(){
var input = document.createElement('input');
return 'placeholder' in input;
}
---------------------------------------------------------------------------------
/**
* 功能说明:分享到新浪微博
* @param:* 调用实例：
**/
base.sharetosina=function(title,url,picurl)
{
var picStr=picurl?'&pic='+picurl:"";//图片
//var sharesinastring='http://v.t.sina.com.cn/share/share.php?title='+encodeURI(title)+'&url='+url+'&content=utf-8&sourceUrl='+url+picStr;
title="标题 "+escape(title)+" （想看更多？点击创新宝链接：http://www.chuangxb.com）";
var sharesinastring='http://v.t.sina.com.cn/share/share.php?title='+title;window.open(sharesinastring,'newwindow','height=400,width=400,top=100,left=100');
}---------------------------------------------------------------------------------
/**
* 功能说明:事件代理
* @param:
* 调用实例：
**/
事件代理时，你能够在事件被DOM绑定后仍然可以添加多个被匹配的元素到其中，而它们同样能够正常工作
$('#myTable').click(function(e)
{
var clicked = $(e.target);
clicked.css('background','red');
//e'包含了事件的信息，包括了实际接收到click事件的目标元素。我们所要做的就是检查是哪个单元格被点击了。
---------------------------------------------------------------------------------
/**
* 功能说明:data()方法
* @param:
* 调用实例：
**/
jQuery内置的data()方法存储状态,它可以用来存储key/value类型的数据
'#myDiv').data('currentState', 'off');
'.button').click(function() { var menuItem = $(this).parent();var panel = menuItem.find('.panel'); if (menuItem.data('collapsed')) { menuItem.data('collapsed', false); panel.slideDown(); } else { menuItem.data('collapsed', true); panel.slideUp(); } });
自定义选择器
':'], { over100pixels: function(a) { return $(a).height() > 100; } }); //创建一个自定义的选择器，它可以找出所有长度超过100px的元素。 $('.box:over100pixels').click(function() { alert('The element you clicked is over 100 pixels high'); });---------------------------------------------------------------------------------
/**
* 功能说明:图片已加载完毕
* @param:
* 调用实例：
**/
'#myImage').attr('src', 'image.jpg').load(function() { alert('Image Loaded'); });
HTML属性增加JS类
在jQuery加载之后你可以使用方法将”JS”类添加到HTML标签中：
'HTML').addClass('JS');
因为这仅仅发生在javascript有效的时候，如果用户打开JavaScript开关，那么你可以使用它给元素添加上CSS风格：
.JS #myDiv{display:none;}
---------------------------------------------------------------------------------
/**
* 功能说明:回到顶部按钮
* @param:
* 调用实例：
**/
回到顶部按钮
$(' .top ').click(function (e) {
e.preventDefault();
'html, body' ).animate({scrollTop: 0}, 800);
});
---------------------------------------------------------------------------------
/**
* 功能说明:图片预加载
* @param:
* 调用实例：
**/
图片预加载
如果你的网页使用了很多隐藏图片文件（例如：鼠标悬停展示的图片），那么图片的预加载是有意义的：
$.preloadImages = function () {
for (var i = 0; i < arguments.length; i++) {
$('<img>').attr('src', arguments[i]);
}
};
$.preloadImages('img/hover-on.png', 'img/hover-off.png');
自动修补破损图像
如果你碰巧发现在你的网站上发现破损的图像链接，一个个去替代他们是痛苦的。这个简单的代码可以节省很多的麻烦：
$('img').on('error', function () {
if(!$(this).hasClass('broken-image')) {
$(this).prop('src', 'img/broken.png').addClass('broken-image');
}
});
即使你没有任何断开的链接，加入这代码也不会有任何影响。
禁用输入
$('input[type="submit"]').prop('disabled', true); // 你需要做的只是需要在输入框上再次运行prop方法，但设置的被禁用值是false：
对地不了解prop函数的jQuery开发者来说，最常使用的是attr函数，但是，在开发例如 checkbox、radio、select时，会发现使用attr无法让属性生效，在遇到要获取或设置checked,selected,readonly和disabled等属性时，用prop方法显然更好
根据文本获取元素
通过jQuery中的contains()选择器，你能找到一个元素内的文本内容。如果文本不存在，则这个元素将被隐藏：
var search = $('#search').val();
$('div:not(:contains("' + search + '"))').hide();
可见变化的触发
当用户不再聚焦或者重新聚焦一个标签时触发javascript脚本：
$(document).on
(
'visibilitychange'
,
function
(
e
) {
if (e.target.visibilityState === "visible") {
console.log('Tab is now in view!');
} else if (e.target.visibilityState === "hidden") {
console.log('Tab is now hidden!');
}
});
浅析Prototype的模板类--Template
var str = '#{what.name} may have gone, but there is a time of #{how}';var object = {
what : {
name : 'Swallows'
},
how : 'return'
}
var template_1 = new Template(str);
var result = template_1.evaluate(object);
console.log('result:',result);
//输出：'Swallows may have gone, but there is a time of return'
---------------------------------------------------------------------------------
/**
* 功能说明:isFunction()兼容IE等各浏览器
* @param:
* 调用实例：
**
function IsFunction(fn){
if(!fn)return false;
var s="toString", v="valueOf",
t=typeof fn[s]==="function" && fn[s],
o=typeof fn[v]==="function" && fn[v],
r;
if(t) delete fn[s];
if(o) delete fn[v];
r=typeof fn !=="string" && !(fn instanceof String)&& !fn.nodeName && fn.constructor !=Array && /^[\s[]?function/.test(fn+"");
if(t) fn[s]=t;
if(o) fn[v]=o;
return r;
}---------------------------------------------------------------------------------
/**
* 功能说明:倒计时跳转
* @param:
* 调用实例：
**/
<span id="tiao">10</span>秒后系统会自动跳转到佰腾网首页
function countDown(secs) {
if (--secs > 0) {
$("#tiao").text(secs);
setTimeout("countDown(" + secs + ")", 1000);
}
else {
location.href = "http://www.baiten.cn/";
}
}
---------------------------------------------------------------------------------
/**
* 功能说明:统计字符串个数
* @param:
* 调用实例：
**/
"abcdedftdaaafddddfer".split('').reduce((left, right) => { console.log(left,right);left[right] ? left[right]++ : left[right]=1 ; return left}, {})
