&

js實現靜態頁面的include功能

admin

2012年8月4日 2:31 本文熱度 4000

姑且不說為什么會有這樣的需求，就談談怎么實現吧，當這個需求出來的時候我就想到的是js,一種方式就是fileStream的方式把文件內容讀出來在標簽里把內容顯示出來，再一種方式就是xmlHttpRequest創建對象對遠程文件讀取，這種更像web方式，前一種應該說是文件操作方式。在后一種方式的考慮閱覽器的兼容性，基于這個問題我故意裝了IE7.0和firefox，一直用的都是IE6.0。把這兩種方式實現的代碼貼下，希望能對你有說幫助，更多的是自己一個筆記。
FileStream方式：

1<html xmlns="http://www.w3.org/1999/xhtml">
2<head>
3<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
4<title>html include實例</title>
5<SCRIPT language=JavaScript>
6
16</SCRIPT>
17</head>
18
19<body onload=ReadFile(xxx,"E:\\htmltest\\top.htm");ReadFile(yy,"E:\\htmltest\\foot.htm");>
20<span id="top"></span>
21<span id="foot"></span>
22</body>
23</html>

xmlHttpRequest方式

  1<html xmlns="http://www.w3.org/1999/xhtml">
  2<head>
  3<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4<title>讀取html實例</title>
  5
  6<script>
  7    var xmlHttp;
  8    var rs;
  9    var isie = false;
10    function startRequest(url,divs)
11    {
12        if(window.ActiveXObject) //是IE，下面就要根據版本創建對象
13        {
14            try
15            {
16                 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
17               }
18              catch(e)
19               {
20                try
21                {
22                     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
23                  }
24                   catch(e)
25                {
26                    try
27                     {
28                         xmlHttp=new ActiveXObject("MSXML2.ServerXMLHTTP");
29
30                     }
31                     catch (e)
32                     {
33
34                     }
35                }
36              }
37
38        isie = true;
39        }
40        else   //不是IE,可能是firefox或者其他閱覽器
41        {
42            xmlHttp= new XMLHttpRequest();
43        }
44        try{
45            if(isie == false ){
46                xmlHttp.open("GET", url, false);
47                xmlHttp.overrideMimeType("text/html;charset=gb2312");
48                xmlHttp.send(null);
49                document.getElementById(divs).innerHTML=xmlHttp.responseText;
50            }else{
51                xmlHttp.open("GET", url, false);
52               xmlHttp.send(null);
53                if(xmlHttp.readyState == 4){
54                    if (xmlHttp.status == 200 || xmlHttp.status == 0){
55                     document.getElementById(divs).innerHTML=bytes2BSTR(xmlHttp.responseBody);
56                    }
57                }
58            }
59        }catch(exception){
60            document.write('exception:'+exception.message);
61        }
62    }
63 </script>
64//處理亂碼問題，還有一種方式是這樣的：
65//<script language=javascript>
66

//function Recenspace(Html){
67

// rs=new ActiveXObject("ADODB.RecordSet");
68

// rs.fields.append("a",201,1);
69

// rs.open();
70

// rs.addNew();
71

// rs(0).appendChunk(Html);
72

// rs.update();
73

// return rs(0).value;
74

// rs.close();
75

// }
76

//</script>
77//這種方式需要操作客戶端adodb.recordset對象，有可能客戶端會不支持
78<script language="VBScript">
79

function bytes2BSTR(vIn)
80

dim strReturn,i,ThisCharCode,innerCode,Hight8,Low8,NextCharCode
81

strReturn=""
82

for i=1 to LenB(vIn)
83

ThisCharCode=AscB(MidB(vIn,i,1))
84

if ThisCharCode<&H80 Then
85

strReturn=strReturn & Chr(ThisCharCode)
86

else
87

NextCharCode=AscB(MidB(vIn,i+1,1))
88

strReturn=strReturn&Chr(CLng(ThisCharCode)*&H100+CInt(NextCharCode))
89

i=i+1
90

end if
91

next
92

bytes2BSTR=strReturn
93

end function
94

</script>
95</head>
96
97<body onload=startRequest('cp.htm','top');startRequest('contact.htm','foot');>
98<span id="top"></span>
99<span id="foot"></span>
100</body>
101</html>

該文章在 2012/8/4 2:31:21 編輯過

關鍵字查詢

正在查詢...

點晴ERP是一款針對中小制造業的專業生產管理軟件系統,系統成熟度和易用性得到了國內大量中小企業的青睞。

點晴PMS碼頭管理系統主要針對港口碼頭集裝箱與散貨日常運作、調度、堆場、車隊、財務費用、相關報表等業務管理，結合碼頭的業務特點，圍繞調度、堆場作業而開發的。集技術的先進性、管理的有效性于一體，是物流碼頭及其他港口類企業的高效ERP管理信息系統。

點晴WMS倉儲管理系統提供了貨物產品管理,銷售管理,采購管理,倉儲管理,倉庫管理,保質期管理,貨位管理,庫位管理,生產管理,WMS管理系統,標簽打印,條形碼,二維碼管理,批號管理軟件。

點晴免費OA是一款軟件和通用服務都免費，不限功能、不限時間、不限用戶的免費OA協同辦公管理系統。

国产高清在线免费观看-国产高清在线免费无码-国产高清在线男人的天堂-国产高清在线视频-国产高清在线视频精品视频-国产高清在线视频伊甸园

js實現靜態頁面的include功能