支持css选择器,ui界面，表单验证。2d,3D的网页绘图（vml和纯js实现）, 命名空间，js类集成，element扩展全部代码点这里下载对象目录float zhuozhuo.version版本(3.0起增加名称空间)object zhuozhuo.namespace(namespace)注册名称空间 并且返回此注册名称空间对象class zhuozhuo.zclass(class...)创建类或继承类,允许多继承(查看注解)object zhuozhuo.getById(argv...)根据一个或多个参数获取并包装对象(查看注解) 单参数返回zdom多参数返回arrayobject zhuozhuo.getBySelector(String selectors[, isAll])根据css规则包装输出ZDOM数组 如果isAll存在且为1或true则输出zdom数组,否则只输出一个对象浏览器信息string zhuozhuo.browser.version浏览器内核版本(IE, Opera显示浏览器版本)bool zhuozhuo.browser.kernel.isTrident 浏览器内核 IEbool zhuozhuo.browser.kernel.isGecko 浏览器内核 Firefox,MozillaSuite/SeaMonkey,Mozilla,Thunderbirdbool zhuozhuo.browser.kernel.isPresto 浏览器内核 Operabool zhuozhuo.browser.kernel.isWebKit 浏览器内核 Safaribool zhuozhuo.browser.kernel.isKHTML 浏览器内核 Konquerorbool zhuozhuo.browser.features.isXPath 是否支持xpathbool zhuozhuo.browser.features.isSelectorsAPI 是否支持css选择器工具string zhuozhuo.util.getClass(object) 返回对象类别字串object zhuozhuo.util.extend(destination, source) source对象合并到destination上 相同的方法或涵数覆盖 返回 destinationobject zhuozhuo.util.clone(object) 返回object的浅表复制bool zhuozhuo.util.isArray(object) 判断object是否数组bool zhuozhuo.util.isFunction(object) 判断object是否函数bool zhuozhuo.util.isNumber(object) 判断object是否数字bool zhuozhuo.util.isUndefined(object) 判断object是否未定义bool zhuozhuo.util.isString(object) 判断object是否是字符串array zhuozhuo.util.toArray(iteralbe) 把iteralbe转换为数组void zhuozhuo.util.fnEmpty() 空function函数bool zhuozhuo.util.fnTrue() 返回true的函数string zhuozhuo.util.param(object) 序列化objectobject zhuozhuo.util.trys(Function...) 执行多个function并返回最早的正确结果String zhuozhuo.util.string.trim(value) 去除左右两边的空格Integer zhuozhuo.util.string.wlength(value) 按英文长度返回字符串长度,一个汉字相当于两个英文字符String zhuozhuo.util.string.wsubstr(value, wstart[, wlength]) 按英文长度从开始位置截取指定长度字符串 一个汉字相当于两个英文字符String zhuozhuo.util.string.wsubstring(value, wstart, wend) 按英文长度截取指定范围的字符串Array zhuozhuo.util.array.each(array, Function handler(Object object, Integer index)) 迭代数组 并 相同的参数，面向所有的元素。返回调用方法的结果。第一参数数组值,第二个参数索引,返回执行结果数组Array zhuozhuo.util.array.uniq(array) 返回不重复的数组Integer zhuozhuo.util.array.indexOf(array Object object[, Integer startIndex]) 在数组中查找指定元素的位置,找不到返回 -1 可选参数 搜索的起始索引。空数组中 0（零）为有效值。事件包装new zhuozhuo.event.Event(event)object .event 被包装事件对象(例:window.event)bool .altKey 返回当事件被触发时，"ALT" 是否被按下。bool .ctrlKey 返回当事件被触发时，"CTRL" 键是否被按下。bool .shiftKey 返回当事件被触发时，"SHIFT" 键是否被按下。int .keyCode 设置或获取与导致事件的按键关联的 Unicode 按键代码。int .clientX 返回当事件被触发时，鼠标指针的水平坐标。int .clientY 返回当事件被触发时，鼠标指针的垂直坐标。int .screenX 返回当某个事件被触发时，鼠标指针的水平坐标。int .screenY 返回当某个事件被触发时，鼠标指针的垂直坐标。int .layerX 获取鼠标指针位置相对于触发事件的对象的 x 坐标。int .layerY 获取鼠标指针位置相对于触发事件的对象的 y 坐标。DOM .relatedTarget 返回与事件的目标节点相关的节点。(未包装)int .detail 获取滚轮按钮滚动的距离和方向。DOM .target 返回触发此事件的元素（事件的目标节点）。(未包装)DOM .currentTarget 返回其事件监听器触发该事件的元素。(未包装)string .type 返回当前 Event 对象表示的事件的名称。ZDOM .getTarget() 返回触发事件对象(已包装 zhuozhuo.element.*)Event .preventDefault() 取消事件的默认动作 返回当前事件包装Event .stopPropagation() 停止事件冒泡 返回当前事件包装事件监听new zhuozhuo.event.Listener()array .listeners 事件监听队列void .addListener(eventName, handler) 添加事件(事件名,处理函数)void .removeListener(eventName, handler) 添加事件(事件名,处理函数)void .notifyEvent(eventName, eventObject) 通知事件(事件名,希望传递的事件参数对象)节点包装array zhuozhuo.element.zdomcache 包装对象缓存 此对象用于重复包装同一节点void zhuozhuo.element.syncCache() 同步对象缓存 触发空对象finalize() 释放事件ZDOM zhuozhuo.element.extend(HTMLElement) 包装节点 返回已包装element对象ZDOM zhuozhuo.element.createTable(rows, cells) 创建表格ZDOM zhuozhuo.element.createElement(tagName) 创建标签object zhuozhuo.element.view.getDimensions() 获取尺寸 {Integer pageWidth,Integer pageHeight,Integer screenWidth,Integer screenHeight}object zhuozhuo.element.view.getScrollOffsets() 获取滚动条偏移位置 {Integer top,Integer left}css规则元素包装array zhuozhuo.element.getElementsBySelector(selectors, ZDOM) 使用css3选择符号new zhuozhuo.element.window(DOM) extneds zhuozhuo.event.Listenerwindow 节点包装类DOM .element 被包装节点array .eventsmaps 包装事件影射 {key,callback}ZDOM .addEvent(eventName, handler) 添加事件 返回当前包装实例ZDOM .removeEvent(eventName, handler) 删除事件 返回当前包装实例ZDOM .startCapture() 开始捕获鼠标 返回当前包装实例ZDOM .stopCapture() 停止捕获鼠标 返回当前包装实例zhuozhuo.element.document extends zhuozhuo.element.window 通用文档节点包装类new zhuozhuo.element.document(DOM)object .getBySelector(selectors[, isAll]) 使用当前对象调用 zhuozhuo.getBySelectorbool .hasClassName(className) 判断是否存在指定样式类名ZDOM .addClassName(className) 添加指定名称样式定义 返回当前包装实例ZDOM .removeClassName(className) 删除指定名称样式定义 返回当前包装实例bool .hasAttribute(attributeName) 判断是否存在指定属性ZDOM .setAttribute(name, value) 设置指定名称属性 返回当前包装实例ZDOM .setAttribute(attributes) 设置指定名称属性 {n0:v0,n1:v1....} 返回当前包装实例object .getAttribute(attributeName) 获取属性值ZDOM .setStyle(name, value) 设置样式 返回当前包装实例ZDOM .setStyle(styles) 设置样式 {n0:v0,n1:v1....} 返回当前包装实例string .getStyle(styleName) 获取样式ZDOM .setAlphaImage(imgurl) 设置背景图 返回当前包装实例string .getAlphaImage() 获取背景图ZDOM .setOpacity(opacity) 设置透明度 0 - 1 返回当前包装实例float .getOpacity() 获取透明度ZDOM .setText(value) 设置节点text内容 返回当前包装实例string .getText() 获取节点text内容ZDOM .setHTML(value) 设置节点html内容 返回当前包装实例string .getHTML() 获取节点html内容ZDOM .show(value) 显示节点 value 默认为 "block" 返回当前包装实例ZDOM .hide() 隐藏节点 返回当前包装实例ZDOM .toggle(value) 显示或隐藏节点 返回当前包装实例object .getOffsets() 获取放置偏移坐标 {left, top}object .getDimensions() 获取尺寸{width, height}ZDOM .remove() 删除自己 返回当前包装实例 触发一次同步缓村操作ZDOM .append(ZDOM) 附加结点返回被附加节点 返回新节点string .append(string html) 附加文本内容代码ZDOM .insert(sWhere, ZDOM) 插入节点sWhere=beforeBegin|afterBegin|beforeEnd|afterEnd返回新插入的节点ZDOM .animate(Object styles, int frames, int delay, int factor, fn callback(ZDOM node, int frames))自定义动画 (value:目的样式属性,frames:帧数,delay:每帧时间,factor:渐变因子(为"average"或非数字时 等于平均变化,否则每次按照此设置除法递减),callback:回调参数)callback 调用有两个参数node和frames node=被执节点,frames=当前倒数帧数 frames到1 到数 为1表示最后一帧 0表示结束ZDOM .animate(Object styles, int frames, int delay, fn callback) 自定义动画ZDOM .animate(Object styles, int frames, fn callback) 自定义动画ZDOM .animate(Object styles, fn callback) 自定义动画ZDOM .animate(Object styles) 自定义动画................................................................................new zhuozhuo.element.tag.FORM extends zhuozhuo.element.documentnew zhuozhuo.element.tag.INPUT extends zhuozhuo.element.document 表单元素包装string .getValue() 获取值ZDOM .setValue(string value) 设置值 返回当前包装................................................................................new zhuozhuo.element.tag.TEXTAREA extends zhuozhuo.element.tag.INPUT 多行文本输入包装................................................................................new zhuozhuo.element.tag.SELECR extends zhuozhuo.element.tag.INPUT 选择筐输入包装ajax对象zhuozhuo.ajax.Response构造:new zhuozhuo.ajax.Response(XMLHTTP XmlHttp) 包装构建一个新的 AjaxResponse 对象。属性: XMLHTTP xmlHttp 被封装Xmlhttp对象 String text 以文本形式获取返回内容 XmlDocument xml 以xml形式获取返回内容 String length 获取返回长度 String type 获取内容类型 Integer status 状态码方法: String getAllHeaders() 获取所有返回头String getHeader(String header)获取指定名称返回头类 zhuozhuo.ajax.Request extends zhuozhuo.event.Listener继承自事件监听构造: new zhuozhuo.ajax.Request() 构建一个新的 Ajax 对象。属性: XMLHTTP xmlHttp 此ajax类被包装xmlhttp对象 string encoding = "UTF-8" 编码 string url 请求url string method 请求方法 get 或 post bool async 是否异步 string user帐号 string password 密码 object requestHeaders 请求头集合方法: voidopen(String url, String method = "POST", Boolean async = true, String user = null, String password = null)创建一个新的http请求，并指定此请求的方法、URL以及验证信息 voidsetHeader(String header, String value) 设置请求头 (POST打开会自动设置必须header) voidsetHeaders(Object headers) 设置请求头 voidsend(Object varBody = {}) 发送 带数据的请求 voidonreadystatechange() 异步触发 voidabort() 取消当前请求事件: 事件名 参数 request Integer readyState读取状态 状态 0-4 0 (未初始化) 1 (初始化) 2 (发送数据) 3 (数据传送中) 4 (完成); success Ajax.Response response 请求成功 请自行包装xmlhttp failure Ajax.Response response 请求失败 请自行包装xmlhttpGET请求zhuozhuo.ajax.Request zhuozhuo.ajax.get({String url:"", 请求urlObject data:null, 请求数据boolean async:true, 同步异步String user:null, 用户名String password:null, 密码Function request:ZHUOZHUO.FALSE(int readyState),请求中Function success:ZHUOZHUO.FALSE(Ajax.Response response),成功Function failure:ZHUOZHUO.FALSE(Ajax.Response response)}); 失败POST请求zhuozhuo.ajax.Request zhuozhuo.ajax.post({参数同Ajax.get});注解:class zhuozhuo.zclass([superclass,...]currentclass) 创建javascript类,允许多重继承,并且增加构造和完成函数 例:var newClass = zhuozhuo.zclass(超类1..,超类N,{ 类方法名:函数体});var newClass1= zhuozhuo.zclass({ 类方法名:函数体});构造函数 initialize()调用父构造函数 类名.superclass.initialize.apply(this, arguments)完成函数 finalize()调用父完成函数 类名.superclass.finalize.apply(this)调用父其他函数 类名.superclass.方法名.apply(this, arguments) 类名.superclass.方法名.call(this[, arg0[, arg1]...])其他说明 多个父类时,按输入类名顺序,后面的方法覆盖前面类的同名方法object getById(argv1 [, ...[, argvN]])根据一个或多个参数获取并包装对象,参数类型可以为 HTMLElment,string,或 zhuozhuo.element., zhuozhuo.element.tag.的实例如类型正确,返回包装后的元素实例.多个实例集合为数组DOM,ZDOM 类型DOM:未包装DHTMLElement对象ZDOM:已包装的DHTMLElement实例zhuozhuo.js/* * zhuozhuo.org javascript library core code * Shi,Zhuolin * http://www.zhuozhuo.org * shizhuolin@hotmail.com * 2011-03-01 */ (function(scope){ var zz = scope.zhuozhuo = scope.zhuozhuo || {}; //library version zz.version = 3.0; //register namespace zz.namespace = function(ns){ if (!ns || !ns.length) return null; var levels = ns.split('.'), nsobj = scope; for (var i = 0; i < levels.length; i++) { nsobj[levels[i]] = nsobj[levels[i]] || {}; nsobj = nsobj[levels[i]]; } return nsobj; } //create javascript class zz.zclass = function(){ var zclass, baseclass, method, superclass = (function(){}).prototype; zclass = function(){ this.initialize.apply(this, arguments); } superclass.initialize = zclass.prototype.initialize = function(){}; superclass.finalize = zclass.prototype.finalize = function(){ for(var key in this) this[key] = null; } for(var i = 0, length = arguments.length; i < length; i++){ if(zz.util.isFunction(arguments[i])){ baseclass = function(){}; baseclass.prototype = arguments[i].prototype; baseclass = new baseclass; for(method in baseclass) superclass[method] = baseclass[method]; }else { baseclass = arguments[i]; } for(method in baseclass) if(!/^(toString|valueOf)$/.test(method)) if(zz.util.isFunction(baseclass[method])) zclass.prototype[method] = baseclass[method]; if(baseclass.toString!== Object.prototype.toString) zclass.prototype.toString= baseclass.toString; if(baseclass.valueOf !== Object.prototype.valueOf) zclass.prototype.valueOf = baseclass.valueOf; } zclass.superclass = superclass; return zclass; } //zhuozhuo.getById zz.getById = function(){ if (arguments.length > 1) { for (var i = 0, elements = [], length = arguments.length; i < length; i++) elements.push(zz.getById(arguments[i])); return elements; } return zz.element.extend(zz.util.isString(arguments[0]) ? document.getElementById(arguments[0]) : arguments[0]); } //zhuozhuo.getBySelector zz.getBySelector = function(selectors, isAll){ return zz.getById(document).getBySelector(selectors, isAll); } })(this); //browser information (function(scope){ var agent = navigator.userAgent; scope.zhuozhuo.browser = { version : (/MSIE\s(\d+(\.\d+)*)/.exec(agent) || /rv:(\d+(\.\d+)*)/.exec(agent) || /AppleWebKit\/(\d+(\.\d+)*)/.exec(agent) || /Opera.(\d+(\.\d+)*)?/.exec(agent) || /Presto\/(\d+(\.\d+)*)/.exec(agent) || /KHTML\/(\d+(\.\d+)*)/.exec(agent) || /Konqueror\/(\d+(\.\d+)*)/.exec(agent) || /[;\(]\s*(\w?\d+(\.\d+)*)\s*\)?/.exec(agent) || [,null])[1], kernel : { isTrident : agent.indexOf("MSIE") > -1, isGecko : agent.indexOf("Gecko/") > -1, isPresto : agent.indexOf("Presto/") > -1 || agent.indexOf("Opera/") > -1, isWebKit : agent.indexOf("AppleWebKit/") > -1, isKHTML : agent.indexOf("KHTML/") > -1 || agent.indexOf("Konqueror/") > -1 }, features : { isXPath : !!document.evaluate, isSelectorsAPI : !!document.querySelector } } })(this); //zhuozhuo.util.* (function(scope){ var zz = scope.zhuozhuo; zz.util = { getClass : function(object){ return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1]; }, extend : function(destination, source){ for(var property in source) destination[property] = source[property]; return destination; }, clone : function(object){ return zz.util.extend({}, object); }, isArray : function(object){ return zz.util.getClass(object) === "Array"; }, isUndefined : function(object){ return typeof object === "undefined"; }, isFunction : function(object){ return typeof object === "function"; }, isString : function(object){ return typeof object === "string"; }, isNumber : function(object){ return typeof object === "number"; }, toArray : function(iterable){ if (!iterable) return []; if ("toArray" in iterable) return iterable.toArray(); var length = iterable.length || 0, results = new Array(length); while (length--) results[length] = iterable[length]; return results; }, fnEmpty : function(){}, fnTrue : function(){ return true; }, param : function(object){ var array = []; for(var key in object) array.push(encodeURIComponent(key) + '=' + encodeURIComponent(object[key])); return array.join('&'); }, trys : function(){ var result; for (var i = 0, length = arguments.length; i < length; i++) try { result = arguments[i](); break; } catch (e) {} return result; } } zz.util.string = { trim : function(value){ return value.replace(/(^\s+)|(\s+$)/g, ''); }, wlength : function(value){ return value.replace(/[^\x00-\xff]/g, "rr").length; }, wsubstr : function(value, wstart, wlength){ wlength = isNaN(wlength) ? Number.MAX_VALUE : wlength; return wlength == 0 ? "" : zz.util.string.wsubstring(value, wstart, wstart + wlength - 1); }, wsubstring : function(value, wstart, wend){ var ws = Math.min(wstart, wend), we = Math.max(wstart, wend); var i = 0, length = value.length, retult = ""; for(; i < length; i++){ var wl = value.substring(0, i).wlength(); if(wl > we) break; if(wl >= ws) retult += value.substr(i, 1); } return retult; } } zz.util.array = { each : function(arr, handler){ var retus = []; for (var i = 0, length = arr.length; i < length; i++) retus.push(handler(arr[i], i)); return retus; }, uniq : function(arr){ var array = []; for(var i = 0, length = arr.length; i < length; i++) if(zz.util.array.indexOf(array, arr[i]) == -1) array.push(arr[i]); return array; }, indexOf : function(arr, object, startIndex){ startIndex = startIndex || 0; var length = arr.length; if(startIndex < 0) startIndex = 0; if(startIndex > length) startIndex = length; for(; startIndex < length; startIndex++) if(arr[startIndex] === object) return startIndex; return -1; } } })(this); //zhuozhuo.event.* (function(scope){ var zz = scope.zhuozhuo; var util = zz.util; zz.event = { Event : zz.zclass({ initialize : function(event){ this.event = event; this.altKey = event.altKey; this.clientX = event.clientX; this.clientY = event.clientY; this.ctrlKey = event.ctrlKey; this.keyCode = event.keyCode; this.screenX = event.screenX; this.screenY = event.screenY; this.layerX = event.offsetX || event.layerX; this.layerY = event.offsetY || event.layerY; this.shiftKey= event.shiftKey; this.detail = event.detail ? event.detail > 0 ? 1 : -1 : event.wheelDelta > 0 ? -1 : 1; this.target = event.srcElement || event.target; this.type = event.type; this.relatedTarget= event.fromElement || event.relatedTarget; this.currentTarget= event.toElement || event.currentTarget; }, stopPropagation : function(){ var event = this.event; event.stopPropagation ? event.stopPropagation() : event.cancelBubble = true; return this; }, preventDefault : function(){ var event = this.event; event.preventDefault ? event.preventDefault() : event.returnValue = false; return this; }, getTarget : function(){ var node = this.target, type = this.type; var currentTarget = this.currentTarget; if ((currentTarget && currentTarget.tagName) && (type === "load" || type === "error" || (type === "click" && currentTarget.tagName.toLowerCase() === "input" && currentTarget.type === "radio"))) node = currentTarget; if(node.nodeType === 3) node = node.parentNode; return zz.element.extend(node); } }), Listener : zz.zclass({ initialize : function(){ this.listeners = []; }, addListener : function(eventName, handler){ if(!util.isFunction(handler)) return; for(var i = 0, length = this.listeners.length; i < length; i++) if(this.listeners[i].eventName === eventName && this.listeners[i].handler === handler) return; this.listeners.push({ eventName : eventName, handler : handler }); }, removeListener : function(eventName, handler){ if(!util.isFunction(handler)) return; for(var i = 0, length = this.listeners.length; i < length; i++) if(this.listeners[i].eventName === eventName && this.listeners[i].handler === handler) { this.listeners[i] = this.listeners[i].eventName = this.listeners[i].handler = null; this.listeners.splice(i, 1); return; } }, notifyEvent : function(eName, eobj){ for(var i = 0, length = this.listeners.length; i < length; i++) if(this.listeners[i].eventName === eName) this.listeners[i].handler(eobj); }, finalize : function(){ for(var i = 0, length = this.listeners.length; i < length; i++) this.listeners[i].eventName = this.listeners[i].handler = null; zz.event.Listener.superclass.finalize.apply(this) } }) } })(this); //window and document and other element (function(scope){ var zz = scope.zhuozhuo; var util = zz.util; zz.namespace("zhuozhuo.element.tag"); zz.element.zdomcache = []; zz.element.syncCache = function(){ var newcache = []; for(var i = 0, length = zz.element.zdomcache.length; i < length; i++){ if(!checkin(zz.element.zdomcache[i].element)){ zz.element.zdomcache[i].finalize(); zz.element.zdomcache[i] = null; }else newcache.push(zz.element.zdomcache[i]); } zz.element.zdomcache = newcache; function checkin(ele){ while(ele){ if(ele === window.document.body) return true if(ele === window.document) return true; if(ele === window) return true; ele = ele.parentNode; } return false; } }; zz.element.extend = function(element){ if(!element || util.isFunction(element) || !!element.element || !!element.initialize) return element; var byClass; if(element === window) byClass = zz.element.window; else{ if(element === document) byClass = zz.element.document; else{ if(element.nodeType != 1) return element; byClass = zz.element.tag[element.tagName.toUpperCase()] || zz.element.document; } } for(var i=0, length = zz.element.zdomcache.length; i < length ; i++) if(zz.element.zdomcache[i].element === element) return zz.element.zdomcache[i]; var zdom = new byClass(element); zz.element.zdomcache.push(zdom); return zdom; } zz.element.createTable = function(rows, cells){ var table = document.createElement("table"); for(var i = 0; i < rows; i++){ table.insertRow(i); for(var j = 0; j < cells; j++) table.rows[i].insertCell(j); } return zz.element.extend(table); } zz.element.createElement= function(tagName){ return zz.element.extend(document.createElement(tagName)); } zz.element.view = { getDimensions : function(){ var scrW, scrH, win = window, doc = document; if(win.innerHeight && win.scrollMaxY) { scrW = win.innerWidth + win.scrollMaxX; scrH = win.innerHeight + win.scrollMaxY; } else if(!doc.body && doc.documentElement && doc.documentElement.scrollWidth){ scrW = doc.documentElement.scrollWidth; scrH = doc.documentElement.scrollHeight; } else if(doc.body){ scrW = doc.body.scrollWidth; scrH = doc.body.scrollHeight; } var winW, winH; if(win.innerHeight) { winW = win.innerWidth; winH = win.innerHeight; } else if (doc.documentElement && doc.documentElement.clientHeight){ winW = doc.documentElement.clientWidth; winH = doc.documentElement.clientHeight; } else if (doc.body) { winW = doc.body.clientWidth; winH = doc.body.clientHeight; } var pageW = scrW < winW ? winW : scrW; var pageH = scrH < winH ? winH : scrH; return { pageWidth : pageW, pageHeight : pageH, screenWidth : winW, screenHeight: winH }; }, getScrollOffsets : function(){ var top = 0, left = 0, win = window, doc = document; if(win.pageYOffset){ top = win.pageYOffset; left = win.pageXOffset; }else if(doc.compatMode && doc.compatMode != "BackCompat"){ top = doc.documentElement.scrollTop; left = doc.documentElement.scrollLeft; }else if(doc.body){ top = doc.body.scrollTop; left = doc.body.scrollLeft; } return { top : top, left : left }; } } zz.element.getElementsBySelector = function(selectors, zdom){ var element = zdom.element; var _re0 = "(?=([^\"\']*[\"\'][^\"']*[\"'])*(?![^\"']*[\"']))"; var _re1 = "(?=([^\\[]*\\[[^\\]]*\\])*(?![^\\]]*\\]))"; var elements = zz.browser.features.isSelectorsAPI ? util.toArray(element.querySelectorAll(selectors)) : zz.browser.features.isXPath ? _querySelectorAllByXPath(selectors, element) : _querySelectorAllByJavaScript(selectors, element); for(var i = 0, length = elements.length; i < length; i++) elements[i] = zz.element.extend(elements[i]); function _querySelectorAllByXPath(selectors, element){ var xpath = selectors.trim(); xpath = xpath.replace(new RegExp("^\\s*|\\s*,\\s*" + _re1, 'g'), function(e){ return (e.indexOf(',') > -1 ? '|' : '') + ".//*"; }); xpath = xpath.replace(new RegExp("\\s*~\\s*" + _re1, 'g'), "/following-sibling::*"); xpath = xpath.replace(new RegExp("\\s*\\+\\s*" + _re1, 'g'), "/following-sibling::*[1]"); xpath = xpath.replace(new RegExp("\\s*>\\s*" + _re1, 'g'), "/*"); xpath = xpath.replace(new RegExp("\\s+" + _re1, 'g'), "//*"); xpath = xpath.replace(new RegExp("\\*(\\w)" + _re1, 'g'), "$1"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*]" + _re0, 'g'), "[@$1]"); xpath = xpath.replace(new RegExp("\\.(\\w+)" + _re0, 'g'), "[class~='$1']"); xpath = xpath.replace(new RegExp("#(\\w+)" + _re0, 'g'), "[id='$1']"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*\\^=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[starts-with(@$1,'$2')]"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*\\$=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[substring(@$1,(string-length(@$1) - string-length('$2') + 1))='$2']"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*\\*=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[contains(@$1,'$2')]"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*\\|=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[contains(concat('-',@$1,'-'),'-$2-')]"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*~=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[contains(concat(' ',@$1,' '),' $2 ')]"); xpath = xpath.replace(new RegExp("\\[\\s*(\\w+)\\s*=\\s*'?([^']*)'?\\s*]" + _re0, 'g'), "[@$1='$2']"); var query = doc.evaluate(xpath, element, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null), results = []; for(var i = 0, length = query.snapshotLength; i < length; i++) results.push(query.snapshotItem(i)); return results; } function _querySelectorAllByJavaScript(selectors, element){ var expression = util.string.trim(selectors); expression = expression.replace(new RegExp("(^|\\s|,|>|\\+|~)(#|\\.|\\[)" + _re0, 'g'), "$1*$2"); expression = expression.replace(new RegExp("\\s{2,}" + _re0, 'g'), ' '); expression = expression.replace(new RegExp("\\s*(>|\\+|~|,)\\s*" + _re0, 'g'), '$1'); expression = expression.replace(new RegExp("#(\\w+)" + _re0, 'g'), "[id='$1']"); expression = expression.replace(new RegExp("\\.(\\w+)" + _re0, 'g'), "[class~='$1']"); var ElementArray = [], elements, child, selector; util.array.each(util.string.trim(expression).split(new RegExp(',' + _re1, 'g')), function(strSelector){ if(strSelector == '') return false; elements = [element]; strSelector = strSelector.replace(new RegExp("(\\s|>|\\+|~)(\\w|\\*)" + _re1, 'g'), "\n$1$2").split('\n'); for (var i = 0, length = strSelector.length; i < length; i++){ child = strSelector[i].substr(0, 1); selector= strSelector[i].substr(1); switch(child){ case ' ' : elements = __concatMatcher(selector, elements); break; case '>' : elements = __childSelectors(selector, elements); break; case '+' : elements = __nextSiblings(selector, elements); break; case '~' : elements = __nextSiblingAll(selector, elements); break; default : elements = __concatMatcher(strSelector[i], elements); } } ElementArray = ElementArray.concat(elements); return false; }); function __getTagAttrs(selector){ var TAASL = selector.replace(new RegExp("(\\[|])" + _re0, 'g'), '\n').split('\n'); var tagName = TAASL[0], attrs=[]; TAASL.shift(); util.array.each(TAASL, function(v){ v = util.string.trim(v); if(v != '' ) attrs.push('['+v+']'); }); attrs = attrs.join(''); return { tagName : tagName, attrs : attrs }; } function __getAttr(element, attributeName){ if(attributeName == "class" && zz.browser.kernel.isTrident) return element.className; if(attributeName == "style" && zz.browser.kernel.isTrident) return element.style.cssText; return element.getAttribute(attributeName); } function __checkAttr(element, attrs){ var TAASL = attrs.replace(new RegExp("\\[|]" + _re0, 'g'), '\n').split('\n'), value, returs = true; if(element.nodeType != 1) return false; for(var i = 0, length = TAASL.length; i < length; i++){ attrs = util.string.trim(TAASL[i]); if(attrs == '') continue; attrs = attrs.replace(new RegExp("([~\\|\\^\\$\\*]?=)" + _re0, 'g'), "\n$1\n").split('\n'); attrs[0] = util.string.trim(attrs[0]); value = __getAttr(element, attrs[0]); if(attrs.length == 1){ if(!/^(class|style)$/.test(attrs[0]) && (value === null || element[attrs[0]] === undefined)) returs = false; }else{ attrs[2] = attrs[2].replace(/(^\s*')|('\s*$)/g, ''); switch(attrs[1]){ case "|=" : if(!new RegExp("(^|-)" + attrs[2] + "(-|$)", 'g').test(value)) returs = false; break; case "~=" : if(!new RegExp("(^|\\s)" + attrs[2] + "(\\s|$)", 'g').test(value)) returs = false; break; case "*=" : if(!new RegExp(attrs[2], 'g').test(value)) returs = false; break; case "$=" : if(!new RegExp(attrs[2] + '$', 'g').test(value)) returs = false; break; case "^=" : if(!new RegExp('^' + attrs[2], 'g').test(value)) returs = false; break; default : if(!new RegExp('^' + attrs[2] + '$', 'g').test(value)) returs = false; } } } return returs; } function __reTagAndAttr(tagAndAttrSelector, element){ var v = __getTagAttrs(tagAndAttrSelector), returs = []; var elements = element.getElementsByTagName(v.tagName); for(var i = 0, length = elements.length; i < length; i++) if(__checkAttr(elements[i], v.attrs)) returs.push(elements[i]); return returs; } function __concatMatcher(selector, elements){ var returs = []; for(var i = 0, length = elements.length; i < length; i++) returs = returs.concat(__reTagAndAttr(selector, elements[i])); return returs; } function __childSelectors(selector, elements){ var v = __getTagAttrs(selector), tmpelements = [], childnodes; for(var i = 0, length = elements.length; i < length; i++){ childnodes = elements[i].childNodes; for(var j = 0, len = childnodes.length; j < len; j++) if(childnodes[j].nodeType == 1 && __checkAttr(childnodes[j], v.attrs) && (childnodes[j].tagName.toLowerCase() == v.tagName || v.tagName == '*')) tmpelements.push(childnodes[j]); } return tmpelements; } function __nextSiblings(selector, elements){ var v = __getTagAttrs(selector), tmpelements = [], next; for(var i = 0, length = elements.length; i < length; i++){ next = elements[i].nextSibling; if(next && next.nodeType == 1 && checkattr(next, v.attrs) && (next.tagName.toLowerCase() == v.tagName || v.tagName == '*')) tmpelements.push(next); } return tmpelements; } function __nextSiblingAll(selector, elements){ var v = __getTagAttrs(selector), tmpelements = [], next; for(var i = 0, length = elements.length; i < length; i++){ next = elements[i]; while(next){ if(next && next.nodeType == 1 && checkattr(next, v.attrs) && (next.tagName.toLowerCase() == v.tagName || v.tagName == '*')) tmpelements.push(next); next = next.nextSibling; } } return tmpelements; } return util.array.uniq(ElementArray); } return elements; } zz.element.window = zz.zclass(zz.event.Listener, { initialize : function(element){ zz.element.window.superclass.initialize.apply(this, arguments) this.element = element; this.eventsmaps = []; }, addEvent : function(eventName, callback){ var handler = function(event){ callback(new zz.event.Event(event)); } this.eventsmaps.push({ key : callback, handler: handler }); this.addListener(eventName, handler); var element = this.element; if(eventName.toLowerCase() == "mousewheel" && zz.browser.kernel.isGecko) eventName = "DOMMouseScroll"; element.attachEvent ? element.attachEvent("on" + eventName, handler) : element.addEventListener(eventName, handler, false); return this; }, removeEvent : function(eventName, callback){ for(var i = 0, length = this.eventsmaps.length; i < length; i++){ if(this.eventsmaps[i].key === callback){ var element = this.element; var handler = this.eventsmaps[i].handler; this.removeListener(eventName, handler); if(eventName.toLowerCase() == "mousewheel" && zz.browser.kernel.isGecko) eventName = "DOMMouseScroll"; element.detachEvent ? element.detachEvent("on" + eventName, handler) : element.removeEventListener(eventName, handler, false); this.eventsmaps[i] = this.eventsmaps[i].key = this.eventsmaps[i].handler = null; this.eventsmaps.splice(i, 1); return this; } } return this; }, startCapture : function(){ var element = this.element; element.setCapture ? element.setCapture() : window.captureEvents ? (zz.browser.kernel.isGecko && parseFloat(zz.browser.version) >= 1.9) ? util.fnEmpty() : window.captureEvents(Event.MOUSEMOVE) : util.fnEmpty(); return this; }, stopCapture : function(){ var element = this.element; element.releaseCapture ? element.releaseCapture() : window.releaseEvents ? (zz.browser.kernel.isGecko && parseFloat(zz.browser.version) >= 1.9) ? util.fnEmpty() : window.releaseEvents(Event.MOUSEMOVE) : util.fnEmpty(); return this; }, finalize : function(){ for(i = 0, length = this.listeners.length; i < length; i++) this.removeEvent(this.listeners[i].eventName, this.listeners[i].handler); for(var i = 0, length = this.eventsmaps.length; i < length; i++) this.eventsmaps[i] = this.eventsmaps[i].key = this.eventsmaps[i].handler = null; zz.element.window.superclass.finalize.apply(this); } }); zz.element.document = zz.zclass(zz.element.window,{ getBySelector : function(selectors, isAll){ var result = zz.element.getElementsBySelector(selectors, this); return isAll ? result : result.length == 0 ? null : result[0]; }, hasClassName : function(className){ var value = this.element.className; return (value.length > 0 && (value == className || new RegExp("(^|\\s)" + className + "(\\s|$)").test(value))); }, addClassName : function(className){ var element = this.element; if(!this.hasClassName(className)) element.className += (element.className ? ' ' : '') + className; return this; }, removeClassName : function(className){ var element = this.element; element.className = util.string.trim(element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), ' ')); return this; }, hasAttribute : function(attributeName) { if(this.hasAttribute) return this.hasAttribute(attributeName); return this.getAttribute(attributeName) != null; }, setAttribute : function(property, value){ if(arguments.length == 1) for(var name in property) this.setAttribute(name, property[name]); else{ var element = this.element; if(property == "style" && zz.browser.kernel.isTrident) element.style.cssText = value; else element.setAttribute(property, value); } return this; }, getAttribute : function(attributeName){ var element = this.element; if(attributeName == "class" && ZHUOZHUO.BrowserKernel.Trident) return element.className; if(attributeName == "style" && ZHUOZHUO.BrowserKernel.Trident) return element.style.cssText; return element.getAttribute(attributeName); }, setStyle : function(property, value){ if(arguments.length == 1) for(var style in property) this.setStyle(style, property[style]); else{ if(zz.browser.kernel.isTrident && parseFloat(zz.browser.version) < 8.0 && property == "zIndex" && value == "auto") value = ""; property == "alphaImage" ? this.setAlphaImage(value) : property == "opacity" ? this.setOpacity(value) : this.element.style[property == "styleFloat" ? document.defaultView ? "cssFloat" : property : property] = value; } return this; }, getStyle : function(styleName){ var element = this.element; if(styleName == "opacity") return this.getOpacity(); if(styleName == "alphaImage") return this.getAlphaImage(); styleName = styleName == "styleFloat" ? document.defaultView ? "cssFloat" : styleName : styleName; styleName = styleName == "${opacity}" ? "opacity" : styleName; var value = element.currentStyle ? element.currentStyle[styleName] : document.defaultView.getComputedStyle(element, null) ? document.defaultView.getComputedStyle(element, null)[styleName] : element.style[styleName]; if(/^(width|height)$/.test(styleName) && (isNaN(parseFloat(value)) || value.indexOf('%') > -1)){ var values = styleName == "width" ? ["Left", "Right"] : ["Top", "Bottom"]; var padding = 0, border = 0; value = (styleName == "width") ? element.offsetWidth : element.offsetHeight; for(var i = 0, length = values.length; i < length; i++){ padding += parseFloat(this.getStyle("padding" + values[i])) || 0; border += parseFloat(this.getStyle("border" + values[i] + "Width")) || 0; } value = value - padding - border + "px"; } return value ? value : null; }, setAlphaImage : function(url){ var element = this.element; if(element.filters){ var filterName = "DXImageTransform.Microsoft.AlphaImageLoader"; var AlphaImageLoader = element.filters[filterName]; if(AlphaImageLoader){ AlphaImageLoader.src = url; AlphaImageLoader.sizingMethod = "crop"; AlphaImageLoader.Enabled = !!url; }else if(url) element.style.filter = "progid:" + filterName + "(sizingMethod=\"crop\", src=\"" + url + "\")"; }else{ if(url){ element.style.backgroundImage = "url(\"" + url + "\")"; element.style.backgroundRepeat= "no-repeat"; }else element.style.backgroundImage = "none"; } return this; }, getAlphaImage : function(){ if(this.element.filters){ var AlphaImageLoader = this.element.filters["DXImageTransform.Microsoft.AlphaImageLoader"]; return (AlphaImageLoader && AlphaImageLoader.Enabled) ? AlphaImageLoader.src : null; }else return this.getStyle("backgroundImage").replace(/^\s*url\s*\(\s*["']?\s*([^"'\)]+)\s*['"]?\s*\)\s*$/i,"$1") || null; }, setOpacity : function(opacity){ var element = this.element; if(element.filters){ var filterName = "DXImageTransform.Microsoft.Alpha"; var Alpha = element.filters[filterName]; opacity = opacity * 100; if(Alpha){ Alpha.Enabled = opacity !== 100; Alpha.Opacity = opacity; }else if(opacity !== 100) element.style.filter = "progid:" + filterName + "(opacity = " + opacity + ")"; }else{ element.style.opacity = opacity; element.style.MozOpacity = opacity; element.style.KhtmlOpacity= opacity; } return this; }, getOpacity : function(){ var opacity = NaN; if(this.element.filters){ var Alpha = this.element.filters["DXImageTransform.Microsoft.Alpha"]; opacity = (Alpha && Alpha.Enabled) ? Alpha.Opacity / 100 : NaN; } if(isNaN(opacity)) opacity = parseFloat(this.getStyle("${opacity}")); if(isNaN(opacity)) opacity = parseFloat(this.getStyle("MozOpacity")); if(isNaN(opacity)) opacity = parseFloat(this.getStyle("KhtmlOpacity")); if(isNaN(opacity)) opacity = 1; return opacity; }, setText : function(value){ var element = this.element; element.innerHTML = ''; element.innerText ? element.innerText = value : element.appendChild(document.createTextNode(value)); return this; }, getText : function(){ var element = this.element; if(element.innerText) return element.innerText; var value = undefined; try{ value = element.textContent; }catch(e){} return value || element.innerHTML.replace(/<[^<>]*>/g, '').replace(" ", ' ').replace("<", '<').replace(">", '>').replace("&", '&').replace(""", '"'); }, setHTML : function(value){ this.element.innerHTML = value; return this; }, getHTML : function(){ return this.element.innerHTML; }, show : function(value){ this.element.style.display = value || "block"; return this; }, hide : function(){ this.element.style.display = "none"; return this; }, toggle : function(value){ return this.getStyle("display") == "none" ? this.show(value) : this.hide(); }, getOffsets : function(){ var top = 0, left = 0, element = this.element; do{ top += element.offsetTop || 0; left+= element.offsetLeft || 0; element = element.offsetParent; if(element){ if(element.tagName.toUpperCase() == 'BODY') break; if((element.currentStyle ? element.currentStyle["position"] : document.defaultView.getComputedStyle(element, null) ? document.defaultView.getComputedStyle(element, null)["position"] : element.style["position"]) !== "static") break; } }while(element); return { left : left, top : top }; }, getDimensions : function(){ var element = this.element; var display = this.getStyle("display"); if (display != "none" && display != null) return { width : element.offsetWidth, height : element.offsetHeight }; var originalVisibility= this.getStyle("visibility"); var originalPosition = this.getStyle("position"); var originalDisplay = this.getStyle("display"); element.style.visibility = "hidden"; element.style.position = "absolute"; element.style.display = "block"; var originalWidth = element.clientWidth; var originalHeight = element.clientHeight; element.style.visibility = originalVisibility; element.style.position = originalPosition; element.style.display = originalDisplay; return { width : originalWidth, height : originalHeight }; }, remove : function(){ var element = this.element; if(zz.browser.kernel.isTrident){ var div = document.createElement("div"); div.appendChild(element); div.innerHTML = ''; }else element.parentNode.removeChild(element); zz.element.syncCache(); return this; }, append : function(o){ if(util.isString(o)) this.element.innerHTML += o; else this.element.appendChild(o.element); return o; }, insert : function(sWhere, oElement){ var newobj = oElement.element, element = this.element; if(element.insertAdjacentElement) element.insertAdjacentElement(sWhere, newobj); else{ sWhere = sWhere.toLowerCase(); var parentNode = element.parentNode; switch(sWhere){ case "beforebegin" : parentNode.insertBefore(newobj, element); break; case "afterbegin" : element.insertBefore(newobj, element.firstChild); break; case "beforeend" : element.appendChild(newobj); break; case "afterend" : element.nextSibling ? parentNode.insertBefore(newobj, element.nextSibling) : parentNode.appendChild(newobj); break; default : throw "function insertElement(element, sWhere{error!}, oElement)"; } } return oElement; }, animate : function(styles, frames, delay, factor, callback){ if(util.isFunction(frames)){ callback = frames; frames = 6; } if(util.isFunction(delay)){ callback = delay; delay = 50; } if(util.isFunction(factor)){ callback = factor; factor = "average"; } frames = frames ? frames : 6; delay = delay ? delay : 50; factor = factor ? factor : "average"; callback = callback ? callback : util.fnEmpty; var toStyles = util.clone(styles); var newStyles = util.clone(styles); var average = util.isNumber(factor) ? factor : frames; for(var style in newStyles){ var newStyle = parseFloat(this.getStyle(style)); var toStyle = parseFloat(toStyles[style]); var nowStyle = (newStyle < toStyle) ? newStyle + (toStyle - newStyle) / average : newStyle - (newStyle - toStyle) / average; nowStyle = Math.round(nowStyle * 100) / 100; nowStyle = toStyles[style].toString().replace(toStyle, nowStyle); newStyles[style] = nowStyle; } var element = this; if(this._changeAnimate) window.clearTimeout(this._changeAnimate); this._changeAnimate = window.setTimeout(function(){ if(frames > 1){ element.setStyle(newStyles); element.animate(styles, frames - 1, delay, factor, callback); }else{ window.clearTimeout(element._changeAnimate); element._changeAnimate = null; element.setStyle(styles); } callback(element, frames - 1); }, delay); return this; } }); zz.element.tag.FORM = zz.zclass(zz.element.document,{}); zz.element.tag.INPUT = zz.zclass(zz.element.document,{ getValue : function(){ return this.element.value; }, setValue : function(value){ this.element.value = value; return this; } }); zz.element.tag.TEXTAREA = zz.zclass(zz.element.tag.INPUT,{}); zz.element.tag.SELECT = zz.zclass(zz.element.tag.INPUT,{}); })(this); (function(scope){ var zz = scope.zhuozhuo, util = scope.zhuozhuo.util; /* Ajax */ zz.ajax = { /* class ajax.Response */ Response : zz.zclass({ initialize : function(xmlHttp){ zz.ajax.Response.superclass.initialize.apply(this); this.xmlHttp = xmlHttp; this.readyState = xmlHttp.readyState; this.text = xmlHttp.responseText; this.xml = xmlHttp.responseXML; this.status = xmlHttp.status; this.length = this.getHeader("Content-Length"); this.type = this.getHeader("Content-Type"); }, getAllHeaders : function(){ return this.xmlHttp.getAllResponseHeaders(); }, getHeader : function(header){ try{ return this.xmlHttp.getResponseHeader(header); }catch(e){} return null; } }), /* class Ajax.Request */ Request : zz.zclass(zz.event.Listener, { initialize : function(){ zz.ajax.Request.superclass.initialize.apply(this); this.xmlHttp = util.trys(function(){ return new XMLHttpRequest(); }, function(){ return new ActiveXObject("Msxml2.XMLHTTP"); }, function(){ return new ActiveXObject("Microsoft.XMLHTTP"); }) || null; this.encoding = "UTF-8"; }, open : function(url, method, async, user, password){ this.url = url; this.method = (method || "POST").toUpperCase(); this.async = async !== undefined ? async : true; this.user = user || null; this.password = password || null; this.requestHeaders= {}; if(this.method == "POST") this.setHeader("Content-Type", "application/x-www-form-urlencoded; charset=" + this.encoding); }, setHeader : function(header, value){ this.requestHeaders[header] = value; }, setHeaders : function(headers){ Object.extend(this.requestHeaders, headers); }, send : function(params){ params = util.param(util.extend(util.clone(params),{ _:'' })); var runtime = this; this.url += this.method == "GET" ? (this.url.indexOf('?') > -1 ? '&' : '?') + params : ''; this.xmlHttp.open(this.method, this.url, this.async, this.user, this.password); if(this.async) this.xmlHttp.onreadystatechange = function(){ runtime.onreadystatechange(runtime); }; for(var header in this.requestHeaders) this.xmlHttp.setRequestHeader(header, this.requestHeaders[header]); this.xmlHttp.send(this.method == "POST" ? params : null); if(!this.async) this.onreadystatechange(runtime); }, abort : function(){ this.xmlHttp.abort(); }, onreadystatechange : function(runtime){ runtime.notifyEvent("request", runtime.xmlHttp.readyState); if(runtime.xmlHttp.readyState == 4) runtime.notifyEvent(runtime.xmlHttp.status == 200 ? "success" : "failure", new zz.ajax.Response(runtime.xmlHttp)); } }), /* get Function */ get : function(conf,method){ var cf = util.extend(util.clone({ url:"", data:null, async:true, user:null, password:null, request:util.fnEmpty, success:util.fnEmpty, failure:util.fnEmpty }),conf); var ajax = new zz.ajax.Request(); ajax.open(cf.url, method || "GET", cf.async, cf.user, cf.password); ajax.addListener("request",cf.request); ajax.addListener("success",cf.success); ajax.addListener("failure",cf.failure); ajax.send(cf.data); return ajax; }, /* post Function */ post : function(conf){ return zz.ajax.get(conf, "POST"); } } })(this); 图形类 class org.zhuozhuo.graphics(string || element || zhuozhuo.element.) 构造包装画图区域节点 属性 zhuozhuo.element. element 画板对象 string originalHTML 画板节点原来的html内容 int cx 偏移x int cy 偏移y int width 画板宽度 int height 画板高度 int pen.x 画笔x坐标 int pen.y 画笔y坐标 int pen.size 画笔大小 string pen.color 画笔颜色 float pen.alpha 画笔透明度0-1 string pen.font 文字颜色 object canvas canvas 画板 object vml vml画板 方法 void setPen(object) 设置画笔 {} 属性请参考 this.pen int getCurrentCX(x) 获取当前偏移x this.cx+x int getCurrentCY(y) 获取当前偏移y this.cy+y object getPen() 获取画笔 void clear() 清空画板 void fillRect(x,y,w,h) 填充区域 void drawArc(x, y, radius, startAngle, endAngle) 画圆 void drawDot(x, y) 画点 void drawLine(x1,y1,x2,y2) 画线 void drawRect(x,y,width,height) 画矩形 void drawOval(x,y,width,height) 画椭圆 void lineTo(x,y) 画线到制定坐标 void moveTo(x,y) 移动画笔到指定坐标 void drawPolygon(xpoints,ypoints) 画多边形 void drawString(str,x,y) 写字 class org.zhuozhuo.graphics3d extends org.zhuozhuo.graphics 3d图形类 属性 array transform3d 3d元素数组 3d世界 方法 int add3dDot(x,y,z) 添加3d点 返回新添加的点 索引 0开始 int add3dLine(x,y,z) 添加3d线 返回新增加的点 索引 object add3dCube(x,y,z,width,height,length) 添加3d立方体 返回新增加的立方体索引 {begin,end} void show3d(d) 显示transform3d内容投影 P2D translate2d(P3D,D) 投影到2d void rotationx(r[,object]) 旋转元素 不指定为旋转全部 void rotationy(r[,object]) 旋转元素 不指定为旋转全部 void rotationz(r[,object]) 旋转元素 不指定为旋转全部 < pre lang="javascript" line="1" file="org_zhuozhuo_graphics.js" colla="-"> /* * To change this template, choose Tools | Templates * and open the template in the editor. / var Graphics = Class({ initialize : function(element){ Graphics.superclass.initialize.apply(this, arguments); var p = element.getOffsets(); var d = element.getDimensions(); this._oldhtml = element.innerHTML; this._element = element; this._cx = 0; this._cy = 0; this._width = d.width; this._height= d.height; this._pen = { x : 0, y : 0, size : 1, color: "#000", alpha: 1, font : "normal 12px normal" }; //canvas var canvas = document.createElement("canvas"); if(canvas.getContext){ canvas.width = this._width; canvas.height= this._height; this._element.appendChild(canvas); this._canvas = canvas.getContext("2d"); this.setPen(this._pen); return; } //vml if(ZHUOZHUO.BrowserKernel.Trident){ document.namespaces.add("vml","urn:schemas-microsoft-com:vml"); document.createStyleSheet().addRule(".vml","behavior:url(#default#VML);display:inline-block"); this._vml = $(document.createElement("vml:group")).setAttr({ style : "position:relative;width:"+this._width+"px;height:"+this._height+"px", coordsize: this._width+','+this._height, className: "vml" }); this._element.appendChild(this._vml); this.setPen(this._pen); return; } //div this._cx = p.left; this._cy = p.top; this.setPen(this._pen); }, _getX : function(x){ return this._cx + x; }, _getY : function(y){ return this._cy + y; }, //设置画笔 setPen : function(pen){ if(this._canvas){ this._canvas.fillStyle = pen.color || this._pen.color; this._canvas.strokeStyle= pen.color || this._pen.color; this._canvas.globalAlpha= pen.alpha || this._pen.alpha; this._canvas.lineWidth = pen.size || this._pen.size; this._canvas.moveTo(pen.x || this._pen.x, pen.y || this._pen.y); } Object.extend(this._pen,pen); }, getPen : function(){ return this._pen; }, //填充区域 fillRect : function(x,y,w,h){ if(this._canvas){ this._canvas.fillRect(x,y,w,h); return; } if(this._vml){ var fill = $(document.createElement('vml:fill')).setAttr({ opacity : this._pen.alpha, className: "vml" }); var rect = $(document.createElement('vml:rect')).setAttr({ className: "vml", stroked : "False", fillcolor:this.Pen.color, style : "top:"+y+"px;left:"+x+"px;width:"+w+"px;height:"+h+"px" }); rect.appendChild(fill); this._vml.appendChild(rect); return; } var div = $(document.createElement("DIV")); this._element.appendChild(div); div.setStyle({ backgroundColor:this._pen.color, position: "absolute", overflow: "hidden", opacity : this._pen.alpha, left : this._getX(x)+"px", top : this._getY(y)+"px", width : w+"px", height: h+"px" }); }, clearAll : function(){ if(this._canvas){ this._canvas.clearRect(0,0,this._width,this._height); return; } if(this._vml){ this._vml.innerHTML = ''; return; } this._element.innerHTML = ''; }, drawArc : function(x, y, radius, startAngle, endAngle){ if(this._canvas){ this._canvas.beginPath(); this._canvas.arc(x, y, radius, startAngle, endAngle, false); this._canvas.stroke(); this.moveTo(x+radiusMath.cos(endAngle), y+radiusMath.sin(endAngle)); return; } if(this._vml){ this.moveTo(x+radiusMath.cos(endAngle), y+radiusMath.sin(endAngle)); startAngle= startAngle+Math.PI/2; endAngle = endAngle+Math.PI/2; startAngle= 360/Math.PI/2startAngle; endAngle = 360/Math.PI/2endAngle; if(startAngle>360)startAngle -= 360; if(endAngle>360)endAngle -= 360; if(startAngle==endAngle){ startAngle=0; endAngle=360; } var stroke = $(document.createElement('vml:stroke')).setAttr({ opacity:this.Pen.alpha, color:this.Pen.color, weight:this.Pen.size+'px', className:"vml" }); var fill = $(document.createElement('vml:fill')).setAttr({ className:"vml", on:"False" }); var arc = $(document.createElement('vml:arc')).setAttr({ style:"top:"+y-radius+"px;left:"+x-radius+"px;width:"+radius2+"px;height:"+radius2+"px", className:"vml", startangle:startAngle, endangle:endAngle }); arc.appendChild(stroke); arc.appendChild(fill); this._vml.appendChild(arc); return; } var iMax=(endAngle>startAngle)? endAngle-startAngle : Math.PI2-startAngle+endAngle; var step=2/(Math.sqrt(radiusradiusMath.PI)/this._pen.size*0.57*2); if(endAngle>startAngle) for(var i=startAngle;i<=endAngle;i+=step) this.drawDot(x+radius*Math.cos(i),y+radius*Math.sin(i)); else{ for(i=startAngle;i<=Math.PI*2;i+=step) this.drawDot(x+radius*Math.cos(i),y+radius*Math.sin(i)); for(i=0;i<=endAngle;i+=step) this.drawDot(x+radius*Math.cos(i),y+radius*Math.sin(i)); } }, drawDot : function(x,y){ this.fillRect(x-(this._pen.size/2),y-(this._pen.size/2),this._pen.size,this._pen.size); this.moveTo(x,y); }, drawLine : function(x1,y1,x2,y2){ if(this._canvas){ this._canvas.beginPath(); this._canvas.moveTo(x1, y1); this._canvas.lineTo(x2, y2); this._canvas.stroke(); this.moveTo(x2, y2); return; } if(this._vml){ var stroke = $(document.createElement('vml:stroke')).setAttr({ opacity: this._pen.alpha, color : this._pen.color, weight : this._pen.size+'px', className:"vml" }); var line = $(document.createElement('vml:line')).setAttr({ from:parseInt(x1)+','+parseInt(y1), to:parseInt(x2)+','+parseInt(y2), className:"vml", style:"left:"+parseInt(x1<x2 ? x1:x2)+"px;top:"+parseInt(y1<y2 ? y1:y2)+"px" }); line.appendChild(stroke); this._vml.appendChild(line); this.moveTo(x2, y2); return; } var r = Math.floor(Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1))); var tan = Math.atan((y2-y1)/(x2-x1)); if((x2-x1)<0)tan+=Math.PI; var dx = Math.cos(tan); var dy = Math.sin(tan); if(x1==x2 || y1==y2){ var w= x1==x2 ? this.Pen.size:x2-x1; var h= y1==y2 ? this.Pen.size:y2-y1; (x2<x1 || y2<y1)? this.fillRect(x2,y2,w,h):this.fillRect(x1,y1,w,h); this.moveTo(x2,y2); return; } for(var i=0;i<r;i+=this._pen.size)this.drawDot(x1+i*dx,y1+i*dy); }, drawRect : function(x,y,width,height){ if(this._canvas){ this._canvas.strokeRect(x, y, width, height); return; } if(this._vml){ var stroke = $(document.createElement('vml:stroke')).setAttr({ opacity:this.Pen.alpha, color:this.Pen.color, weight:this.Pen.size+'px', className:"vml" }); var fill = $(document.createElement('vml:fill')).setAttr({ on:'False', className:"vml" }); var rect = $(document.createElement('vml:rect')).setAttr({ style : "top:"+y+"px;left:"+x+"px;width:"+width+"px;height:+"+height+"px", className:"vml" }); rect.appendChild(stroke); rect.appendChild(fill); this._vml.appendChild(rect); return; } var size = this._pen.size/2; this.fillRect(x-size,y-size,this.Pen.size,height); this.fillRect(x-size,y-size,width,this.Pen.size); this.fillRect(x-size+width,y-size,this.Pen.size,height); this.fillRect(x-size,y-size+height,width+this.Pen.size,this.Pen.size); }, drawOval : function(x,y,width,height){ if(this._vml){ var stroke = $(document.createElement("vml:stroke")).setAttr({ opacity: this._pen.alpha, color : this._pen.color, weight : this._pen.size+'px' }).addClass("vml"); var fill = $(document.createElement("vml:fill")).setAttr("on","False").addClass("vml"); var arc = $(document.createElement("vml:oval")).setAttr({ style : "top:"+y+"px;left:"+x+"px;width:"+width+"px;height:"+height+"px" }); arc.className = "vml"; arc.appendChild(stroke); arc.appendChild(fill); this._vml.appendChild(arc); return; } var iMax=2*Math.PI,w=width/2,h=height/2; if(w==h){ this.drawArc(x+w,y+h,w,0,iMax); return; } x+=w,y+=h; var step=2/(Math.sqrt(w*h)*2/this._pen.size*Math.abs(w/h)); for(var i=0;i<iMax;i+=step) this.drawDot(x+w*Math.cos(i),y+h*Math.sin(i)); }, lineTo : function(x,y){ this.drawLine(this._pen.x,this._pen.y,x,y); }, moveTo : function(x,y){ this.setPen({ x:x, y:y }); }, drawPolygon : function(xpoints,ypoints){ var length=Math.min(xpoints.length,ypoints.length); for(var i=1;i<length;i++) this.drawLine(xpoints[i-1],ypoints[i-1],xpoints[i],ypoints[i]); this.drawLine(xpoints[i-1],ypoints[i-1],xpoints[0],ypoints[0]); }, drawString : function(str,x,y){ var _x=0,_y=0; if(this._CANVAS){ this._CANVAS.font = this.Pen.font; var _this = this; if($Try(function(){ _this._CANVAS.fillText(str,x,y); return true })){ return; }else{ var Offsets = this._CASE.getPositionedOffsets(); _x = Offsets.left; _y = Offsets.top; } } if(this._VML){ var textbox= $(document.createElement('vml:textbox')).addClassName('vml').setStyle({ position:'absolute', color:this.Pen.color, font:this.Pen.font, left:x+'px', top:y-(/(\d{1,3})/.exec(this.Pen.font))[1]+3+'px' }).setInnerText(str); this._VML.appendChildExt(textbox); return; } this._CASE.appendChildExt($(document.createElement("DIV")).setStyle({ position:"absolute", left:this._getX(x)+_x+"px", top:this._getY(y)+_y-(/(\d{1,3})/.exec(this.Pen.font))[1]+3+"px", color:this.Pen.color, font:this.Pen.font }).setInnerHTML(str)); }, finalize : function(){ this._element.innerHTML = this._oldhtml; AutoTop.superclass.finalize.apply(this); } }); /* Browser Compatibility */ if (!Array.prototype.map) Array.prototype.map = function(fn, self) { for (var i = 0, results = new Array(this.length), length = this.length; i < length; i++) results[i] = fn.call(self, this[i], i, this); return results; }; if (!String.prototype.trim) String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, ''); }; /* joop Framework */ window.joop = joop = (function(win) { function entry(ifo) { if (arguments.length > 1) { for (var i = 0, elements = [], length = arguments.length; i < length; i++) elements.push(entry(arguments[i])); return elements; } return isFunction(ifo) ? entry.ready(ifo) : entry.getById(ifo); } function namespace(ns) { var parts = ns.split('.'), obj = win; for (var i = 0; i < parts.length; i++) obj = obj[parts[i]] = obj[parts[i]] || {}; return obj; } function extend(dst) { for (var i = 1, length = arguments.length; i < length; i++) for (var property in arguments[i]) dst[property] = arguments[i][property]; return dst; } function jclass() { var bclass, bproto = {}, proto = {initialize: function() { }}; function nclass() { this.initialize.apply(this, arguments); } for (var i = 0, length = arguments.length; i < length; i++) { var methods = arguments[i]; if (isFunction(methods)) { bclass = function() { }; bclass.prototype = methods.prototype; methods = new bclass; extend(bproto, methods); } extend(proto, methods); } nclass.prototype = proto; nclass.parent = bproto; return nclass; } function isFunction(object) { return typeof object === 'function'; } function isString(object) { return typeof object === 'string'; } function isNumber(object) { return typeof object === 'number'; } function toArray(iterable) { if (!iterable) return []; if ("toArray" in iterable) return iterable.toArray(); var length = iterable.length || 0, results = new Array(length); while (length--) results[length] = iterable[length]; return results; } function ready() { var queue = [], loaded = 0, onload = window.onload || function() { }; function init() { if (loaded) return; loaded = 1; for (var i = 0, length = queue.length; i < length; i++) queue[i](entry); } function delay() { /loaded|complete/.test(document.readyState) ? init() : setTimeout(delay, 0); } window.attachEvent ? window.attachEvent('onload', init) : window.addEventListener('load', init, false); if (document.addEventListener) document.addEventListener('DOMContentLoaded', init, false); window.onload = function() { onload(); init(); }; delay(); return function(fn) { loaded ? fn(entry) : queue.push(fn); }; } function getById() { if (arguments.length > 1) { for (var i = 0, elements = [], length = arguments.length; i < length; i++) elements.push(getById(arguments[i])); return elements; } return wrapper(isString(arguments[0]) ? document.getElementById(arguments[0]) : arguments[0]); } function getBySelector(selectors) { return wrapper(document).querySelector(selectors); } function wrapper(element) { if (!element || isFunction(element) || element._element || element.initialize) return element; var wrapClass, object; if (element === window) { wrapClass = Element.Window; } else if (element === document) { wrapClass = Element.Document; } else if (element.nodeType !== 1) { return element; } else { wrapClass = Element['tag' + element.tagName.toUpperCase()] || Element; } wrapper.cache = wrapper.cache || []; for (var i = 0, length = wrapper.cache.length; i < length; i++) if (wrapper.cache[i]._element === element) return wrapper.cache[i]; object = new wrapClass(element); wrapper.cache.push(object); return object; } var Base = jclass({}); var Listener = jclass(Base, { initialize: function() { Listener.parent.initialize.apply(this, arguments); this._eventQueue = []; }, addEvent: function(name, handler) { for (var i = 0, length = this._eventQueue.length; i < length; i++) if (this._eventQueue.name === name && this._eventQueue[i].handler === handler) return this; this._eventQueue.push({name: name, handler: handler}); return this; }, removeEvent: function(name, handler) { for (var i = 0, length = this._eventQueue.length; i < length; i++) if (this._eventQueue[i].name === name && this._eventQueue[i].handler === handler) { this._eventQueue[i] = this._eventQueue[i].name = this._eventQueue[i].handler = null; this._eventQueue.splice(i, 1); return this; } return this; }, fireEvent: function(name, object) { for (var i = 0, length = this._eventQueue.length; i < length; i++) if (this._eventQueue[i].name === name) this._eventQueue[i].handler(object); return this; } }); var ElEvent = jclass(Base, { initialize: function(event) { ElEvent.parent.initialize.apply(this, arguments); this.event = event; this.altKey = event.altKey; this.clientX = event.clientX; this.clientY = event.clientY; this.ctrlKey = event.ctrlKey; this.keyCode = event.keyCode; this.screenX = event.screenX; this.screenY = event.screenY; this.layerX = event.offsetX || event.layerX; this.layerY = event.offsetY || event.layerY; this.shiftKey = event.shiftKey; this.detail = event.detail ? event.detail > 0 ? 1 : -1 : event.wheelDelta > 0 ? -1 : 1; this.target = event.srcElement || event.target; this.type = event.type; this.relatedTarget = event.fromElement || event.relatedTarget; this.currentTarget = event.toElement || event.currentTarget; }, stopPropagation: function() { var event = this.event; event.stopPropagation ? event.stopPropagation() : event.cancelBubble = true; return this; }, preventDefault: function() { var event = this.event; event.preventDefault ? event.preventDefault() : event.returnValue = false; return this; }, getTarget: function() { var node = this.target, type = this.type; var currentTarget = this.currentTarget; if ((currentTarget && currentTarget.tagName) && (type === "load" || type === "error" || (type === "click" && currentTarget.tagName.toLowerCase() === "input" && currentTarget.type === "radio"))) node = currentTarget; if (node.nodeType === 3) node = node.parentNode; return wrapperElement(node); } }); var Element = jclass(Listener, { initialize: function(element) { Element.parent.initialize.apply(this, arguments); this._element = element; }, addEvent: function(name, handler) { var self = this; var processor = { handler: handler, callback: function(event) { handler.call(self, new ElEvent(event)); } }; for (var i = 0, length = this._eventQueue.length; i < length; i++) if (this._eventQueue[i].name === name && this._eventQueue[i].processor.handler === processor.handler) return this; this._eventQueue.push({ name: name, processor: processor }); var element = this._element; element.attachEvent ? element.attachEvent('on' + name, processor.callback) : element.addEventListener(name, processor.callback, false); return this; }, removeEvent: function(name, handler) { for (var i = 0, length = this._eventQueue.length; i < length; i++) if (this._eventQueue[i].name === name && this._eventQueue[i].processor.handler === handler) { this._element.detachEvent ? this._element.detachEvent("on" + name, this._eventQueue[i].processor.callback) : this._element.removeEventListener(name, this._eventQueue[i].processor.callback, false); this._eventQueue[i] = this._eventQueue[i].name = this._eventQueue[i].processor = this._eventQueue[i].processor.handler = this._eventQueue[i].processor.callback = null; this._eventQueue.splice(i, 1); return this; } return this; }, fireEvent: function(name) { var element = this._element; if (element.fireEvent) { element.fireEvent("on" + name); } else { var ev = document.createEvent("HTMLEvents"); ev.initEvent(name, false, true); element.dispatchEvent(ev); } return this; }, querySelector: function(selectors) { var elements = document.querySelector ? toArray(this._element.querySelectorAll(selectors)) : document.evaluate ? _querySelectorAllByXPath(selectors) : _querySelectorAllByJavaScript(selectors); for (var i = 0, length = elements.length; i < length; i++) elements[i] = wrapper(elements[i]); return elements; function _querySelectorAllByXPath(selectors) { return _querySelectorAllByJavaScript(selectors); } function _querySelectorAllByJavaScript(selectors) { return []; } }, setText: function(value) { var element = this._element; element.innerHTML = ''; element.innerText ? element.innerText = value : element.appendChild(document.createTextNode(value)); return this; }, getText: function() { var element = this._element; if (element.innerText) return element.innerText; var value = undefined; try { value = element.textContent; } catch (e) { } return value || element.innerHTML.replace(/<[^<>]*>/g, '').replace(" ", ' ').replace("<", '<').replace(">", '>').replace("&", '&').replace(""", '"'); } }); Element.Window = jclass(Element, {}); Element.Document = jclass(Element, {}); Element.tagFORM = jclass(Element, {}); return extend(entry, { version: 20131005, namespace: namespace, extend: extend, jclass: jclass, isFunction: isFunction, isString: isString, isNumber: isNumber, toArray: toArray, ready: ready(), getById: getById, getBySelector: getBySelector, wrapper: wrapper, Base: Base, Listener: Listener, ElEvent: ElEvent, Element: Element }); })(window);
/* 名称:调色版 制作:石卓林 QQ:383193853 url:http://www.my586.com mail:szl1982szl@163.com 时间:2005/06/02 22:54 使用说明: 用事件调用 select_color(\'需要设置的属性1|需要设置的属性2|需要设置的属性3\') 例: onClick="javascript:select_color('this.document.all.text0.value|this.document.all.text1.value') */ function color_select(){ var Num16_str = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');//十六进制字符串 var Num16;//用于包存十六进制的颜色 var i_1,i_2,i_3;//定义六个的变量用于保存十六进制数 var i=3;//定义颜色步进不可修改 var num=0; var w = 16;//定义单元格宽度 var h = 16;//定义单元格高度 var html = ''; html += ' '; ColorCode '; html += 'JC调色板Ver1.0 '; html += ' '; html += ' '; html += ' '; html += ''; //定义输出 for(i_1=0;i_1<16;i_1+=i){ for(i_2=0;i_2<16;i_2+=i){ for(i_3=0;i_3<16;i_3+=i){ //生成十六进制颜色代码 Num16 = '#' + Num16_str[i_1] + Num16_str[i_1] + Num16_str[i_2] + Num16_str[i_2] + Num16_str[i_3] + Num16_str[i_3]; Num16 = ' ' if(num % 18 == 0){ html += ' ' + Num16; }else{ html += Num16; } num++; } } } html += ' '; html += ' '; return html; } function select_yes(str){ this.document.all.color_Layer_1.style.visibility = 'hidden';//隐藏取色器 if(str!=false){ object_str = object_str.split('|');//设置要赋值的属性 for(var i=0;i<str.length;i++){ eval(object_str[i]+'= str');//赋值给预定对象 } } } function select_color(name){ if(name ==null){ alert('调用select_color错误\n正确格式\nselect_color(\'需要设置的属性1|需要设置的属性2|需要设置的属性3\')\n例:\nonClick="javascript:select_color(\'this.document.all.text.value\')');//错误提示信息 }else{ if(select_color_ok != true){//判断是否第一次启动取色器 this.document.all.color_Layer_1.innerHTML = color_select();//让取色器根据对象id显示新的内容 select_color_ok = true;//设置已经使用的标志 } this.document.all.color_Layer_1.style.posTop=event.clientY+this.document.body.scrollTop;//设置y坐标 this.document.all.color_Layer_1.style.posLeft=event.clientX+this.document.body.scrollLeft;//设置x坐标 this.document.all.color_Layer_1.style.visibility = '';//显示取色器 object_str = name;//设置取值对象 } } //写代码显示层 this.document.write(' '); var select_color_ok = false;//初始化使用标志 var object_str;//设置变量用于保存目标值属性的字符串
不需要词库，直接分割网页内容提取词语.并且计算词语出现次数按照从多到少排序, 这里能区分中英文词语,最开始用于广告匹配数据预处理.用js在访客客户端执行