js 代码集(学习js的朋友可以看下)


Posted in Javascript onJuly 22, 2009

/**
* @author Super Sha
* QQ:770104121
* E-Mail:supei_shafeng@163.com
* publish date: 2009-3-27
* All Rights Reserved
*/

var JsHelper={}; //声明一个JsHelper根命名空间
JsHelper.DOM = {}; //声明JsHelper目录下的DOM命名空间
JsHelper.Event={}; //声明JsHelper目录下的Event事件命名空间
JsHelper.Browser={}; //声明JsHelper目录下的跟浏览器相关的函数Browser命名空间
JsHelper.Ajax={}; //声明Jshelper目录下的跟Ajax相关的函数命名空间
JsHelper.String={}; //声明JsHelper目录下的跟String相关的命名空间

/*
* $() 可以输入多个参数,将返回一个获取对象的数组
*/
var $=function(){ //简化版的$方法
var elements=new Array();
if(arguments.length==0){ //如果参数为空,则返回document元素
return document;
}
for (var i = 0; i < arguments.length; i++)
{
var element = arguments[i];
if (typeof element == string )
{
element = document.getElementById(element);
}
if (arguments.length == 1)
{
return element;
}
elements.push(element);
}
return elements;
}
JsHelper.DOM.$=function()
{
var elements=new Array();
for (var i = 0; i < arguments.length; i++)
{
var element = arguments[i];
if (typeof element == string )
{
element = document.getElementById(element);
}
if (arguments.length == 1)
{
return element;
}
elements.push(element);
}
return elements;
}
/*
* $Value() 可以输入多个参数,将返回一个获取对象的Value数组
*/
JsHelper.DOM.value=function()
{
var values=new Array();
for (var i = 0; i < arguments.length; i++)
{
var element = arguments[i];
if (typeof(element) == string )
{
var v=document.getElementById(element).value;
}
if(arguments.length==1)
{
return v;
}
values.push(v);
}
return values;
}
/*
makeArray对输入的参数生成数组返回,如果参数为空,则返回 "undefined",否则返回数组
*/
JsHelper.String.makeArray=function()
{
var values=new Array();
if(arguments.length>0){
for (var i = 0; i < arguments.length; i++)
{
var element=arguments[i];
if(typeof element == "string")
{
values.push(element);
}
}
}
else
{
return "undefined";
}
return values;
}
/*
* 声明一个StringBuilder类,处理连接字符串性能的问题
*/
JsHelper.String.StringBulider={
_strs:new Array(),
append: function(str){ //给属性_strs添加字符串
this._strs.push(str);
return this;
},
toString:function(){
if (arguments.length != 0) {
return this._strs.join(arguments[0]); //返回属性_strs结合后的字符串,接受一个可选的参数用于join的参数
}else{
return this._strs.join("");
}
}
};

/*
* $TagName()输入一个参数,将返回一个获取Elements TagNeme对象的数组
*/
JsHelper.DOM.tagName=function()
{
var element=arguments[0];
if(typeof element== string )
{
var tagname=document.getElementsByTagName(element);
}
return tagname;
}

//============================================================
/*
* label:HTML Label ID
* 只能适用与responseText
* 只能适用与GET方式
*/
var _xmlhttp;//声明全局XMLHttpRequest对象实例
function Ajax(method, url, label){
this.method = method;
this.url = url;
try {
_xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
_xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (s) {
_xmlhttp = new XMLHttpRequest();
}
}
Ajax.prototype.ResponseText = function(){
_xmlhttp.onreadystatechange = this.onComplete;
_xmlhttp.open(this.method, this.url, true)
_xmlhttp.send(null);
}
Ajax.prototype.onComplete = function(){
if (_xmlhttp.readyState == 4) {
if (_xmlhttp.status == 200) {
$(label).innerHTML = _xmlhttp.responseText;
}
}
}
this.ResponseText();
}
//================================================

