JS獲取整個(gè)頁(yè)面文檔的實(shí)現(xiàn)代碼
更新時(shí)間:2011年12月15日 00:18:58 作者:
就是在當(dāng)前頁(yè)面用AJAX請(qǐng)求當(dāng)前頁(yè)面,返回的就是整個(gè)頁(yè)面的HTML··既然是整個(gè)頁(yè)面,所以也包括文檔聲明
唯一需要注意的地方:
innerText與textContent,顯示頁(yè)面的時(shí)候不能用innerHTML,否則會(huì)被解析。innerText與textContent是在除FF之外的瀏覽器與FF之間的差異。
var innerText = document.body.innerText ? 'innerText' : 'textContent';
上面的語(yǔ)句在開頭處理以避免多次判斷
demo貼圖:
demo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<div id="test">
<pre>
休息休息
</pre>
</div>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
var connector = (function(){
var connector = null;
if(window.XMLHttpRequest){
connector = new XMLHttpRequest();
}else if(window.ActiveXObject){
connector = new ActiveXObject('Microsoft.XMLHTTP');
}
return connector;
})();
var innerText = document.body.innerText ? 'innerText' : 'textContent';
var handler = function(response){
document.getElementById('test').getElementsByTagName('pre')[0][innerText] = response;
}
connector.onreadystatechange = (function(callback){
return function(){
if(connector.readyState == 4){//這里connector.status == 200都省了。
callback.call(connector,connector.responseText);
}
}
})(handler);
connector.open('GET',location.href,true);//發(fā)送到本頁(yè)面
connector.send();
</script>
</body>
</html>
innerText與textContent,顯示頁(yè)面的時(shí)候不能用innerHTML,否則會(huì)被解析。innerText與textContent是在除FF之外的瀏覽器與FF之間的差異。
復(fù)制代碼 代碼如下:
var innerText = document.body.innerText ? 'innerText' : 'textContent';
上面的語(yǔ)句在開頭處理以避免多次判斷
demo貼圖:
demo:
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<div id="test">
<pre>
休息休息
</pre>
</div>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
var connector = (function(){
var connector = null;
if(window.XMLHttpRequest){
connector = new XMLHttpRequest();
}else if(window.ActiveXObject){
connector = new ActiveXObject('Microsoft.XMLHTTP');
}
return connector;
})();
var innerText = document.body.innerText ? 'innerText' : 'textContent';
var handler = function(response){
document.getElementById('test').getElementsByTagName('pre')[0][innerText] = response;
}
connector.onreadystatechange = (function(callback){
return function(){
if(connector.readyState == 4){//這里connector.status == 200都省了。
callback.call(connector,connector.responseText);
}
}
})(handler);
connector.open('GET',location.href,true);//發(fā)送到本頁(yè)面
connector.send();
</script>
</body>
</html>
您可能感興趣的文章:
- js取整數(shù)、取余數(shù)的方法
- js 小數(shù)取整的函數(shù)
- JavaScript Math.ceil 方法(對(duì)數(shù)值向上取整)
- JavaScript Math.floor方法(對(duì)數(shù)值向下取整)
- JS取模、取商及取整運(yùn)算方法示例
- js中小數(shù)向上取整數(shù),向下取整數(shù),四舍五入取整數(shù)的實(shí)現(xiàn)(必看篇)
- JavaScript的parseInt 取整使用
- JS操作字符串轉(zhuǎn)換為數(shù)值并取整的代碼
- JavaScript中使用Math.floor()方法對(duì)數(shù)字取整
- JavaScript十大取整方法實(shí)例教程
相關(guān)文章
JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf()
這篇文章主要介紹了JS中的hasOwnProperty()、propertyIsEnumerable()和isPrototypeOf()的相關(guān)資料,需要的朋友可以參考下2016-08-08JS實(shí)現(xiàn)統(tǒng)計(jì)復(fù)選框選中個(gè)數(shù)并提示確定與取消的方法
這篇文章主要介紹了JS實(shí)現(xiàn)統(tǒng)計(jì)復(fù)選框選中個(gè)數(shù)并提示確定與取消的方法,可實(shí)現(xiàn)javascript針對(duì)頁(yè)面復(fù)選框元素的統(tǒng)計(jì)與提示功能,需要的朋友可以參考下2015-07-07javascript高亮效果的二種實(shí)現(xiàn)方法
js高亮效果實(shí)現(xiàn)代碼,直接靜態(tài)頁(yè)面即可,不用每次都要生成2008-09-09js 優(yōu)化次數(shù)過多的循環(huán) 考慮到性能問題
IE沒有我們想象中笨,它知道總的循環(huán)次數(shù)還是一千萬次。因此,得把這一百個(gè)十萬次循環(huán)分開執(zhí)行。雖然Javascript是單線程的,但也可以通過setTimeout或setInterval模擬多線程。2011-03-03javascript解析json格式的數(shù)據(jù)方法詳解
這篇文章主要介紹了javascript解析json格式的數(shù)據(jù)方法詳解,文章通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08從JQuery源碼分析JavaScript函數(shù)的apply方法與call方法
這篇文章主要介紹了從JQuery源碼分析JavaScript函數(shù)的apply方法與call方法,本文結(jié)合JQuery源碼和js高級(jí)程序設(shè)計(jì)再次探究apply方法與call方法,需要的朋友可以參考下2014-09-09javascript實(shí)現(xiàn)鏈接單選效果的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)鏈接單選效果的方法,可實(shí)現(xiàn)點(diǎn)擊鏈接改變其背景色的功能,同時(shí)可禁用對(duì)應(yīng)鏈接的跳轉(zhuǎn),需要的朋友可以參考下2015-05-05