Javascript链式写法,面向对象,Ajax的原理(一)
<html><head> <title>JavaScript</title> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /> <meta http-equiv="Access-Control-Allow-Origin" content="*" /> <script type="text/javascript"> function jQueryOBJ(elem) { this.elem = elem; } jQueryOBJ.prototype = { css : function(key, value) { this.elem.style = value; return this; }, hide:function() { this.elem.style["display"] = "none"; return this; }, show:function() { this.elem.style["display"] = "block"; return this; }, attr:function(key) { return this.elem; } } var $$ = function(idString) { var elem = document.getElementById(idString); var JOB = new jQueryOBJ(elem); return JOB; } function init() { $$("ok").css("border", "2px red solid").show(); //alert($$("ok").attr("id")); } </script> <!-- OO --> <script type="text/javascript"> var StringTools = new Object; StringTools._strings = new Array(); StringTools.append = function (str) { this._strings.push(str); return this; }; StringTools.toString = function () { return this._strings.join(""); }; var result = StringTools.append("hello ").append("world!").toString(); //alert(result); </script> <script type="text/javascript"> var doFun = new Function ("iNum","alert(iNum+10)"); //doFun(10); function callAnotherFunc(fnFunction, vArgument) { fnFunction(vArgument); } //callAnotherFunc(doFun, 20); </script></head><body> <br /><br /><br /><br /> <input type="button" value="show" /> <br /> <div id="ok" style="display:none;">fuck world!</div> <div id="myDiv">12</div> <!-- Ajax --> <script type="text/javascript"> var xmlhttp; if(window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest(); }else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function(){ if (xmlhttp.readyState==4 && (xmlhttp.status == 0 || xmlhttp.status == 200)){ document.getElementById("myDiv").innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET","test1.txt",true); xmlhttp.send(); </script></body></html>
页:
[1]