/*
* 判断浏览器类型
*/
var ua = navigator.userAgent.toLowerCase();
if (window.ActiveXObject) {
JsHelper.Browser.IE = ua.match(/msie ([\d.]+)/)[1];
}
else if (document.getBoxObjectFor) {
JsHelper.Browser.Firefox = ua.match(/firefox\/([\d.]+)/)[1];
}
else if (window.MessageEvent && !document.getBoxObjectFor) {
JsHelper.Browser.Chrome = ua.match(/chrome\/([\d.]+)/)[1];
}
else if (window.opera) {
JsHelper.Browser.Opera = ua.match(/opera.([\d.]+)/)[1];
}
else if (window.openDatabase) {
JsHelper.Browser.Safari = ua.match(/version\/([\d.]+)/)[1];
}
/*
* 声明一个XMLHttpRequest对象的实例,返回实例
*/
JsHelper.Ajax.createRequest=function()
{
var xmlhttp=null;
try
{
xmlhttp=new XMLHttpRequest();
}
catch(trymicrosoft){
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(othermicrosoft){
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlhttp;
}

/*
* 一个通用的AddEventListener函数,obj为DOM元素
*/
JsHelper.Event.addEventlistener=function(labelID,eventMode,fn)
{
var obj=JsHelper.DOM.$(labelID);
if (typeof window.addEventListener != undefined ) {
obj.addEventListener(eventMode, fn, false);
}
else
if (typeof document.addEventListener != undefined ) {
obj.addEventListener(eventMode, fn, false);
}
else
if (typeof window.attachEvent != undefined ) {
obj.attachEvent("on"+eventMode, fn);
}
else {
return false;
}
return true;
}

/*
*包含了一个Douglas Crockford对函数的method的扩展,下面的三个函数版权归Douglas Crockford所有,特此声明
*/
Function.prototype.method = function (name, func) {
this.prototype[name] = func;
return this;
};
Function.method( inherits , function (parent) {
var d = {}, p = (this.prototype = new parent());
this.method( base , function uber(name) {
if (!(name in d)) {
d[name] = 0;
}
var f, r, t = d[name], v = parent.prototype;
if (t) {
while (t) {
v = v.constructor.prototype;
t -= 1;
}
f = v[name];
} else {
f = p[name];
if (f == this[name]) {
f = v[name];
}
}
d[name] += 1;
r = f.apply(this, Array.prototype.slice.apply(arguments, [1]));
d[name] -= 1;
return r;
});
return this;
});
Function.method( swiss , function (parent) {
for (var i = 1; i < arguments.length; i += 1) {
var name = arguments[i];
this.prototype[name] = parent.prototype[name];
}
return this;
});

/*
* 解决IE不支持HTMLElement的一个解决方案
*/
var DOMElement ={
extend: function(name,fn)
{
if(!document.all)
{
eval("HTMLElement.prototype." + name + " = fn");
}
else
{
var _createElement = document.createElement;
document.createElement = function(tag)
{
var _elem = _createElement(tag);
eval("_elem." + name + " = fn");
return _elem;
}
var _getElementById = document.getElementById;
document.getElementById = function(id)
{
var _elem = _getElementById(id);
eval("_elem." + name + " = fn");
return _elem;
}
var _getElementsByTagName = document.getElementsByTagName;
document.getElementsByTagName = function(tag)
{
var _arr = _getElementsByTagName(tag);
for(var _elem=0;_elem<_arr.length;_elem++)
eval("_arr[_elem]." + name + " = fn");
return _arr;
}
}
}
};
/*
* 下面仿照jQuery之父John Resig的几个查询DOM的函数,连缀的能力
*/
DOMElement.extend("previous",function(){ // similar to previousSibling DOM Function
var elem=this;
do{
elem=elem.previousSibling;
}while(elem&&elem.nodeType!=1);
return elem;
});

DOMElement.extend("next",function(){ //similar to nextSibling DOm Function
var elem=this;
do{
elem=elem.nextSibling;
}while(elem&&elem.nodeType!=1);
return elem;
});
DOMElement.extend("first",function(num){ //similar to firstChild DOM Function,同parent
var elem=this;
num=num||1;
for (var i = 0; i < num; i++) {
elem = elem.firstChild;
}
return (elem && elem.nodeType!=1 ? next(elem):elem);
});
DOMElement.extend("last",function(num){ //similar to lastChild DOM Function,同parent
var elem=this;
num=num||1;
for (var i = 0; i < num; i++) {
elem = elem.lastChild;
}
return (elem && elem.nodeType!=1 ? prev(elem):elem);
});
DOMElement.extend("parent",function(num){ //可以返回几个num等级的parentNode,比如:parent(2)就等同于elem.parent().parent();
var elem=this;
num=num ||1;
for (var i = 0; i < num; i++) {
if (elem != null) {
elem = elem.parentNode;
}
}
return elem;
});
DOMElement.extend("hasChilds",function(){ //判断时候有子节点
if(this!=null && this.hasChildNodes()){
return true;
}
else{
return false;
}
});

DOMElement.extend("text",function(){ //得到标签内的文本,如果参数不为零,则可以设置标签内的文版,对input标签也同样适合
try{ //解决Firefox不支持InnerText的解决方案
HTMLElement.prototype.__defineGetter__("innerText",function(){
var anyString = "";
var childS = this.childNodes;
for(var i=0; i<childS.length; i++){
if (childS[i].nodeType == 1) {
anyString += childS[i].tagName == "BR" ? "n : childS[i].innerText;
}
else if(childS[i].nodeType == 3) {
anyString += childS[i].nodeValue;
}
}
return anyString;
});
}
catch(e){}
if (arguments.length == 1) {
if (this.innerText) {
this.innerText = arguments[0];
}
else {
this.value = arguments[0];
}
}
else {
return this.innerText || this.value;
}
});
DOMElement.extend("html",function(){ //得到元素的innerHTML,如果参数不为零,则可以设置元素内的文本和子节点
if(arguments.length==0){
return this.innerHTML;
}
else if(arguments.length==1)
{
this.innerHTML=arguments[0];
}
});

/*
* 下面是className的操作
*/
DOMElement.extend("getClassName",function(){ //返回元素className
if(this!=null&&this.nodeType==1){
return this.className.replace(/\s+/, ).split( );
}
return null;
});
DOMElement.extend("hasClassName",function(){ //判断是否有class类
if(this!=null&&this.nodeType==1){
var classes=this.getClassName();
for(var i=0;i<classes.length;i++){
if(arguments[0]==classes[i]) return true;
}
}else{
return false;
}
});

DOMElement.extend("addClass",function(){ //给元素添加类,可以一次性添加多个类
if(this!=null&&this.nodeType==1){
for (var i = 0; i < arguments.length; i++) {
this.className += (this.className ? : ) + arguments[i];
}
return this;
}
return null;
});
DOMElement.extend("removeClass",function(){ //删除类,如果没有参数,则删除全部的类
if (this != null && this.nodeType == 1) {
if (arguments.length == 0) {
this.className = "";
}
else if(arguments.length!=0) {
var classes=this.getClassName();
for (var i = 0; i < arguments.length; i++) {
for (var j = 0; j < classes.length; j++) {
if (arguments[i]==classes[j]) {
classes = classes.join(" ").replace(arguments[i], ).split(" ");
}
}
}
this.className=classes.join(" ");
}
return this;
}
return null;
});
JsHelper.__toggleflag=false; //增加一个判断开关
DOMElement.extend("toggleClass",function(classname){ //两次点击调用的函数不同
if(this!=null && this.nodeType==1){
this.onclick=function(){
if(JsHelper.__toggleflag==false){
this.addClass(classname);
JsHelper.__toggleflag = true;
}else if (JsHelper.__toggleflag == true) {
this.removeClass(classname);
JsHelper.__toggleflag = false;
}
}
}
});
/*
* 给每个对象添加click方法,类似与jQuery的click方法的使用方式
*/
DOMElement.extend("click",function(){
if(this!=null && this.nodeType==1){
if(arguments.length==0){
alert("you have done nothing when you clicked.");
}else{
this.onclick=arguments[0];
}
}
});

/*
* 给每个对象扩展hover方法,此方法接受两个函数作为参数
*/
DOMElement.extend("hover",function(){
if(this!=null && this.nodeType==1){
if(arguments.length!=2){
alert("Require two function to be param.");
}else{
this.onmouseover=arguments[0];
this.onmouseout=arguments[1];
}
}
});
/*
* 给每个元素添加事件的函数
*/
DOMElement.extend("addEvent",function(eventtype,fn){
if(document.all){
this.attachEvent("on"+eventtype,fn);
}else{
this.addEventListener(eventtype,fn,false);
}
});
/*
* 给每个元素扩展css方法,接受一个属性和属性值作为参数
*/
DOMElement.extend("css",function(){
if(this!=null && this.nodeType==1){
if(arguments.length!=2){
alert("Require two function to be param.");
}else{
this.style[arguments[0]]=arguments[1]; //设置相关的style属性的值
return this;
}
}
return null;
});
/*
* //查找并返回存在某个类的全部的元素,name为className,type为HTML标签类型
*/
var hasClass = function(name,type){
var r = new Array();
//var re = new RegExp(name,"g");
var e=document.getElementsByTagName(type||"*");
for(var i=0;i<e.length;i++){
var classes=e[i].getClassName();
for (var j = 0; j < classes.length; j++) {
if (name== classes[j]) {
r.push(e[i]);
}
}
}
return r;
}
/*
* 返回某个元素的特定的子元素引用的集合,如果没有元素调用该方法,则默认是document
*/
DOMElement.extend("find",function(){
var elem=this||document;
var r=new Array();
if(elem!=null && (elem.nodeType==1||elem.nodeType==9)){
var e=elem.getElementsByTagName(arguments[0]);
for(var i=0;i<e.length;i++){
r.push(e[i]);
}
return r;
}
return null;
});

Javascript 相关文章推荐
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
Nov 27 Javascript
javascript计算用户打开网页的停留时间
Jan 09 Javascript
编写简单的jQuery提示插件
Dec 21 Javascript
jQuery实现灰蓝风格标准二级下拉菜单效果代码
Aug 31 Javascript
js提示框替代系统alert,自动关闭alert对话框的实现方法
Nov 07 Javascript
js正则表达式验证密码强度【推荐】
Mar 03 Javascript
基于vue实现多引擎搜索及关键字提示
Mar 16 Javascript
分享vue里swiper的一些坑
Aug 30 Javascript
基于node.js实现爬虫的讲解
Feb 18 Javascript
[原创]微信小程序获取网络类型的方法示例
Mar 01 Javascript
vue 重塑数组之修改数组指定index的值操作
Aug 09 Javascript
Vue实现计算器计算效果
Aug 17 Javascript
javascript Base类 包含基本的方法
Jul 22 #Javascript
javascript 表单规则集合对象
Jul 21 #Javascript
一个可以随意添加多个序列的tag函数
Jul 21 #Javascript
一个cssQuery对象 javascript脚本实现代码
Jul 21 #Javascript
js计算页面刷新的次数
Jul 20 #Javascript
[原创]IE view-source 无法查看看源码 JavaScript看网页源码
Jul 19 #Javascript
Prototype Hash对象 学习
Jul 19 #Javascript
You might like
需要注意的几个PHP漏洞小结
2012/02/05 PHP
php生成短域名函数
2015/03/23 PHP
discuz图片顺序混乱解决方案
2015/07/29 PHP
php7基于递归实现删除空文件夹的方法示例
2017/06/15 PHP
php微信支付之公众号支付功能
2018/05/30 PHP
Yii2框架redis基本应用示例
2018/07/13 PHP
微信公众平台开发教程④ ThinkPHP框架下微信支付功能图文详解
2019/04/10 PHP
解决extjs在firefox中关闭窗口再打开后iframe中js函数访问不到的问题
2008/11/06 Javascript
JavaScript 实现模态对话框 源代码大全
2009/05/02 Javascript
jQuery学习笔记 操作jQuery对象 属性处理
2012/09/19 Javascript
一个JavaScript变量声明的知识点
2013/10/28 Javascript
使用iframe window的scroll方法控制iframe页面滚动
2014/03/05 Javascript
浅谈利用JavaScript进行的DDoS攻击原理与防御
2015/06/04 Javascript
jQuery实现的分子运动小球碰撞效果
2016/01/27 Javascript
基于JS代码实现图片在页面中旋转效果
2016/06/16 Javascript
Bootstrap CSS组件之面包屑导航(breadcrumb)
2016/12/17 Javascript
JS实现简单表格排序操作示例
2017/10/07 Javascript
Javascript将图片的绝对路径转换为base64编码的方法
2018/01/11 Javascript
vue实现自定义日期组件功能的实例代码
2018/11/06 Javascript
node将geojson转shp返回给前端的实现方法
2019/05/29 Javascript
JavaScript制作3D旋转相册
2020/08/02 Javascript
只有 20 行的 JavaScript 模板引擎实例详解
2020/05/11 Javascript
微信小程序实现多选框功能的实例代码
2020/06/24 Javascript
Linux中安装Python的交互式解释器IPython的教程
2016/06/13 Python
Python实现的选择排序算法示例
2017/11/29 Python
Python散点图与折线图绘制过程解析
2019/11/30 Python
python实现指定ip端口扫描方式
2019/12/17 Python
windows下Pycharm安装opencv的多种方法
2020/03/05 Python
Python3标准库之threading进程中管理并发操作方法
2020/03/30 Python
名词解释型面试题(主要是网络)
2013/12/27 面试题
大学毕业自我评价
2014/02/02 职场文书
园艺专业毕业生求职信
2014/09/02 职场文书
中国在我心中演讲稿
2014/09/13 职场文书
员工自我工作评价
2015/03/06 职场文书
董事会决议范本
2015/07/01 职场文书
我的暑假生活作文(五年级)范文
2019/08/07 职场文书