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 相关文章推荐
Jquery Ajax学习实例6 向WebService发出请求,返回DataSet(XML) 异步调用
Mar 18 Javascript
jQuery-Easyui 1.2 实现多层菜单效果的代码
Jan 13 Javascript
js移除事件 js绑定事件实例应用
Nov 28 Javascript
jQuery.extend()的实现方式详解及实例
Jun 29 Javascript
js计算两个时间之间天数差的实例代码
Nov 19 Javascript
jQuery filter函数使用方法
May 19 Javascript
jQuery对象初始化的传参方式
Feb 26 Javascript
JavaScript 事件入门知识
Apr 13 Javascript
浅谈setTimeout 与 setInterval
Jun 23 Javascript
13 个npm 快速开发技巧(推荐)
Jul 04 Javascript
vue实现点击按钮下载文件功能
Oct 11 Javascript
vue.js实现双击放大预览功能
Jun 23 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 FOR MYSQL 代码生成助手(根据Mysql里的字段自动生成类文件的)
2011/07/23 PHP
php在线代理转向代码
2012/05/05 PHP
php使用str_replace替换多维数组的实现方法分析
2017/06/15 PHP
RGB颜色值转HTML十六进制(HEX)代码的JS函数
2009/04/25 Javascript
jQuery 扩展对input的一些操作方法
2009/10/30 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(五)可移动地图的实现
2013/01/23 Javascript
js/jQuery对象互转(快速操作dom元素)
2013/02/04 Javascript
AngularJS中的按需加载ocLazyLoad示例
2017/01/11 Javascript
vuejs手把手教你写一个完整的购物车实例代码
2017/07/06 Javascript
js 获取html5的data属性实现方法
2017/07/28 Javascript
swiper移动端轮播插件(触碰图片之后停止轮播)
2017/12/28 Javascript
微信小程序之swiper滑动面板用法示例
2018/12/04 Javascript
vue cli使用融云实现聊天功能的实例代码
2019/04/19 Javascript
微信小程序实现动态列表项的顺序加载动画
2019/07/25 Javascript
24个ES6方法解决JS实际开发问题(小结)
2020/05/31 Javascript
多页vue应用的单页面打包方法(内含打包模式的应用)
2020/06/11 Javascript
javascript前端和后台进行数据交互方法示例
2020/08/07 Javascript
详解vue-cli项目在IE浏览器打开报错解决方法
2020/12/10 Vue.js
python 获取et和excel的版本号
2009/04/09 Python
python之文件读取一行一行的方法
2018/07/12 Python
Python多继承原理与用法示例
2018/08/23 Python
python中对数据进行各种排序的方法
2019/07/02 Python
python中使用while循环的实例
2019/08/05 Python
Python常用模块sys,os,time,random功能与用法实例分析
2020/01/07 Python
解决Tensorboard 不显示计算图graph的问题
2020/02/15 Python
Python如何脚本过滤文件中的注释
2020/05/27 Python
印尼最大的在线购物网站:MatahariMall.com
2016/08/26 全球购物
捷克浴室和厨房设备购物网站:SIKO
2018/08/11 全球购物
澳洲本土太阳镜品牌:Quay Australia
2019/07/29 全球购物
英国买鞋网站:Charles Clinkard
2019/11/14 全球购物
学生操行评语大全
2014/04/24 职场文书
乡镇三严三实学习心得体会
2014/10/13 职场文书
大学生求职自荐信范文
2015/03/04 职场文书
民事代理词范文
2015/05/25 职场文书
Python使用PyYAML库读写yaml文件的方法
2022/04/06 Python
MySQL 执行数据库更新update操作的时候数据库卡死了
2022/05/02 MySQL