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星级插件、支持页面中多次使用
Mar 25 Javascript
jQuery侧边栏随窗口滚动实现方法
Mar 04 Javascript
jquery设置元素的readonly和disabled的写法
Sep 22 Javascript
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
Jun 11 Javascript
js实现背景图片感应鼠标变化的方法
Feb 28 Javascript
jquery 无限极下拉菜单的简单实例(精简浓缩版)
May 31 Javascript
AngularJS封装指令方法详解
Dec 12 Javascript
Vue2.0父组件与子组件之间的事件发射与接收实例代码
Sep 19 Javascript
vue.js实现回到顶部动画效果
Jul 31 Javascript
vue element-ui实现动态面包屑导航
Dec 23 Javascript
解决Vue大括号字符换行踩的坑
Nov 09 Javascript
js属性对象的hasOwnProperty方法的使用
Feb 05 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伪静态页面函数附使用方法
2008/06/20 PHP
PHP排序之二维数组的按照字母排序实现代码
2011/08/13 PHP
PHP中使用register_shutdown_function函数截获fatal error示例
2015/04/21 PHP
一个完整的php文件上传类实例讲解
2015/10/27 PHP
php+Ajax无刷新验证用户名操作实例详解
2019/03/04 PHP
laravel 数据迁移与 Eloquent ORM的实现方法
2019/04/12 PHP
COM中获取JavaScript数组大小的代码
2009/11/22 Javascript
JS获取浏览器版本及名称实现函数
2013/04/02 Javascript
JS判断变量是否为空判断是否null
2014/07/25 Javascript
jQuery插件jcrop+Fileapi完美实现图片上传+裁剪+预览的代码分享
2015/04/22 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
jQuery实现无限往下滚动效果代码
2016/04/16 Javascript
JavaScript条件判断_动力节点Java学院整理
2017/06/26 Javascript
基于Vue开发数字输入框组件
2017/12/19 Javascript
解决angular2在双向数据绑定时[(ngModel)]无法使用的问题
2018/09/13 Javascript
NodeJS实现同步的方法
2019/03/02 NodeJs
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
2019/05/01 Javascript
openlayers实现地图弹窗
2020/09/25 Javascript
[00:20]TI9不朽观赛名额抽取
2019/08/05 DOTA
Python 第一步 hello world
2009/09/25 Python
python中随机函数random用法实例
2015/04/30 Python
Python在信息学竞赛中的运用及Python的基本用法(详解)
2017/08/15 Python
Django内容增加富文本功能的实例
2017/10/17 Python
使用 Python 实现文件递归遍历的三种方式
2018/07/18 Python
Python wxPython库消息对话框MessageDialog用法示例
2018/09/03 Python
一篇文章搞懂Python的类与对象名称空间
2018/12/10 Python
python脚本调用iftop 统计业务应用流量的思路详解
2019/10/11 Python
Python序列对象与String类型内置方法详解
2019/10/22 Python
Python turtle画图库&amp;&amp;画姓名实例
2020/01/19 Python
应届生服装设计自我评价
2013/09/20 职场文书
班级学雷锋活动总结
2014/06/26 职场文书
2014年检验员工作总结
2014/11/19 职场文书
医学生自荐信范文
2015/03/05 职场文书
运动会新闻报道稿
2015/07/22 职场文书
php+laravel 扫码二维码签到功能
2021/05/15 PHP
Nginx 匹配方式
2022/05/15 Servers