目录列表：
1.RandomNum 随机数
2.in_array判断
3.shuffle 数组乱序
4.is_function 是否函数
5.base64_encode 类php base64_encode函数
6.base64_decode 类php base64_decode函数
7.getImageFilesize 获取图片filesize
8.prDates 打印两日期间日期
9.getBetweenDates 获取两日期间所有日期，组成数组返回
10.getClass 获取HTML中的class
11.getScript 动态加载js文件
12.match_all
扩展js的match函数，得到相当g模式下返回子模式的效果
13.htmlToText 和 textToHtml
HTML与Text数据转换
14.str_pad
自动填充函数15.jQuery幻灯片插件16.图片淡入淡出效果幻灯片17.eval解析18.js数组长度count函数19.js IP格式判断20.强制数字类型转换21.浏览器收藏为书签22.js对象合并23.ucFirst 首字符大写24.下拉框添加删除25.jQuery字体闪动效果26.js字体闪动效果（同25）27.css格式化
1.RandomNum 随机数
function RandomNum(under, over){
switch(arguments.length){
case 1: return parseInt(Math.random()*under+1);
case 2: return parseInt(Math.random()*(over-under+1) + under);
default: return 0;
2.in_array判断
Array.prototype.S=String.fromCharCode(2);
Array.prototype.in_array=function(e) {
var r=new RegExp(this.S+e+this.S);
return (r.test(this.S+this.join(this.S)+this.S));
3.shuffle 数组乱序
Array.prototype.shuffle = function(){
for(var j, x, l = i = this. j = parseInt(Math.random() * l), x = this[--i], this[i] = this[j], this[j] = x);
return this;
&4.is_function 是否函数
function is_function(fn) {
return !!fn && typeof fn != "string" && !fn.nodeName &&fn.constructor != Array && /^[\s[]?function/.test(fn + "");
5.base64_encode 类php base64_encode函数
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz+/=";
//使用函数，这个变量是必须的。function base64_encode(input) {
var output = "";
var chr1, chr2, chr3 = "";
var enc1, enc2, enc3, enc4 = "";
var i = 0;
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 && 2;
enc2 = ((chr1 & 3) && 4) | (chr2 && 4);
enc3 = ((chr2 & 15) && 2) | (chr3 && 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
output = output + keyStr.charAt(enc1) + keyStr.charAt(enc2) + keyStr.charAt(enc3) + keyStr.charAt(enc4);
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while ( i & input . length );
普通压缩版base64_encode:
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz+/="; //使用函数，这个变量是必须的。function base64_encode(input){var output="";var chr1,chr2,chr3="";var enc1,enc2,enc3,enc4="";var i=0;do{chr1=input.charCodeAt(i++);chr2=input.charCodeAt(i++);chr3=input.charCodeAt(i++);enc1=chr1&&2;enc2=((chr1&3)&&4)|(chr2&&4);enc3=((chr2&15)&&2)|(chr3&&6);enc4=chr3&63;if(isNaN(chr2)){enc3=enc4=64}else if(isNaN(chr3)){enc4=64}output=output+keyStr.charAt(enc1)+keyStr.charAt(enc2)+keyStr.charAt(enc3)+keyStr.charAt(enc4);chr1=chr2=chr3="";enc1=enc2=enc3=enc4=""}while(i&input.length);return output}
6.base64_decode 类php base64_decode函数
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz+/=";
//使用函数，这个变量是必须的。function base64_decode(input) {
var output = "";
var chr1, chr2, chr3 = "";
var enc1, enc2, enc3, enc4 = "";
var i = 0;
if (input.length % 4 != 0) {
return "";
var base64test = /[^A-Za-z0-9\+\/\=]/g;
if (base64test.exec(input)) {
return "";
enc1 = keyStr.indexOf(input.charAt(i++));
enc2 = keyStr.indexOf(input.charAt(i++));
enc3 = keyStr.indexOf(input.charAt(i++));
enc4 = keyStr.indexOf(input.charAt(i++));
chr1 = (enc1 && 2) | (enc2 && 4);
chr2 = ((enc2 & 15) && 4) | (enc3 && 2);
chr3 = ((enc3 & 3) && 6) | enc4;
output = output + String.fromCharCode(chr1);
if (enc3 != 64) {
output += String.fromCharCode(chr2);
if (enc4 != 64) {
output += String.fromCharCode(chr3);
chr1 = chr2 = chr3 = "";
enc1 = enc2 = enc3 = enc4 = "";
} while ( i & input . length );
普通压缩版base64_decode：
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz+/=";
//使用函数，这个变量是必须的。function base64_decode(input){var output="";var chr1,chr2,chr3="";var enc1,enc2,enc3,enc4="";var i=0;if(input.length%4!=0){return""}var base64test=/[^A-Za-z0-9\+\/\=]/g;if(base64test.exec(input)){return""}do{enc1=keyStr.indexOf(input.charAt(i++));enc2=keyStr.indexOf(input.charAt(i++));enc3=keyStr.indexOf(input.charAt(i++));enc4=keyStr.indexOf(input.charAt(i++));chr1=(enc1&&2)|(enc2&&4);chr2=((enc2&15)&&4)|(enc3&&2);chr3=((enc3&3)&&6)|enc4;output=output+String.fromCharCode(chr1);if(enc3!=64){output+=String.fromCharCode(chr2)}if(enc4!=64){output+=String.fromCharCode(chr3)}chr1=chr2=chr3="";enc1=enc2=enc3=enc4=""}while(i&input.length);return output}
7.getImageFilesize 获取图片filesize
function getImageFilesize(o) {
x = window.XMLHttpRequest ? new window.XMLHttpRequest: new ActiveXObject("MSxml2.XMLHTTP");
x.open("HEAD", o.src, false);
alert("大小：" + x.getResponseHeader("Content-Length"));
8.prDates 打印两日期间日期
* 打印两日期间日期
YYYY-MM-DD
YYYY-MM-DD
* with_start_end 是否包含起止日期，默认包含
function prDates(start,end,with_start_end=true){
var getDate=function(str){
var tempDate=new Date();
var list=str.split("-");
tempDate.setFullYear(list[0]);
tempDate.setMonth(list[1]-1);
tempDate.setDate(list[2]);
return tempD
var start=getDate(start);
var end=getDate(end);
if(start&end){
var tempDate=
if(with_start_end) document.write("&div&"+start.getFullYear()+"-"+(start.getMonth()+1)+"-"+start.getDate()+"&/div&");
start.setDate(start.getDate()+1);
while(!(start.getFullYear()==end.getFullYear()&&start.getMonth()==end.getMonth()&&start.getDate()==end.getDate())){
document.write("&div&"+start.getFullYear()+"-"+(start.getMonth()+1)+"-"+start.getDate()+"&/div&");
start.setDate(start.getDate()+1);
if(with_start_end) document.write("&div&"+start.getFullYear()+"-"+(start.getMonth()+1)+"-"+start.getDate()+"&/div&");
&9.getBetweenDates 获取两日期间所有日期，组成数组返回
* 获取两日期间日期
YYYY-MM-DD
YYYY-MM-DD
* with_start_end
是否包含起止日期，默认包含，值为S表示仅包含起始日期，值为E表示仅包含结束日期
* format_month
是否格式化月份1-9成01-09，默认格式化
* format_date
是否格式化日期1-9成01-09，默认格式化
10 var getBetweenDates = function(start,end,with_start_end=true,format_month=true,format_date=true){
var getDate=function(str){
var tempDate=new Date();
var list=str.split("-");
tempDate.setFullYear(list[0]);
tempDate.setMonth(list[1]-1);
tempDate.setDate(list[2]);
return tempD
Date.prototype.getFormatDate = function(flag){
return (flag&&this.getDate()&10)?'0'+this.getDate():this.getDate();
Date.prototype.getFormatMonth = function(flag){
return (flag&&this.getMonth()&10)?'0'+this.getMonth():this.getMonth();
var dates = new Array();
var start=getDate(start);
var end=getDate(end);
if(start&end){
var tempDate=
if(with_start_end && with_start_end != 'E') dates.push(start.getFullYear()+"-"+(start.getFormatMonth()+1)+"-"+start.getFormatDate(format_date));
start.setDate(start.getDate()+1);
while(!(start.getFullYear()==end.getFullYear()&&start.getMonth()==end.getMonth()&&start.getDate()==end.getDate())){
dates.push(start.getFullYear()+"-"+(start.getFormatMonth()+1)+"-"+start.getFormatDate(format_date));
start.setDate(start.getDate()+1);
if(with_start_end && with_start_end != 'S') dates.push(start.getFullYear()+"-"+(start.getFormatMonth()+1)+"-"+start.getFormatDate(format_date));
10.getClass 获取HTML中的class
* className 类名
* tagname HTML标签名，如div,td,ul等
* @return Array 所有class对应标签对象组成的数组
* @example
&div class="abc"&abc&/div&
var abc = getClass('abc');
for(i=0;i&abc.i++){
abc[i].style.backgroundColor='red';
12 function getClass(className,tagname/*='*'*/) {
//IE下不能用默认参数
if(typeof tagname == 'undefined') tagname = '*'; //modified
if (typeof(getElementsByClassName) == 'function') {
return getElementsByClassName(className);
var tagname = document.getElementsByTagName(tagname);
var tagnameAll = [];
for (var i = 0; i & tagname. i++) {
//if (tagname[i].className == className) {　　　　　　　　 if(tagname[i].className.indexOf(className) != -1) {
tagnameAll[tagnameAll.length] = tagname[i];
return tagnameA
&11.getScript 动态加载js文件
(function(){
var args =
var i = 1;
function getScript(url, fn){
var a=document.createElement("script");
a.async = !!arguments[0];
a.src = args[i];
a.onload = a.onreadystatechange = function(c,b){
if (b || !a.readyState || /loaded|complete/.test(a.readyState)){
a.onload = a.onreadystatechange = null;
if (fn instanceof Function){
if (args[++i]){
getScript(args[i], fn);
(document.getElementById("zljsc")||document.body).appendChild(a);
getScript(args[i]);
})(true, "/Zjmainstay/ZjmainstayRunHTML.js", "/Zjmainstay/swfobject.js", "/Zjmainstay/Zjmainstay_cnblogs_global.js"); //可以追加多个
12.match_all& 扩展js的match函数，得到相当g模式下返回子模式的效果
* javascript 匹配所有的匹配值，并返回每个匹配携带其子匹配组成的数组。
* 返回数组结构：[["{\"a\":99}", "99"], ["{\"a\":86}", "86"], ["{\"a\":124}", "124"]]
* @example
var str = '[{"a":99},{"a":86},{"a":124}]';
var pattern = /{"a":(\d+)}/
var ma = str.match_all(pattern);
alert(ma.toSource());
12 String.prototype.match_all = function(pattern,replace/*=''*/){　　　　replace = replace || '';
//修正ie下不能使用默认参数问题，习惯了，又摔一跤~~
var matches = [];
pattern = pattern.toString().replace(/(\/.*\/)([a-zA-Z]*)g([a-zA-Z]*)/,'$1$2$3');
pattern = eval(pattern);
var match = this.match(pattern);
var string = this;
while(!!match){
matches.push(match);
string = string.replace(pattern,replace);
match = string.match(pattern);
13.htmlToText 和 textToHtml& HTML与Text数据转换
1 function htmlToText(html) {
return html.replace(/\&br(?: \/)?\&/g, '\n').replace(/&/g, '&').replace(/&/g, '&').replace(/&/g, '&');
5 function textToHtml(text) {
return text.replace(/&/g, '&').replace(/\&/g, '&').replace(/\&/g, '&').replace(/\n/g, '&br&');
14.str_pad& 自动填充函数
*@param str
初始字符串
*@param length
*@param pad
*@param type
*@return str
8 function str_pad(str,length=5,pad=' ',type='left'){
if(isNaN(length)) length = 5;
length = Math.max(0,(length - str.length));
if(type == 'left'){
for(i=0;i&i++){
str = pad +
for(i=0;i&i++){
&15.jQuery幻灯片插件
jQuery Plugin
From /jquery/images/cj//694.html
Modify By Zjmainstay, Blog:/Zjmainstay
@example $.mySlideShow('myItemid');
//最简形式，默认开启自动切换，轮换时间为2秒（2000毫秒）
@example $.mySlideShow('myItemid',{autoStart:false});
//关闭自动切换
@example $.mySlideShow('myItemid',{switchingTime:3000});
//设置轮换时间
9 (function($){
10 var mySlideShow = function(id,options){
//显示图片函数，根据接收的index值显示相应的内容
var showPics = function(index) { //普通切换
var nowLeft = -index*sW //根据index值计算ul元素的left值
$("#"+id+" ul").stop(true,false).animate({"left":nowLeft},300); //通过animate()调整ul元素滚动到计算出的position
$("#"+id+" .btn span").stop(true,false).animate({"opacity":"0.4"},300).eq(index).stop(true,false).animate({"opacity":"1"},300); //为当前的按钮切换到选中的效果
var sWidth = $("#"+id).width(); //获取焦点图的宽度（显示面积）
var len = $("#"+id+" ul li"). //获取焦点图个数
var index = 0;
options = options || {}
options.autoStart
= (options.autoStart==false) ? false : true;
//默认自动播放
options.switchingTime = !isNaN(options.switchingTime) ? options.switchingTime : 2000;
//自动切换时间，默认2000毫秒
//以下代码添加数字按钮和按钮后的半透明条，还有上一页、下一页两个按钮
var btn = "&div class='btnBg'&&/div&&div class='btn'&";
for(var i=0; i & i++) {
btn += "&span&&/span&";
btn += "&/div&&div class='preNext pre'&&/div&&div class='preNext next'&&/div&";
$("#"+id).append(btn);
$("#"+id+" .btnBg").css("opacity",0.5);
//为小按钮添加鼠标滑入事件，以显示相应的内容
$("#"+id+" .btn span").css("opacity",0.4).mouseover(function() {
index = $("#"+id+" .btn span").index(this);
showPics(index);
}).eq(0).trigger("mouseover");
//上一页、下一页按钮透明度处理
$("#"+id+" .preNext").css("opacity",0.2).hover(function() {
$(this).stop(true,false).animate({"opacity":"0.5"},300);
},function() {
$(this).stop(true,false).animate({"opacity":"0.2"},300);
//上一页按钮
$("#"+id+" .pre").click(function() {
index -= 1;
if(index == -1) {index = len - 1;}
showPics(index);
//下一页按钮
$("#"+id+" .next").click(function() {
index += 1;
if(index == len) {index = 0;}
showPics(index);
//本例为左右滚动，即所有li元素都是在同一排向左浮动，所以这里需要计算出外围ul元素的宽度
$("#"+id+" ul").css("width",sWidth * (len));
//鼠标滑上焦点图时停止自动播放，滑出时开始自动播放
//启用自动轮换
if(options.autoStart){
$("#"+id).hover(function() {
clearInterval(picTimer);
},function() {
picTimer = setInterval(function() {
showPics(index);
if(index == len) {index = 0;}
},options.switchingTime);
}).trigger("mouseleave");
78 //扩展成jQuery插件
79 $.extend({mySlideShow:mySlideShow});
80 })(jQuery);
jQuery幻灯片插件演示：(运行此段代码（18））
1 &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
2 &html xmlns="http://www.w3.org/1999/xhtml"&
4 &meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
5 &title&jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动&/title&
6 &meta name="description" content="jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果，带索引按钮控制和左右按钮控制图片切换。jquery下载。" /&
7 &style type="text/css"&
8 *{margin:0;padding:0;}
9 body{font-size:12px;color:#222;font-family:Verdana,Arial,Helvetica,sans-serif;background:#f0f0f0;}
10 .clearfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}
11 .clearfix{zoom:1;}
12 ul,li{list-style:none;}
13 img{border:0;}
14 .wrapper{width:<span style="background-color: #f5f5f5; color: #px;margin:0 auto;padding-bottom:50px;}
15 h1{height:50px;line-height:50px;font-size:22px;font-weight:normal;font-family:"Microsoft YaHei",SimHei;margin-bottom:20px;}
16 /* focus */
17 #focus{width:<span style="background-color: #f5f5f5; color: #px;height:<span style="background-color: #f5f5f5; color: #px;overflow:hidden;position:relative;}
18 #focus ul{height:<span style="background-color: #f5f5f5; color: #px;position:absolute;}
19 #focus ul li{float:left;width:<span style="background-color: #f5f5f5; color: #px;height:<span style="background-color: #f5f5f5; color: #px;overflow:hidden;position:relative;background:#000;}
20 #focus ul li div{position:absolute;overflow:hidden;}
21 #focus .btnBg{position:absolute;width:<span style="background-color: #f5f5f5; color: #px;height:20px;left:0;bottom:0;background:#000;}
22 #focus .btn{position:absolute;width:<span style="background-color: #f5f5f5; color: #px;height:10px;padding:5px 10px;right:0;bottom:0;text-align:right;}
23 #focus .btn span{display:inline-block;_display:inline;_zoom:1;width:25px;height:10px;_font-size:0;margin-left:5px;cursor:pointer;background:#fff;}
24 #focus .btn span.on{background:#fff;}
25 #focus .preNext{width:45px;height:<span style="background-color: #f5f5f5; color: #px;position:absolute;top:90px;background:url(/jquery/demo//img/sprite.png) no-repeat 0 0;cursor:pointer;}
26 #focus .pre{left:0;}
27 #focus .next{right:0;background-position:right top;}
28 &/style&
30 &script type="text/javascript" src="/Zjmainstay/jquery-1.6.2.min.js"&&/script&
31 &script type="text/javascript" src="/Zjmainstay/jquery.myslideshow.js"&&/script&
32 &script type="text/javascript"&
33 (function($){
$(document).ready(function(){
$.mySlideShow('focus');
37 })(jQuery);
38 &/script&
39 &/head&
&div class="wrapper"&
&h1&jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动&/h1&
&div id="focus"&
&li&&a href="/" target="_blank"&&img src="/jquery/demo//img/01.jpg" alt="QQ商城焦点图效果下载" /&&/a&&/li&
&li&&a href="/" target="_blank"&&img src="/jquery/demo//img/02.jpg" alt="QQ商城焦点图效果教程" /&&/a&&/li&
&li&&a href="/" target="_blank"&&img src="/jquery/demo//img/03.jpg" alt="jquery商城焦点图效果" /&&/a&&/li&
&li&&a href="/" target="_blank"&&img src="/jquery/demo//img/04.jpg" alt="jquery商城焦点图代码" /&&/a&&/li&
&li&&a href="/" target="_blank"&&img src="/jquery/demo//img/05.jpg" alt="jquery商城焦点图源码" /&&/a&&/li&
&/div&&!--focus end--&
&/div&&!-- wrapper end --&
58 &/body&
59 &!-- Copyright /jquery/images/cj//694.html --&
60 &!-- Modify by Zjmainstay --&
61 &/html&
16、图片淡入淡出效果幻灯片
1 window.onload = function ()
var oBox = document.getElementById("box");
var aUl = document.getElementsByTagName("ul");
var aImg = aUl[0].getElementsByTagName("li");
var aNum = aUl[1].getElementsByTagName("li");
var timer = play = null;
var i = index = 0;
var bOrder = true;
//切换按钮
for (i = 0; i & aNum. i++)
aNum[i].index =
aNum[i].onclick = function ()
show(this.index)
//鼠标划过关闭定时器
oBox.onmouseover = function ()
clearInterval(play)
//鼠标离开启动自动播放
oBox.onmouseout = function ()
//autoPlay()
//自动播放函数
function autoPlay ()
play = setInterval(function () {
//判断播放顺序
bOrder ? index++ : index--;
index &= aImg.length && (index = aImg.length - 2, bOrder = false);
index &= 0 && (index = 0, bOrder = true);
//调用函数
show(index)
//autoPlay();//应用
//图片切换, 淡入淡出效果
function show (a)
var alpha = 0;
for (i = 0; i & aNum. i++)aNum[i].className = "";
aNum[index].className = "current";
clearInterval(timer);
for (i = 0; i & aImg. i++)
aImg[i].style.opacity = 0;
aImg[i].style.filter = "alpha(opacity=0)";
timer = setInterval(function () {
alpha += 5;
alpha & 100 && (alpha =100);
aImg[index].style.opacity = alpha / 100;
aImg[index].style.filter = "alpha(opacity = " + alpha + ")";
alpha == 100 && clearInterval(timer)
&17、eval解析
1 function parseEval(str){
str = str.replace(/^eval/,'');
return eval(str);
&18、js数组长度count函数
* Javascript 数组长度统计
* Javascript 关联数组length为0
var arr = [];
arr["a"] = 1;
arr["b"] = [1,2,3];
alert(arr.length+','+arr.count(true)+','+arr.count());
10 Array.prototype.count = function(mode){
//form http://phpjs.org/functions/count/
function count (mixed_var, mode) {
// http://kevin.vanzonneveld.net
original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
input by: Waldo Malqui Silva
bugfixed by: Soren Hansen
input by: merabi
improved by: Brett Zamir (http://brett-zamir.me)
bugfixed by: Olivier Louvignes (/)
example 1: count([[0,0],[0,-4]], 'COUNT_RECURSIVE');
returns 1: 6
example 2: count({'one' : [1,2,3,4,5]}, 'COUNT_RECURSIVE');
returns 2: 6
var key, cnt = 0;
if (mixed_var === null || typeof mixed_var === 'undefined') {
} else if (mixed_var.constructor !== Array && mixed_var.constructor !== Object) {
if (mode === 'COUNT_RECURSIVE') {
if (mode != 1) {
for (key in mixed_var) {
if (mixed_var.hasOwnProperty(key)) {
if (mode == 1 && mixed_var[key] && (mixed_var[key].constructor === Array || mixed_var[key].constructor === Object)) {
cnt += count(mixed_var[key], 1);
//这里改this.count为count，否则会导致嵌套数组未定义错误
return count(this,mode);
&19、js IP格式判断
* (?!^0(\.0){3}$)
//排除0.0.0.0
* (?!^255(\.255){3}$)
//排除255.255.255.255
* ((25[0-5])|(2[0-4]\d)|(1\d{2})|(\d{2})|(\d))
//250-255 或 200-249 或 100-199 或 00-99 或 0-9
* 排序从左到右，不可逆。
7 function validateIP(str){
return !!str.match(/^(?!^0(\.0){3}$)(?!^255(\.255){3}$)((25[0-5])|(2[0-4]\d)|(1\d{2})|(\d{2})|(\d))(\.((25[0-5])|(2[0-4]\d)|(1\d{2})|(\d{2})|(\d))){3}$/);
9 }//改进：首先多谢 @枕头老爸 在闪存里的评论，激发了我简写的冲动，嘻...function validateIP(str){&& && return !!str.match(/^(((25[0-5])|(2[0-4]\d)|(1\d{2})|(\d{2})|(\d))($|(?!\.$)\.)){4}$/);}//红色标明部分表示（结束($) 或(|) 不是以点结束((?!\.$))的加上点(\.)）
&20、强制数字类型转换
1 function getNum(num){
if(typeof(num) == 'undefined' || !num || !num.toString().trim().match(/^\d+(\.\d+)?$/)) return 0;
return parseFloat(num);
&21、浏览器收藏为书签
1 function createBookmark(sURL,sTitle) {
if (document.all && window.external) {
window.external.AddFavorite (sURL,sTitle);
else if (window.sidebar) {
window.sidebar.addPanel(sTitle,sURL,'');
+'抱歉，您的浏览器不能自动加入收藏，'
+'请用快捷键 Ctrl+D 加入收藏.'
&22、js对象合并
* js对象合并方法
* @example
var obj = {};
obj['a'] = 1;
obj['b'] = 1;
obj['c'] = 1;
var obj2 = {"a":2,"e":1};
var obj3 = {"f":2,"g":1};
var arr = {};
arr = obj.join(obj2).join(obj3);
console.log(obj);
//这里表明obj没被改动
console.log(arr);
16 Object.prototype.join = function(obj,override){
function Temp(){}
Temp.prototype = this;
var self = new Temp();
//js对象赋值是引用赋值，直接使用var self =那么后面的self改动将反馈到原obj
if(typeof(obj) == 'object'){
if(typeof(override) == 'undefined') override = true;
//默认覆盖
for(var o in obj){
if(!override && !!self[o]) continue;
self[o] = obj[o];
&23、ucFirst 首字符大写
1 function ucFirst(str){
if(!!str) return str[0].toUpperCase() + str.substr(1);
else return
&24、下拉框添加删除
3 &title&网页特效|111cn.net/左右选择添加删除内容菜单&/title&
4 &meta http-equiv="Content-Type" content="text/ charset=gb2312"&
7 &p&选定一项或多项然后点击添加或移除(按住shift或ctrl可以多选)，或在选择项上双击进行添加和移除。&/p&
8 &form method="post" name="myform"&
&table border="0" width="300"&
&td width="40%"&
&select style="width:100%;" multiple name="list1" size="12" ondblclick="moveOption(document.myform.list1, document.myform.list2)"&
&option value="北京"&北京&/option&
&option value="上海"&上海&/option&
&option value="山东"&山东&/option&
&option value="安徽"&安徽&/option&
&option value="重庆"&重庆&/option&
&option value="福建"&福建&/option&
&option value="甘肃"&甘肃&/option&
&option value="广东"&广东&/option&
&option value="广西"&广西&/option&
&option value="贵州"&贵州&/option&
&option value="海南"&海南&/option&
&option value="河北"&河北&/option&
&option value="黑龙江"&黑龙江&/option&
&option value="河南"&河南&/option&
&option value="湖北"&湖北&/option&
&option value="湖南"&湖南&/option&
&option value="内蒙古"&内蒙古&/option&
&option value="江苏"&江苏&/option&
&option value="江西"&江西&/option&
&option value="吉林"&吉林&/option&
&option value="辽宁"&辽宁&/option&
&option value="宁夏"&宁夏&/option&
&option value="青海"&青海&/option&
&option value="山西"&山西&/option&
&option value="陕西"&陕西&/option&
&option value="四川"&四川&/option&
&option value="天津"&天津&/option&
&option value="西藏"&西藏&/option&
&option value="新疆"&新疆&/option&
&option value="云南"&云南&/option&
&option value="浙江"&浙江&/option&
&option value="香港"&香港&/option&
&option value="澳门"&澳门&/option&
&option value="台湾"&台湾&/option&
&option value="其他"&其他&/option&
&td width="20%" align="center"&
&input type="button" value="添加" onclick="moveOption(document.myform.list1, document.myform.list2)"&&br&&br&
&input type="button" value="删除" onclick="moveOption(document.myform.list2, document.myform.list1)"&
&td width="40%"&
&select style="width:100%;" multiple name="list2" size="12" ondblclick="moveOption(document.myform.list2, document.myform.list1)"&
60 值：&input type="text" name="city" size="40" value="" /&
61 &/form&
62 &script type="text/javascript"&
64 function moveOption(e1, e2){
for(var i=0;i&e1.options.i++){
if(e1.options[i].selected){
var e = e1.options[i];
e2.options.add(new Option(e.text, e.value));
e1.remove(i);
document.myform.city.value=getvalue(document.myform.list2);
catch(e){}
78 function getvalue(geto){
var allvalue = "";
for(var i=0;i&geto.options.i++){
allvalue +=geto.options[i].value + ",";
86 &/script&
87 &/body&
88 &/html&
&25、jQuery字体闪动效果
&title&字体闪烁&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&meta http-equiv="Content-Language" content="zh-CN" /&
&script type="text/javascript" src="/Zjmainstay/jquery-1.6.2.min.js"&&/script&
&!--&script type="text/javascript" src="/Zjmainstay/jquery-shake.js"&&/script&--&
10 &style&.red{border:1px solid #d00; background:#ffe9e8; color:#d00;}&/style&
11 &div id="shakeDiv"&点击闪烁3下...&/div&
12 &script type="text/javascript"&
* jQuery 插件
* HTML标签闪动特效
jQuery对象
变换的class
* @example
&style&.red{border:1px solid #d00; background:#ffe9e8; color:#d00;}&/style&
&div id="shakeDiv"&闪烁10下...&/div&
$.shake($("#shakeDiv"),"red",10);
24 $.extend({"shake":function(ele, cls, times) {
var i = 0,
t = false,
o = ele.attr("class") + " ",
times = times || 2;
if (t) return;
t = setInterval(function() {
c = i % 2 ? o + cls:
ele.attr("class", c);
if (i == 2 * times) {
clearInterval(t);
ele.removeClass(cls);
42 $("#shakeDiv").click(function(){
$.shake($(this),'red',3);
45 &/script&
46 &/body&
47 &/html&
26、js字体闪动效果
&title&js字体闪动效果&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&meta http-equiv="Content-Language" content="zh-CN" /&
&script type="text/javascript" src="/Zjmainstay/jquery-1.6.2.min.js"&&/script&
9 &style&.red{border:1px solid #d00; background:#ffe9e8; color:#d00;}&/style&
10 &input type="button" value="Shake Me" id="shakeme" onclick="shake(this,'red',3)"/&
11 &script type="text/javascript"&
* js 字体闪动效果函数
标签id或dom对象
闪动变换的class
* @example
18 //通过id调用方式
19 shake('shakeme','red',3);
20 //通过dom对象调用方式
21 shake(document.getElementById('shakeme'),'red',3);
22 //直接使用this代替
23 &input type="button" value="Shake Me" id="shakeme" onclick="shake(this,'red',3)"/&
25 function shake(id,cls,times){
var i = 0,
t = false,
ele = (typeof id == 'object') ? id : document.getElementById(id),
o = ele.className,
times = times || 2;
t = setInterval(function() {
c = i % 2 ? (o+" "+cls) :
ele.className =
if (i == 2 * times) {
clearInterval(t);
ele.className =
43 &/script&
44 &/body&
45 &/html&
&27、css格式化
1 &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
2 &html xmlns="http://www.w3.org/1999/xhtml"&
&title&CSS格式化&/title&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&meta http-equiv="Content-Language" content="zh-CN" /&
10 .bd_border{width:<span style="background-color: #f5f5f5; color: #px;border: 1px solid #ACCEE0;margin: 0;padding: 3px;text-align: left;}
11 &/style&
12 &div class="bd_border"&
&table width="100%" border="0" cellspacing="3" cellpadding="0"&
&tbody&&tr&
&td&提供的CSS代码格式化和css在线压缩工具，不需要使用YUI Compressor 或者 CSSTidy等离线工具，直接在线操作。&/td&
/*请将CSS代码复制到下面*/
&a alt="from" href="http://www.jb51.net/tools/cssyasuo.shtml"&
&font color="#0000ff"&CSS代码格式化&/font&
&td&&textarea style="WIDTH: 100%; HEIGHT: 300px" title="www.jb51.net" id="code"&&/textarea&&/td&
&input type="button" value="格式化" onclick="$('code').value = CSSdecode($('code').value);"& |
&input type="button" value="压缩化" onclick="$('code').value = CSSencode($('code').value);"& |
&input type="button" value="复制" onclick="window.clipboardData.setData('Text',$('code').value);"& |
&input type="button" value="粘贴" onclick="$('code').value = window.clipboardData.getData('Text');"& |
&input type="button" value="清空" onclick="$('code').value = ''"&
&/tbody&&/table&
39 &script type="text/javascript"&
41 function $() {
42 var elements = new Array();
43 for (var i = 0; i & arguments. i++) {
44 var element = arguments[i];
45 if (typeof element == 'string')
46 element = document.getElementById(element);
47 if (arguments.length == 1)
49 elements.push(element);
53 function CSSencode(code)
55 code = code.replace(/\n/ig,'');
56 code = code.replace(/(\s){2,}/ig,'$1');
57 code = code.replace(/\t/ig,'');
58 code = code.replace(/\n\}/ig,'\}');
59 code = code.replace(/\n\{\s*/ig,'\{');
60 code = code.replace(/(\S)\s*\}/ig,'$1\}');
61 code = code.replace(/(\S)\s*\{/ig,'$1\{');
62 code = code.replace(/\{\s*(\S)/ig,'\{$1');
65 function CSSdecode(code)
67 code = code.replace(/(\s){2,}/ig,'$1');
68 code = code.replace(/(\S)\s*\{/ig,'$1 {');
69 code = code.replace(/\*\/(.[^\}\{]*)}/ig,'\*\/\n$1}');
70 code = code.replace(/\/\*/ig,'\n\/\*');
71 code = code.replace(/;\s*(\S)/ig,';\n\t$1');
72 code = code.replace(/\}\s*(\S)/ig,'\}\n$1');
73 code = code.replace(/\n\s*\}/ig,'\n\}');
74 code = code.replace(/\{\s*(\S)/ig,'\{\n\t$1');
75 code = code.replace(/(\S)\s*\*\//ig,'$1\*\/');
76 code = code.replace(/\*\/\s*([^\}\{]\S)/ig,'\*\/\n$1');
//modified '\*\/\n\t$1'=&'\*\/\n$1'
77 code = code.replace(/(\S)\}/ig,'$1\n\}');
78 code = code.replace(/(\n){2,}/ig,'\n');
79 code = code.replace(/:/ig,': ');
80 code = code.replace(/ /ig,' ');
81 code = code.replace(/^\n*/ig,'');
85 &/script&
86 &/body&
87 &/html&
&代码压缩工具：
PS:欢迎评论，我一定会追加您贡献的方法哦。
阅读(...) 评论()