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 基础学习笔记之文档处理
May 29 Javascript
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明
May 04 Javascript
你需要知道的10个最佳javascript开发实践小结
Apr 15 Javascript
javascript跨浏览器的属性判断方法
Mar 16 Javascript
JS新包管理工具yarn和npm的对比与使用入门
Dec 09 Javascript
微信小程序遇到修改数据后页面不渲染的问题解决
Mar 09 Javascript
js canvas实现放大镜查看图片功能
Jun 08 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
微信小程序实现动态设置页面标题的方法【附源码下载】
Nov 29 Javascript
解决vue中使用Axios调用接口时出现的ie数据处理问题
Aug 13 Javascript
在element-ui的select下拉框加上滚动加载
Apr 18 Javascript
基于JavaScript 实现拖放功能
Sep 12 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 和 XML: 使用expat函数(一)
2006/10/09 PHP
php设计模式小结
2013/02/15 PHP
PHP生成数组再传给js的方法
2014/08/07 PHP
PHP使用Memcache时模拟命名空间及缓存失效问题的解决
2016/02/27 PHP
PHP session会话操作技巧小结
2016/09/27 PHP
php中static和const关键字用法分析
2016/12/07 PHP
Laravel框架自定义分页样式操作示例
2020/01/26 PHP
Ext面向对象开发实践(续)
2008/11/18 Javascript
firefo xml 读写实现js代码
2009/06/11 Javascript
Firefox+FireBug使JQuery的学习更加轻松愉快
2010/01/01 Javascript
JQUERY1.6 使用方法四 检测浏览器
2011/11/23 Javascript
JS的replace方法介绍
2012/10/20 Javascript
javascript中不提供sleep功能如何实现这个功能
2014/05/27 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
Nodejs的express使用教程
2015/11/23 NodeJs
深入分析jQuery的ready函数是如何工作的(工作原理)
2015/12/17 Javascript
jQuery原理系列-css选择器的简单实现
2016/06/07 Javascript
微信小程序 MINA文件结构
2016/10/17 Javascript
vue自定义过滤器创建和使用方法详解
2017/11/06 Javascript
javascript实现最长公共子序列实例代码
2018/02/05 Javascript
Vue路由模块化配置的完整步骤
2019/08/14 Javascript
JS实现灯泡开关特效
2020/03/30 Javascript
如何实现vue的tree组件
2020/12/03 Vue.js
Python控制Firefox方法总结
2019/06/03 Python
flask框架路由常用定义方式总结
2019/07/23 Python
django项目登录中使用图片验证码的实现方法
2019/08/15 Python
python+Django+pycharm+mysql 搭建首个web项目详解
2019/11/29 Python
基于YUV 数据格式详解及python实现方式
2019/12/09 Python
python递归调用中的坑:打印有值, 返回却None
2020/03/16 Python
白兰氏健康Mall:BRAND’S
2017/11/13 全球购物
应届生护士求职信
2013/11/01 职场文书
药剂专业学生求职信范文
2013/12/28 职场文书
商业门面租房协议书
2014/11/25 职场文书
小学教学工作总结2015
2015/05/13 职场文书
导游词之河姆渡遗址博物馆
2019/10/10 职场文书
Django路由层如何获取正确的url
2021/07/15 Python