- 浏览: 6318 次
- 性别:
- 来自: 杭州
最新评论
-
husttianwang:
babydeed 写道你的摘自 js设计模式一书 呵呵恩,我 ...
在Javascript中模仿接口(一) -
babydeed:
你的摘自 js设计模式一书 呵呵
在Javascript中模仿接口(一) -
mfkvfn:
不就是settter方法最后return this;么?说得那 ...
如何设计一个支持方法链式调用的JavaScript库 -
dayang2001911:
学习了
javascript链式调用的实现方式
/** * ☆★☆★☆★☆★☆★☆JavaScript草稿集☆★☆★☆★☆★☆★☆ * * By husttianwang*/ //★JQuery★<!--<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>//--> //★★★★★★★★公共部分★★★★★★★★ function printf(obj) { document.write(obj + "<br />"); } function $(obj) { return document.getElementById(obj); } function forEach(obj) { for (m in obj) { printf(m + ':' + obj[m]); } } //★★★★★★★★注释方式★★★★★★★★★ /** * //<![CDATA[ * * //]]> */ /* //★★★★★★★★alertBox★★★★★★★★ function alertBox() { "use strict"; var coverLayer = document.createElement("div"); var contentLayer = document.createElement("div"); coverLayer.setAttribute("id", "coverLayer"); contentLayer.setAttribute("id", "contentLayer"); contentLayer.innerHTML = "<p style='text-align:center; color:white; font-size:40px;'>Huazhong University Of Science And Technology</p>"; document.body.appendChild(coverLayer); document.body.appendChild(contentLayer); } window.onload = alertBox; */ /* //★★★★★★★★基本数据类型★★★★★★★★ var x = parseFloat("20.33"); var y = parseInt("11", 8); var z = Math.sin(Math.PI / 2); var s = "this is a string."; var a = [1, 2, 4, 3]; var o = {first: 1, second: 2, third: 3}; var result = o.valueOf(); printf(result + "<br />"); printf(1 + "2" + "<br />"); //12 printf((a instanceof Array) + "<br />"); printf((a.constructor) + "<br />"); printf(o.hasOwnProperty("first") + "<br />"); */ /* //★★★★★★★★arguments数组★★★★★★★★ function plus(x, y, z) { //"use strict"; if (arguments.length !== 3) { throw new Error(arguments.callee); } return x + y + z; } //plus(2, 3); //printf(plus(2, 3, 4)); var cal = { x: 1, y: 2, f: function () { //"use strict"; return this.x + this.y; } }; printf(cal.f() + "<br />"); //★★★★★★★★函数call和apply★★★★★★★★ function fCall(x, y) { return x + y; } var res = fCall.call(cal, 1, 2); var res1 = fCall.apply(cal,[6, 9]); printf(res + "<br />"); printf(res1 + "<br />"); //★★★★★★★★类和继承★★★★★★★★ function people(name, age, sex) { this.name = name; this.age = age; this.sex = sex; } people.prototype.info = function () { printf("My name is " + this.name + ", I'm " + this.age + " years old." + "<br />"); } var humen = new people("Lijing", 19, "man"); humen.info(); */ /* //★★★★★★★★IE4 && IE5 没有apply函数,利用prototype来构造这样的原型函数★★★★★★★★ if (!Function.prototype.apply) { Function.prototype.apply = function (object, parameters) { var f = this; var o = object || window; var args = patameters || []; o._$_apply_$_ = f; var stringArgs = []; for (var i = 0; i < args.length; i++) { stringArgs[i] = "args[" + i + "]"; } var arglist = stringArgs.join(","); var methodcall = "o._$_apply_$_(" + arglist + ");"; var result = eval(methodcall); delete o._$_apply_$_; return result; }; } */ /* // ★★★★★★★★类属性,类方法,类私有成员,子类与超类★★★★★★★★ function Rectangle(width, height) { this.width = width; this.height = height; } Rectangle.prototype.area = function () { return this.width * this.height; } function PositionRectangle(x, y, w, h) { Rectangle.call(this, w, h); this.x = x; this.y = y; } PositionRectangle.prototype = new Rectangle(); delete PositionRectangle.prototype.width; delete PositionRectangle.prototype.height; PositionRectangle.prototype.constructor = PositionRectangle; var r = new PositionRectangle(2, 2, 2, 2); printf(r.area()); printf(r instanceof PositionRectangle && r instanceof Rectangle && r instanceof Object); //注:可以使用call和apply来调用被覆盖的函数 //such as: Circle.prototype.toString.apply(this); //★★★★★★★★非继承的扩展★★★★★★★★ function borrowMethods(borrowFrom, addTo) { var from = borrowFrom.prototype; var to = addTo.prototype; for (m in from) { if (from[m] != "function") continue; to[m] = from[m]; } } */ //★★★★★★★★确定对象类型★★★★★★★★ /* △ typeof null → "object"; typeof undefined → "undefined"; typeof 数组 → "object"; typeof 函数 → "function" △ instanceof 和构造函数 constructor 【特点:他们只能允许根据已经知道的类来进行测试对象,无法用于检查未知的对象】 △ 用Object.toString()测试对象的类型 △ 鸭子类型识别(Duck Typing) */ //★★★★★★★★渐变效果★★★★★★★★ /* function setOpacity(obj, val) { if (document.documentElement.filters){ obj.style.filter = "alpha(opacity=" + val + ")"; }else { obj.style.opacity = val / 100; } } function fadeIn(obj) { var val = 10; var t = setInterval(function(){ if (val >= 100) { clearInterval(t); } setOpacity(obj, val); val += 10; }, 250); } ★★ fadeIn($("changeBox")); function setWidth(obj, val) { obj.style.width = parseInt(val) + "px"; } function setHeight(obj, val) { obj.style.height = parseInt(val) + "px"; } function slide(obj) { var val = 0; var t = setInterval(function(){ if (val >= 300) { clearInterval(t); } setWidth(obj, val); setHeight(obj, val); val += 10; }, 80); } ★★ slide($("changeBox")); function setTop(obj, val) { obj.style.top = parseInt(val) + "px"; } function setLeft(obj, val) { obj.style.left = parseInt(val) + "px"; } function move(obj) { var val = 0; var t = setInterval(function(){ if (val >= 300) { clearInterval(t); } setTop(obj, val); setLeft(obj, val); val += 10; }, 80); } ★★ move($("changeBox")); */ //★★★★★★★★正则表达式★★★★★★★★ //正则表达式中的特殊符号有 ^ $ . * + ? = ! | \ / () [] {} /**|------------------------------------------------------------ * | [...] 括号内任意字符 * | [^...] 非上 * | . 除换行符和其他Unicode行终止符之外的任意字符 * | \w 任何ASCII单字字符 * | \W 非上 * | \s 任何Unicode空白 * | \S 非上 * | \d 任何ASCII数字,等价于[0-9] * | \D 非上 * | \b 匹配一个词语的边界 * | \B 非上 * | {n, m} 匹配至少 n 至多 m 次 * | {n,} 匹配至少 n 次 * | {n} 匹配恰好 n 次 * | ? 匹配前一项0或1次 * | + 匹配前一项1次或多次 * | * 匹配前一项0次或多次 * | ^ 匹配字符串开头 * | $ 匹配字符串结尾 * | i 忽略大小写 * | g 全局匹配 * | m 多行匹配 * |------------------------------------------------------------- */ /* var text = "JavaScript is not Java, thanks god, that is true! Java is not Javascript!!"; var url = "http://www.baidu.com/pic.html" var Reg = /java/gi; var RegUrl = /(\w+):\/\/([\w.]+)\/(\S*)/; var res = url.match(RegUrl); //var res = text.replace(/Java/gi, "JAVA"); //var res = Reg.exec(text); //var res = Reg.test(text); printf(text); printf(res); */ //★★★★★★★★drag拖动★★★★★★★★ /* var box = document.getElementById("box"); var drag = { start: function(evt) { var e = window.event || evt; box.startX = e.clientX - box.offsetLeft; box.startY = e.clientY - box.offsetTop; document.onmousemove = drag.ondrag; document.addEventListener ? document.addEventListener("mouseup",drag.stop,false) : document.attachEvent("onmouseup",drag.stop); }, ondrag: function(evt) { var e = window.event || evt; with(box.style) { position = "absolute"; left = e.clientX - box.startX + "px"; top = e.clientY - box.startY + "px"; }; }, stop: function() { document.onmousemove = ""; document.detachEvent ? document.detachEvent("onmouseup",drag.start) : document.removeEventListener("mouseup",drag.start,false); }, init: function() { box.addEventListener ? box.addEventListener("mousedown",drag.start,false) : box.attachEvent("onmousedown",drag.start); } } drag.init(); */ //★★★★★★★★浏览器Location和History★★★★★★★★ //Location: protocol + host + pathname + search //printf(document.location == document.URL); //true //在大多数情况下,document.location和location.href是相同的,但是,当存在服务器重定向时, //document.location包含的是装载的URL,而location.href包含的则是原始请求的文档的URL /* |-------self, window | |-------navigator | |-------frames[] |------forms[]--------elments[]------options[] | | |-------location |------anchors[] | | |-------document--------|------links[] | | |-------history |------images[] | | |-------screen |------applets[] */ //for(m in navigator){printf(m + ":" + screen[m]);} /* printf(window.screenX); printf(window.screenY); printf(window.outerWidth); printf(window.outerHeight); printf(window.innerWidth); printf(window.innerHeight); //以上属性IE7下没有 printf(""); printf(screen.width); printf(screen.height); printf(screen.availWidth); printf(screen.availHeight); */ /* //子窗口和父窗口的相互控制 function openWin() { childWin = window.open("javascript:'<h1>hello</h1>'", "newWin", "height=0,width=0"); var val = 0; var t = setInterval(function(){ if (val > 400){ clearInterval(t); } childWin.resizeTo(val,val); childWin.moveTo(val,val); val += 10; },100); childWin.opener.focus(); //childWin.opener.close(); } function closeWin() { childWin.close(); } document.onclick = openWin; document.onkeydown = closeWin; */ //★★★★★★★★ERROR提示★★★★★★★★ /* window.onerror = function (msg, url, line) { alert("Wow..my gosh!!! You got an error.\n\n" + "【Error】: " + msg + "\n【url】: " + url + "\n【line】: " + line); } */ //★★★★★★★★document★★★★★★★★ /* //帧结构演示 <html> <frameset cols="200,*"> <frame src="./gustbook.html"> <frame src="/gustbook.html" name="view_frame"> </frameset> </html> */ /* function w() { printf("something"); } setTimeout(w,1000); //覆盖原来的文本 //注:一个文档绝不应该从时间句柄中调用他自己的write()方法 */ /* ★document.open 功能:打开一个新文档,并擦除当前文档的内容。 语法:document.open(mimetype,replace) 参数: mimetype:可选。规定正在写的文档的类型。默认值是"text/html"。 replace:可选。当此参数设置后,可引起新文档从父文档继承历史条目。 注1:open()方法将擦除当前HTML文档的内容,开始一个新的文档,新文档用write()方法或writeln()方法编写。 注2:调用open()方法打开一个新文档并且用write()方法设置文档内容后,必须记住用close()方法关闭文档,并迫使其内容显示出来。 注3:属于被覆盖的文档的一部分的脚本或事件句柄不能调用该方法,因为脚本或事件句柄自身也会被覆盖。 ★document.close 功能:close()方法可关闭一个由open()方法打开的输出流,并显示选定的数据。 语法:document.close() 参数:无。 注:该方法将关闭open()方法打开的文档流,并强制地显示出所有缓存的输出内容。如果您使用write()方法动态地输出一个文档,必须记住当你这么做的时候要调用close()方法,以确保所有文档内容都能显示。 ★一旦调用了close(),就不应该再次调用write(),因为这会隐式地调用open()来擦除当前文档并开始一个新的文档。 */ //★★★★★★★★节点类型★★★★★★★★ /* |--------------------------------| | 接口 nodeType值 | |--------------------------------| | Element 1 | | Text 3 | | Document 9 | | Comment 8 | | DocumentFragment 11 | | Attr 2 | |--------------------------------| */ //★★★★★★★★document.documentElement★★★★★★★★ // 引用的是 html //appendChild(), insetBefore(), replaceChild() //可以用document.createDocumentFragment()来创建一个DocumentFragment /* function reverse(n) { var f = document.createDocumentFragment(); while (n.lastChild) f.appendChild(n.lastChild); n.appendChild(f); } */ //★★★★★★★★查询选定的文本★★★★★★★★ /* function getSelectedText() { if (window.getSelection) { return window.getSelection().toString(); }else if (document.getSelection) { return document.getSelection(); }else { return document.selection.createRange().text; } } function start() { var text = getSelectedText(); if (text) { //$("changeBox").innerHTML = text; window.open("http://www.baidu.com/s?wd=" + encodeURIComponent(text)); } } if (!document.all) { window.onmouseup = start; }else { document.attachEvent("onmouseup", start); } */ /* var o = $("changeBox"); printf(o.offsetTop); printf(o.offsetLeft); printf(o.clientWidth); printf(o.clientHeight); printf(o.scrollTop); printf(o.scrollLeft); printf(o.offsetWidth); printf(o.offsetHeight); */ /*★★★★★★★★Key Event and Mouse Event★★★★★★★★ //屏蔽右键菜单,可以应用到任何一个区域 //oncontextmenu="window.event.returnValue=false" document.onmousedown = function (e) { var e = window.event || e; if (e.button == 0) { document.body.style.background = "red"; }else if (e.button == 1) { document.body.style.background = "blue"; }else { document.body.style.background = "yellow"; } } document.onkeydown = function (e) { var e = window.event || e; if (e.shiftKey) { alert("shift"); }if (e.ctrlKey) { alert("ctrl"); }else if (e.altKey) { alert("alt"); }else { alert("others"); } } */ /* //★★★★★★★★合成事件★★★★★★★★ //Document.createEvent()创建, Event.initEvent(), UIEvent.initEvent(), MouseEvent.initEvent.initMouseEvent()初始化 //dipatchEvent方法来分派事件 //IE中,使用Document.createEventObjec来创建一个新的事件对象。然后使用目标元素的fireEvent()方法来分派他 var DataEvent = {}; DataEvent.send = function (target, datatype, data) { if (typeof target == "string") target = $(target); if (document.createEvent) { var e = createEvent("Events"); e.initEvent("dataavailable", true, false); }else if (document.createEventObject) { var e = document.createEventObject(); }else return; e.datatype = datatype; e.data = data; if (target.dispatchEvent) target.dispatchEvent(e); else if (target.fireEvent) target.fireEvent("ondataavailable", e); }; DataEvent.receive = function (target, handler) { if (typeof target == "string") target = $(target); if (target.addEventListener) target.addEventListener("dataavailable", handler, false); else if (target.attachEvent) target.attachEvent("ondataavaliable", handler); } */ //★★★★★★★★IE支持客户端永久性★★★★★★★★ /* var username = "hustskyking"; var password = "psw"; var memory = $("changeBox"); memory.style.behavior = "url('#default#userData')"; memory.setAttribute("username", username); memory.setAttribute("password", password); memory.save('myPersistentData'); var now = (new Date()).getTime(); var expires = now + 10*24*60*60*1000; memory.expires = (new Date(expires)).toUTCString(); */ /* var memory = $("changeBox"); memory.load("myPersistentData"); alert(memory.getAttribute("username")); */ /* //★★★★★★★★AJAX★★★★★★★★ function loadXMLDoc() { var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp. xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { $("changeBox").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET", "response.php?func=" + printf("Instead of origin HTML"), true); xmlhttp.send(); } window.onclick = loadXMLDoc; */ /* function createXHR() { var aVersions = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0"]; for (var i = 0; i < aVersions; i++) { try { var oXHR = new ActiveXObject(aVersions[i]); return oXHR; }catch(oError){ //不执行任何操作 } } throw new Error("MSXML is not installed."); } */ /* //在给src特性复制的同时会下载一个图像,这意味着甚至无需将该图像添加到页面中 //基于图像实现跨域通信 /** * 启动并连续向服务器发送骑牛的最佳方式是什么?在有些情况下,最好是从服务器与载入一些信息, * 以便能够快读相应用户的操;而在另外一些情况下,你可能想在不同的时间间隔内,向服务器发送 * 数据或者从服务器接收数据。 */ /* var oImg = document.createElement("img"); oImg.onload = function() { //alert("Image is ready"); } oImg.src = "./images/001.gif"; document.body.appendChild(oImg); function createIFrame(){ var oframe = document.createElement("iframe"); oframe.name = "myIFrame"; oframe.id = "myIFrame"; oframe.style.cssText = "height:500px; width:400px; border:none"; oframe.src = "http://jqueryui.com/demos/droppable/accepted-elements.html"; document.body.appendChild(oframe); } createIFrame(); */ /* //面向对象的Javascript //1.公共成员 function Customer() { this.firstName = "John"; this.lastName = "Smith"; this.getFullName = function () { return this.firstName + " " + this.lastName; } } var john = new Customer(); //2.私有变量 function Customer(firstName, lastName) { var _firstName = firstName; var _lastName = lastName; this.getFullName = function () {//闭包 return _firstName + " " + _lastName; } } //prototype属性 //扩展类的定义 //如果在prototype属性所引用的对象里没有找到,它会到这个引用对象的prototype属性里查找,如此递归查询。 Customer.prototype.getFullName = function () { return this.firstName + " " + this.lastName; } //面向对象编程和继承 function Partner() { this.partnerId = ""; } Partner.prototype = new Customer(); //与上等价 Partner.prototype = { firstName: "", lastName: "" } */ /* //★★★★★★★★Cookie★★★★★★★★ function setCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function getCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; } function deleteCookie(name) { setCookie(name,"",-1); } */
发表评论
-
在Javascript中模仿接口(一)
2012-09-22 12:27 1131在JavaScript中模仿接口——本文摘自《JavaS ... -
如何设计一个支持方法链式调用的JavaScript库
2012-09-18 09:37 1509废话不多说,代码摆出来,注释什么的都很清楚,如果看不很懂,请移 ... -
javascript链式调用的实现方式
2012-09-18 08:58 1313在我们所用到的库中 ... -
javascript的灵活性
2012-09-17 09:31 802如果你偏爱过程式编程,你可以这样: /* ... -
ajax请求管理
2012-09-16 01:01 810ajax请求管理——问题提出 Ajax应用程序 ...
相关推荐
2021秋一年级语文上册期末专项训练卷24文本积累提分卷新人教版
2015年九年级历史上册第15课血腥的资本积累课时训练新人教版
【文档标题】提到的是“中考语文总复习-专项复习资料-文言文词语积累素材-新人教版 (2)”,这是针对初中毕业生进行中考语文复习的一份专项资料,重点在于帮助学生积累文言文中的词汇和理解。在中考语文考试中,文言...
山东省日照市东港实验学校九年级历史上册《第15课 血腥的资本积累》课件 新人教版
湖南省长沙县路口镇麻林九年级历史上册《第15课 血腥的资本积累》教案 新人教版.doc
湖南省长沙市长郡雨花外国语学校九年级历史上册 第15课 血腥的资本积累参考资料 新人教版.doc
七年级语文语言积累与运用练习题【新人教版】精选.doc
【文档标题】提到的是“中考语文总复习-专项复习资料-文言文词语积累素材-新人教版 (1)”,这是一份针对初中毕业生进行中考语文复习的专门资料,主要聚焦于文言文词汇的学习与积累。在中考语文考试中,文言文是重要...
2021秋二年级语文上册第四单元积累与运用考点梳理卷新人教版
本次的学习内容聚焦于八年级语文下册第三单元的两首诗——《关雎》和《蒹葭》,主要涉及的是对这两首诗的积累运用和理解。 一、直接默写部分,这些题目旨在让学生熟记《关雎》和《蒹葭》中的经典诗句,如《关雎》中...
2020四年级语文下册积累运用与课文理解专项测试卷新人教版
七年级语文下册 宫崎骏名言背诵积累 新新人教PPT教案.pptx
【标题】和【描述】提及的是八年级语文下册第六单元的学习内容,主要涉及的是唐诗三首的积累运用和能力闯关,其中包括了对杜甫的《茅屋为秋风所破歌》和王维的《戏题盘石》等诗词的理解与鉴赏。 【标签】"资料"表明...
同时,他们会接到首个任务,通常是研究行业背景和数据,以积累影视行业的基础知识。导师和直属领导的初次谈话将帮助新人设定工作目标和态度,增强自信心。 第二周,新人开始深入工作,接受任务的监督。第二个任务会...
2020六年级语文下册积累运用与课文理解专项测试卷新人教版
新人教统编版六年级下册语文 7课 聪明在于学习,天才在于积累 教学课件.pptx 这堂课的主要内容是围绕华罗庚先生的故事,强调了学习和积累的重要性。华罗庚先生是一位中国著名的数学家,他的故事告诉我们,成功来自...
【文档标题】提到的是“中考语文总复习-专项复习资料-文言文词语积累素材-新人教版 (2)决战中考2021系列”,这是一个针对中考语文复习,特别是文言文部分的学习资料,旨在帮助学生积累文言词汇,提高应对中考的能力...
【标题解析】:“2021秋一年级语文上册第七单元积累与运用考点梳理卷新人教版”这个标题指的是针对2021年秋季学期,一年级语文教材上册第七单元的学习内容,进行了一次系统的积累与运用考点的梳理。这里的“新人教版...
(新人教版)九年级语文下册第一单元4海燕文段积累课件.ppt
五年级语文下册 积累运用与课文理解专项测试卷 新人教版-新人教版小学五年级下册语文试题.docx