zz: Javascript解析URL的方法
Javascript 的时间日期处理(可以取得精确的时间，到毫秒级)
Sep
17
今天继续看ajax。
以前写过一个ajax的聊天室，但是只能在IE下面运行。
今天写了一个全新的，在Firefox下面也运行正常了。
附上代码(PHP + Ajax)：
下载文件 (已下载 1090 次)
做一些笔记:
1. 考虑多浏览器的兼容性，在创建XMLHttpRequest对象的时候要多加处理
一般如下代码就OK了：
2. 不要直接把onreadystatechange事件绑定到一个匿名函数(Firefox貌似不兼容此方式)
一般使用如下代码：
3. 在提交post请求的时候用如下代码
4. 善用try-catch结构，捕捉运行时错误
使用try-catch结构可以捕捉到运行时的错误，不仅可以进行错误处理，而且也方便调试。比如：
5. 为每一个异步请求创建一个xmlHttpRequest对象。
这样可以避免多个请求之间的冲突问题，也没有必要创建一个队列。
可以把每个请求封装到一个函数里面，每次调用即可。
具体代码参见前面附件里面index.html中的update和talk函数。
6. encodeURI(String)和encodeURIComponent(String)函数
对URI编码，区别在于encodeURI把String当作一个URI来解析，
而encodeURIComponent把String当作URI中的一个部分来解析。
举个例子，对URI (http://a.com/test.php?a=哈哈)的编码结果为：
encodeURI: http://a.com/test.php?a=%E5%93%88%E5%93%88
encodeURIComponent: http%3A%2F%2Fa.com%2Ftest.php%3Fa%3D%E5%93%88%E5%93%88
所以在send函数里面应该使用encodeURIComponent函数。
对应这两个函数分别有decodeURI和decodeURIComponent这两个函数
另外还有个escape和unescape函数对不是很好使，具体的baidu一下，自己写个脚本测试一下就知道了。
7. setTimeout("code", Interval)和setInterval("code", Interval)函数
这两个函数的作用是在以毫秒为单位的Interval间隔之后运行一段由code指定的javascript代码。
区别在于 setTimeout只运行一次该代码， 而setInterval在每隔一段Interval指定的时间之后运行一次代码，
直到窗口关闭为止。对于setTimeout，要实现重复运行该代码，可以在code里面指定一个函数，函数里面再
运行一次setTimeout，这样可以动态修改函数运行时间；而setInterval的时间间隔是不能修改的。
8. 对于xmlHttpRequest对象取回的responseText，如果要显示在div这类元素内，可能需要对其进行html编码
编码函数如下：
转载请注明出自 ，如是转载文则注明原出处，谢谢:)
RSS订阅地址: https://www.felix021.com/blog/feed.php 。
以前写过一个ajax的聊天室，但是只能在IE下面运行。
今天写了一个全新的，在Firefox下面也运行正常了。
附上代码(PHP + Ajax)：
下载文件 (已下载 1090 次)做一些笔记:
1. 考虑多浏览器的兼容性，在创建XMLHttpRequest对象的时候要多加处理
一般如下代码就OK了：
function GetXMLHTTP()
{
var xmlHttp=null;
try{
try{ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }
catch(e1){ xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");}
}catch(e2){ xmlHttp=new XMLHttpRequest;}
return xmlHttp;
}
{
var xmlHttp=null;
try{
try{ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }
catch(e1){ xmlHttp = new ActiveXObject("MSXML2.XMLHTTP");}
}catch(e2){ xmlHttp=new XMLHttpRequest;}
return xmlHttp;
}
2. 不要直接把onreadystatechange事件绑定到一个匿名函数(Firefox貌似不兼容此方式)
一般使用如下代码：
//可以将以下代码放在一个函数里面
var handleStateChange = function (){
if(xml.readyState == 4){ //表示请求结束
if(xml.status == 200){ //HTTP状态200表示一切正常
//do something
}
else alert(xml.status);
}
}
try{
xml.onreadystatechange = handleStateChange;
xml.open("GET", url, true);
xml.send(null);
}catch(e){alert("Error: " + e);}
var handleStateChange = function (){
if(xml.readyState == 4){ //表示请求结束
if(xml.status == 200){ //HTTP状态200表示一切正常
//do something
}
else alert(xml.status);
}
}
try{
xml.onreadystatechange = handleStateChange;
xml.open("GET", url, true);
xml.send(null);
}catch(e){alert("Error: " + e);}
3. 在提交post请求的时候用如下代码
try{
var xml = getXmlHttpRequest();
var content = document.getElementById("content").value;
xml.onreadystatechange = handleStateChange;
xml.open("POST", url, true); // POST请求
//加上一个http头，表示提交一个POST请求，包含一个表单
xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
//使用encodeURIComponent()函数对表单内容进行URL编码，用&连接两个不同的表单元素值
xml.send("content="+encodeURIComponent(content)+"&name=felix021");
}catch(e){alert("Error:" + e);}
var xml = getXmlHttpRequest();
var content = document.getElementById("content").value;
xml.onreadystatechange = handleStateChange;
xml.open("POST", url, true); // POST请求
//加上一个http头，表示提交一个POST请求，包含一个表单
xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
//使用encodeURIComponent()函数对表单内容进行URL编码，用&连接两个不同的表单元素值
xml.send("content="+encodeURIComponent(content)+"&name=felix021");
}catch(e){alert("Error:" + e);}
4. 善用try-catch结构，捕捉运行时错误
使用try-catch结构可以捕捉到运行时的错误，不仅可以进行错误处理，而且也方便调试。比如：
try{
//do something
}catch(e){
//错误处理
alert(e); //显示错误信息
}
//do something
}catch(e){
//错误处理
alert(e); //显示错误信息
}
5. 为每一个异步请求创建一个xmlHttpRequest对象。
这样可以避免多个请求之间的冲突问题，也没有必要创建一个队列。
可以把每个请求封装到一个函数里面，每次调用即可。
具体代码参见前面附件里面index.html中的update和talk函数。
6. encodeURI(String)和encodeURIComponent(String)函数
对URI编码，区别在于encodeURI把String当作一个URI来解析，
而encodeURIComponent把String当作URI中的一个部分来解析。
举个例子，对URI (http://a.com/test.php?a=哈哈)的编码结果为：
encodeURI: http://a.com/test.php?a=%E5%93%88%E5%93%88
encodeURIComponent: http%3A%2F%2Fa.com%2Ftest.php%3Fa%3D%E5%93%88%E5%93%88
所以在send函数里面应该使用encodeURIComponent函数。
对应这两个函数分别有decodeURI和decodeURIComponent这两个函数
另外还有个escape和unescape函数对不是很好使，具体的baidu一下，自己写个脚本测试一下就知道了。
7. setTimeout("code", Interval)和setInterval("code", Interval)函数
这两个函数的作用是在以毫秒为单位的Interval间隔之后运行一段由code指定的javascript代码。
区别在于 setTimeout只运行一次该代码， 而setInterval在每隔一段Interval指定的时间之后运行一次代码，
直到窗口关闭为止。对于setTimeout，要实现重复运行该代码，可以在code里面指定一个函数，函数里面再
运行一次setTimeout，这样可以动态修改函数运行时间；而setInterval的时间间隔是不能修改的。
8. 对于xmlHttpRequest对象取回的responseText，如果要显示在div这类元素内，可能需要对其进行html编码
编码函数如下：
function htmlspecialchars(str)
{
var s = "";
if (str.length == 0) return "";
for (var i=0; i<str.length; i++)
{
switch (str.substr(i,1))
{
case "<": s += "<"; break;
case ">": s += ">"; break;
case "&": s += "&"; break;
case " ":
if(str.substr(i + 1, 1) == " "){
s += " ";
i++;
} else s += " ";
break;
case "\"": s += """; break;
case "\n": s += "<br/>"; break;
default: s += str.substr(i,1); break;
}
}
return s;
}
{
var s = "";
if (str.length == 0) return "";
for (var i=0; i<str.length; i++)
{
switch (str.substr(i,1))
{
case "<": s += "<"; break;
case ">": s += ">"; break;
case "&": s += "&"; break;
case " ":
if(str.substr(i + 1, 1) == " "){
s += " ";
i++;
} else s += " ";
break;
case "\"": s += """; break;
case "\n": s += "<br/>"; break;
default: s += str.substr(i,1); break;
}
}
return s;
}
欢迎扫码关注：
转载请注明出自 ，如是转载文则注明原出处，谢谢:)
RSS订阅地址: https://www.felix021.com/blog/feed.php 。
