web開發要注意的問題(轉)

 

1,document.getElementById方法只能獲取到一個對象,即使有多個同名的對象,也只取第一個具有該名稱的對象,例如在一個form(名稱爲myform)中,有三個id="mycheckbox"的複選框,那麼使用document.getElementById("mycheckbox"),返回的是第一個checkbox對象,而不是返回一個數組,如果使用document.myform.mycheckbox則返回一個數組。

2,使用showModalDialog打開一個頁面,則在這個頁面中,對於任何鏈接和任何表單提交,都會在新的窗口中執行,即使你在鏈接或form中指定了target="_self"也是沒有用的。例如使用showModalDialog打開一個test.html,在該頁面有一段代碼
<a href="test2.html" target="_seft">打開</a>
如果點擊該鏈接,那麼將會在新窗口中打開test2.html,至少在ie中是這樣的,那麼是不是就沒有辦法解決了呢?不是的,我們可以通過在彈出的頁面的head中加入下面的代碼來解決這個問題:
<head>
  <base target="_self">
</head>

3,在一個頁面含有某個iframe,其id="myframe" name="myframe",此時使用document.getElementById("myframe")取到的是iframe標籤對象,通過該對象可以獲取iframe的各個屬性,例如src、frameborder、style等等,但是不能獲取到iframe所包含的子頁面的各個對象。如果使用document.frames("myframe")取到的是iframe組件對象,通過該對象可以獲取到iframe所包含的頁面的子頁面的各個對象,例如子頁面的window對象,但是不能獲得iframe標籤得各個屬性,例如上面說到的src等等。請參看如下類似代碼:
1.html
<script>
  function check(){
    var obj1=document.getElementById("myframe");
    alert(obj1.src);
    //alert(obj1.window.document.myform.username.value);//Error
    var obj2=document.frames("myframe");
    alert(obj2.window.document.myform.username.value);
    //alert(obj2.src);//Error
  }
</script>
<body onload="check()">
  <iframe id="myframe" name="myframe" src=http://blog.csdn.net/el_nino/archive/2006/11/16/"2.html" frameborder="3" style="width:300;height:200;border-width:1;border-color:red;border-style:solid"></iframe>
</body>
2.html
<body>
  <form name="myform">
    用戶名:<input type="text" name="username" value="test" />
  </form>
</body>

4,在table中,如果在table中加入border="1" bordercolor="red",那麼table中所有單元格都會加上厚度爲1的紅色邊框,但是如果在table中加入css style="border-width:1;border-color:red;border-style:solid" 那麼只會在整個table的最外面加上厚度爲1的紅色邊框,分別如下圖所示:

當然第一個出現了雙邊框,這是因爲沒有設置cellspacing的緣故,只要在table中設計cellspacing="0",那麼就變爲單邊框了。

5,許多時候我們需要在頁面加載時能夠通過javascript去動態操作html中的一些對象,對於這些操作我們最好是在body中定義onload操作,然後在該操作中去完成這些任務,儘量避免在html中嵌入script執行代碼,因爲對於比較大的頁面,當這些腳本執行的時候,頁面往往還沒有加載完畢,因此許多頁面對象還沒有被生成,此時動態去改變很可能會報異常。

6,有時候我們需要在iframe子頁面中調用父頁面的javascript函數,例如在父窗口中定義了一個函數如下:
<html>
  <script>
    function loadImage(){
       //...
   }
 </script>
<body>
//...
</body>
</html>
那麼在iframe子頁面中可以通過parent.loadImage()來實現調用,這也說明用戶在頁面定義的所有javascript函數都屬於window對象之下。那麼在父窗口如何調用子窗口中的函數呢,應該很簡單了,就是獲得子窗口對象,然後調用子窗口對象的window對象下的這些函數即可,例如iframe的name爲myframe,在子窗口定義了一個函數getUserName,那麼父窗口中的調用方式爲document.frames("myframe").getUsername();另外對於父窗口調用子窗口中的方法,還要注意一個問題,就是子窗口的加載有時候會比較慢,如果子窗口正在加載,那麼此時它的各種頁面對象都不存在,那麼當在父窗口調用子窗口的方法時,爲了保險可以使用藉助setTimeout來實現異步調用,即通過setTimeout指定一定時間之後(例如100ms),再執行調用,調用執行總是判斷子窗口頁面是否加載完畢,如果沒有加載完畢,則繼續使用setTimeout方法,循環往復直到子窗口被完全加載,然後執行子窗口的函數調用。既然這裏解釋了窗口間的異步調用,後面就不專門解釋了。

7,在一個網頁中如何最小化窗口,當然你可能會說,網頁的右上角不是有最小化、最大化和關閉三個按鈕嗎,當然了這裏說這個問題是指,如果不點擊網頁右上角的最小化,如何實現網頁的最小化操作,例如有些項目中,用戶需要辦公界面是全屏化的,這意味着網頁自己提供的許多操作都不可見,更不用說去操作了。在網絡上我們搜索最小化的解決方式,我們會發現千篇一律的使用如下的方式實現:
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"> 
<param name="Command" value="Minimize"></object>
<input type=button value=最小化 onclick=hh1.Click()> 
在win98和windows2000中這個方式可能是可以的,但是在windows XP中卻是不再支持了,不僅如此在windows XP中對javascript不少函數做了限制。那麼在XP中如何實現最小化呢,一個可以實現的方式就是自己寫一個activeX控件,這個是在項目中證明可以實現的。(不要認爲activeX控件很難寫,也不要以爲activeX控件用戶不接受,在實際的項目中如果用戶使用的都是ie,那麼用戶一般是會接受的,當然這裏的項目最好是內網辦公項目,對於公網項目來說,用戶接不接受就很難說了)

8,注意td中nowrap的使用,這個屬性是很有用的,例如如果一個td中含有多張圖片,那麼如果不加入nowrap,那麼很可能這些圖片會由於其它的td的擠壓而產生細微的上下錯位,這表現的頁面上就是某處出現了一條橫向的細縫。這一點很重要,頁面中許多非常奇怪的現象都與此有關。

9,對於showModalDialog彈出的頁面,不能使用右鍵菜單,也不支持F5和ctrl+r刷新,如果此時修改彈出頁面的內容,那麼必須關閉該窗口,然後重新彈出纔可以。另外,對於許多web服務器,由於服務器都設置有緩存,如果修改了彈出頁面的內容,那麼許多時候只是關閉彈出頁面還是不夠的,往往還需要關閉彈出該頁面的那個頁面纔可以。在這裏多說一句,web開發許多奇怪的頁面現象都和web服務器的緩存有着很大的關係,因此出現問題時考慮一下是否是由於服務器的緩存所致。

10,我們喜歡在form中定義onsubmit操作,主要是爲了在表單提交之前可以做一些有意義的操作,例如檢查輸入域的有效性等等,但是一定要注意,如果我們通過點擊該form中的submit按鈕(type=submit或type=image)提交表單,那麼該onsubmit操作會被執行,但是如果通過document.formName.submit()提交表單,那麼此onsubmit操作將不被執行。

11,許多時候我們修改了頁面的內容,但是我們刷新頁面或重新打開該頁面,卻看不到修改的效果,除了前面提到過的showModalDialog和緩存的情況要考慮外,還要檢查一下是否改對了地方,即你修改的那個頁面是否是服務器上的那個頁面,有可能你修改了其它地方的一個頁面,如果不是這個原因,那麼再進行其它方面的檢查。

12,在沒有系統規劃好之前,請不要在css中定義html標籤的統一行爲,即下面的形式:
<style>
  TABLE{font-size:11pt;color:black;}
  INPUT{border-width:1;border-color:pink;border-style:solid}
</style>
因爲一但定義了這些標籤的屬性,那麼這將會影響頁面中所有的這些標籤屬性,尤其在一些公用的css文件中,儘量不要定義html標籤的統一行爲。當然如果經過了系統的良好的規劃,那麼這樣做將是非常好的,只是在國內在css上經過良好規劃的並不多,因此雖然我們見到許多項目和產品中對html標籤做了許多css的定義,但是真正起到作用的並不多。

13,在html標籤中有許多屬性的名稱都是複合詞,例如borderColor、frameBorder、readOnly等等,注意這些複合詞在html的書寫,一般來說我們在html標籤中寫爲borderColor和bordercolor,各個瀏覽器的解析都會通過,但是我們在使用javascriopt引用這些屬性時卻需要注意了,一定使用正確的屬性名稱,嚴格來說,對於複合詞而言,除了第一個有意義的詞之外,其它任何有意義的詞的首字母都要大寫,例如對於上面列出的三個屬性的引用,一定要使用borderColor、frameBorder、readOnly的形式。
<input type="text" id="myinput" readonly />
<script>
    var flag=document.getElementById("myinput").readOnly;//正確的方式
    //var flag=document.getElementById("myinput").readonly;//錯誤的方式
</script>

 14,我們知道當使用瀏覽器的菜單“查看”->“文字大小”來改變文字的顯示時(或者有些瀏覽器也可以使用ctrl+滾輪鍵),網頁中的文字的字號會發生相應的變化,如果我們在網頁中的文字塊中定義了style="font-size:10pt",那麼這些文字塊中的文字的大小將是固定的了(注意在<font/>標籤定義size屬性是不能固定字號的),我想這一點多數人都應該知道的。但是我們使用中有時會出現一種非常奇怪的現象,例如下面的一段代碼:
<table><tr><td>
<div style="font-size:10pt;border-width:1;border-color:red;border-style:solid">
  這是上面
</div>
<br />
<div style="font-size:10pt;border-width:1;border-color:green;border-style:solid">
  這是下面
</div>
</td></tr></table>
我們看一下在字號顯示“最大”和“最小”下的差別:

從上圖我們可以看到字號我們是固定住了,但是table的高度卻會隨着查看方式的不同而發生變化,這是爲什麼呢?原因就在於td當中的那個<br />,我們知道<br />是表示段內換行,但是要注意在網頁中所謂的行也是有一定的默認高度的,而且這個高度隨着查看方式的不同而發生相應的變化,因此如果我們想固定上面table的高度不發生變化,有下面兩種方式:
方式一:在table標籤中加入字號限制例如<table style="font-size:10pt"...
方式二:在<br />中加入字號限制例如<br style="font-size:10pt" />...
如果你是一個web開發人員,你可以試着使用ctrl+滾輪鍵改變網頁查看文字的大小,你會發現不少頁面都存在這個問題的。

15,網頁中定位對象的方式有許多種,下面先簡單總結一下,以後再專門寫這個方面的文章的:
1)頁面內通用定位方式(這些定位方式適用於後面其它元素的定位)
document.getElementById(objId);//通過對象的id獲取對象,這個是各個瀏覽器都支持的,返回一個對象
document.getElementsByName(objName);//通過對象的name獲取對象,這個是各個瀏覽器都支持的,返回一個數組
document.getElementsByTagName(tagName);//通過標籤名稱獲取對象,這個是各個瀏覽器都支持的,返回一個數組
document.all.objId;//通過對象id獲取對象,這個是ie支持的,返回一個對象
document.all(objId);//通過對象id獲取對象,這個是ie支持的,返回一個對象
document.layers.objId;//通過對象id獲取對象,這是Netscape支持的,返回一個對象
document.layers(objId);//通過對象id獲取對象,這是Netscape支持的,返回一個對象
window.objName;//通過對象名稱獲取對象,至少在ie中如此
objName;//通過對象名稱獲取對象,至少在ie中如此
2)頁面內集合元素的定位方式
我們知道在頁面中有許多集合,例如form、frame、image等等,引用這些集合中某個對象的方式爲,舉其中一個爲例,其它都差不多,以form爲例:
document.formName;//通過表單name獲取表單對象
document.forms[index];//通過索引獲取表單對象,瀏覽器會按順序將頁面中所有的表單集合城數組,可以通過下標引用
document.forms(formName);//通過表單name獲取表單對象
3)定位子窗口的方式(定位子窗口對象,不是標籤對象,見前面3中的說明)
子窗口是指頁面中frame或iframe窗口,定位方式爲:
document.frames[index];//索引定位方式
document.frames(frameName);//通過名稱定位
window.frameName;//通過名稱定位
frameName;//直接通過名稱來定位
4)在子定位父窗口的方式
通過關鍵字parent來引用即可,同理parent.parent則表示父父窗口,top則表示最上層窗口。
5)原窗口定位open彈出窗口的方式,例如下面代碼:
window.open("test.html");
這裏我們要知道window.open將會返回一個彈出窗口的句柄,即可以如下:
var owin=window.open("test.html");
owin即代碼彈出窗口對象,通過改對象可以引用到彈出窗口的各個對象。
6)原窗口定位showModalDialog彈出窗口的方式,例如:
window.showModalDialog("test.html");
注意showModalDialog與open不同,open彈出窗口後,window.open後面的代碼可以繼續執行,而showModalDialog彈出窗口後,原頁面被阻塞,即window.showModalDialog後面的代碼不被執行,直到用戶關閉了彈出窗口才會繼續往下執行,但這時因爲已經關閉了彈出窗口,所以已經無法再對該窗口進行引用。
7)open彈出的窗口對原窗口的定位方式,這個我們一般都知道,在彈出窗口中使用opener即可。
8)showModalDialog彈出的窗口對原窗口的定位方式,這個不是使用opener,而應該在彈出窗口中使用parent。

16,編寫頁面代碼儘量使用標準的html、css和javascript,不要以爲只要在ie上通過就可以了,要注意最近瀏覽器市場已經開始發生變化了,不知道你是否聽說過Firefox2.0,它的用戶量已經不在ie之下了,至少你的代碼要在ie和Firefox上都通過纔可以,另外現在linux越來越吃香,保不準幾年後我們的許多客戶都開始使用linux,到那個時候,我們將不得不對原來已經完成的項目進行維護,與其這樣的後果,還不如從現在開始就使用標準爲好,不要認爲跨瀏覽器是很虛的話題,覺得沒有必要,要知道這已經不是幾年前了,現在形式和市場都在發生變化,我們的思想也該變一變了。

17,我們的產品或OA系統往往會有許多模塊,例如用戶管理、發文流程、物品管理等等,我們在爲這些模塊命名時往往都是不太講究的,沒有注意名字的結構、字數等的統一,例如在個人事務模塊下面有三個子模塊,名稱分別如下:待辦事項、已辦事項,維護個人信息。對於字數而言我們往往不會苛求太多,但是對於詞的結構,我們還是要講究的,例如上面的三個模塊,前兩個是名詞結構,而後一個是謂詞結構(動賓結構),這是不太妥當的,也許你覺得這有些吹毛求疵,當然大多數項目中不會要求這麼嚴格,但是有些客戶的確會有這樣的要求,另外對我們自己而言,這也體現了我們做事認真、一絲不苟的品格和態度。

18,圖標與文字的配比要合適,這不僅要求圖標能夠正確顯示文字的意思,而且還要求圖標不能蓋過文字的顯示與含義,即圖標太顯眼而文字無足輕重的情況需要避免,例如下面的情況就是不太合適的:
 用戶管理
之所以不合適,主要是因爲圖標的含義與用戶管理關係不大,圖標的含義更接近“XX編輯”的意思,和用戶管理基本沒有什麼聯繫。

19,在用戶登錄和表單處理頁面,我們要處理用戶按enter鍵的情況,即用戶按enter鍵也要觸發提交事件,不要只有用戶點擊“登錄”或“提交”按鈕才觸發提交操作。

20,如果我們在頁面中使用<a />標籤,那麼默認情況,當鼠標移到該鏈接時,鼠標自動會變爲手的形狀,許多時候我們希望鼠標移動到其它非鏈接的區域,也希望鼠標變爲手的形狀,我們一般的處理方式爲在該區域的style中加入cursor屬性,如下:
<span style="cursor:hand" onclick="myfunc()">下一頁</span>
或者使用:
<span style="cursor:url('http://webme.bokee.com/inc/mouse118.cur')" onclick="myfunc()">下一頁</span>
但是要注意,只有在ie中才支持cursor:hand,在firefox2.0中的cursor中是沒有hand的,像wait、help等都是支持的,另外firefox中也不支持cursor:url方式。

21,我們有時想通過javascript進行跨域頁面的調用,不過出於安全性的考慮,各個瀏覽器一般都是不支持的,例如下面的代碼:
<iframe src=http://blog.csdn.net/el_nino/archive/2006/11/16/"http://www.google.com"></iframe>
<script>
  setTimeout("document.frames[0].window.location.href",3000);
</script>
使用setTimeout是爲了可以讓iframe子頁面可以加載完畢,上面的調用會報安全性警告,例如在ie如下:


那麼是不是說只要是跨域就能不能進行javascript訪問了呢?不是的,一種比較常用的辦法就是設置document.domain屬性,這種方式的描述如下:
假設有兩個頁面
test1.html 所在域:aaa.maindomain.com 訪問協議:http 端口:8080
test2.html 所在域:bbb.maindomain.com 訪問協議:http 端口:8080
滿足上面條件的兩個頁面test1.html、test2.html是可以通過javascript相互訪問的,上面的條件即爲兩個頁面位於同一個基礎域(例如上面同爲maindomain.com),遵循同一個訪問協議和端口(例如上面同爲http 8080)。只要在這樣的兩個頁面中都設置document.domain爲所在基礎域名,就可以相互調用了,例如:
test1.html 所在域爲aaa.mydomain.com
<script>
  document.domain="mydomain.com";
</script>
<iframe src=http://bbb.mydomain.com/test2.html></iframe>%3Cbr _fcksavedurl="http://bbb.mydomain.com/test2.html></iframe>%3Cbr" /><script>
  setTimeout("document.frames[0].window.location.href",3000);
</script>
test2.html 所在域爲bbb.mydomain.com
<script>
  document.domain="mydomain.com";
</script>
...
這樣一來,test1.html的調用就是可以的了。一般來說跨域調用的場景發生在集團型企業項目或多機構的政務項目中,而對於這種類型的項目,它們的基礎域基本上是相同的,只是三級域名不同,因此可以使用上面的方式來進行跨域調用。

22,你會頁面中的javascript調試嗎?也許你還不會使用ie或firefox提供的頁面調試器或插件,那麼沒有關係,至少你懂得一種最基本的調試:alert調試,不要認爲這是一種很土或很傻的方式,很多時候這種方式都很非常有用的,對於一段很長的javascrip代碼,從頭到尾加入幾個alert,那麼立即就能定位錯誤的大概位置,當然使用調試器的斷點也可以很快定位,只是說alert也是一種不錯的方式。當然還是希望你能夠掌握更爲高級的調試器的使用,畢竟調試器帶給我的功能更強大。

23,我們許多時候編寫完網頁之後,發現最終的顯示效果和我們想象的不太一樣,這有些時候是由於瀏覽器的不同造成的,但除此之外,我們如何具體定位到底是頁面的哪塊代碼導致不太理想的頁面效果呢?當然你可能會使用Dreamweaver或Frontpage打開出問題的頁面,然後查找原因,但是這些所見即所得的網頁設計器,並非我們想象的那麼完美,例如明明在設計器種預覽很好的效果,到了真實環境中頁面竟然出現了錯位等等,這裏和你介紹一種非常不錯的css的調試方式,這裏就不具體說了,請參看我新寫過的一篇文章【css在html中的調試作用

24,網頁打印我們都知道可以調用window.print函數,那麼如果想打印iframe子窗口中頁面呢,如果你只是獲得子窗口對象,然後調用子窗口對象的print方法,此時打印機打印出卻不是子窗口頁面的內容,而是父窗口頁面自身,爲什麼會這樣呢?原來(至少在ie中如此)在父頁面調用子窗口的print函數時,因爲此時焦點還在父窗口之中,所以打印機此時會將獲得焦點的窗口進行打印,我們在打印子窗口之前,只需做一件事即可完成對子窗口的打印,如下代碼:
<html>
 <head>
  <script>
    function myprint(){
       document.frames("myframe").window.focus();
       document.frames("myframe").window.print();
   }
  </script>
 </head>
<body onload="myprint()">
  <iframe name="myframe" src=http://blog.csdn.net/el_nino/archive/2006/11/16/"test2.html"></iframe>
</body>
</html>

25,網頁切圖許多人都習慣於網頁三劍客的配合使用,網頁三劍客就是網頁開發者都熟悉的Dreamweaver、Fireworks和Flash,一般我們使用使用Flash或Fireworks將動畫或圖切分後輸出成爲html頁面,然後通過Dreamweaver編輯輸出後的頁面,這是我們網頁切圖常用的配合方式,但是通過使用比較發現,在圖片的切分方面,使用Photoshop要好於Fireworks,Photoshop不僅定位更加精確,而且由於自身是平面設計的標準,因此它提供了許多圖片編輯的其它功能,這要比fireworks強大得多。目前專業的網頁設計師都在開始或一直使用Photoshop進行網頁設計並切分後輸出成爲HTML頁面。如果你是三劍客的愛好者也沒有關係,你可以使用一下看看效果如何,總之我從2000年就開始使用三劍客,現在才逐漸認識到Photoshop已經不僅僅是平面設計的標準了。

26,在javascript中有一個方法可以列出當前對象所支持的所有屬性、集合和事件,通過使用in關鍵字來實現,如下樣例代碼:
var str="";
for(var i in document){
    str+=i+"/n";
}
alert("document's all attributes:"+str);

27,在一個名稱爲myform的表單中,含有一個名稱爲mychckbox的複選框,那麼document.myform.mycheckbox所取到的是那個複選框對象,那麼此時調用document.myform.mycheckbox.length是錯誤的,如果該表單中含有多個名稱爲mycheckbox的複選框,那麼document.myform.mycheckbox返回的是一個數組,此時調用document.myform.mycheckbox.length就是正確的。單獨說這個問題,可能感覺比較簡單,但是在實際應用中我們經常會犯與此相關的錯誤,如下圖所示:

上圖是我們在應用中經常遇到的“增、刪、改”的邏輯,我們在其中經常會對複選框做操作,經常會使用類似document.myform.mycheckbox.length的方式,一般情況不會報錯,這主要是因爲在我們的列表中一般來說都不會只有一條記錄,但是當列表中只有一條記錄的時候(儘管這種時候不常見),這樣引用就會報錯,因爲此時document.myform.mycheckbox返回的不是一個數組,則對length的引用就沒有意義了,這種錯誤說起來很容易,但是在編程時往往就會忽略,因此在編程時我們建議如下方式:
if(document.myform.mycheckbox.length){
  //...
}else{
  //...
}

28,在ie中有一個很特別的css語法,如果你聽說過,那說明你的積累真是太豐富了!在css中有一種給漢語注音的語法,如下所示:
<style>
    ruby{font-size:13pt;} 
    rt{font-size:18pt;color:red}
</style>
<ruby>你知道這個語法嗎?<rt>ni zhi dao zhe ge yu fa ma</rt><br>
不知道<rt>bu zhi dao</rt>   
</ruby>
你運行這段代碼看看什麼效果(要在ie中運行),我這裏效果如下:

29,我們項目中經常會遇到頁面打印的需求,許多時候用戶需要只打印頁面某一部分,如果直接調用window.print則打印的是整個網頁的內容。解決辦法不外乎兩種,第一種方式是將整個頁面分爲幾個部分,將需要打印的部分放在其中的一個部分,然後定義onbeforeprint和onafterprint兩個操作,即打印之前將不要打印的部分隱藏,打印之後將隱藏的部分顯示,類似代碼如下:
<script>
   function beforePrint(){
       document.getElementById("hidden1").style.display="none";
       document.getElementById("hidden2").style.display="none";
   }
   function afterPrint(){
       document.getElementById("hidden1").style.display="block";
       document.getElementById("hidden2").style.display="block";
   }
   document.onbeforeprint=beforePrint;
   document.onafterprint=afterPrint;
</script>
<div id="hidden1" style="display:block">
這裏不需要打印
</div>
<div id="printDiv" style="display:block">
這裏需要打印
</div>
<div id="hidden2" style="display:block">
這裏不需要打印
</div>
<input type="button" value="打印" onclick="window.print()"/>
第二種方式是將需要打印的部分放到iframe之中,然後將焦點移到子窗口,然後調用子窗口的print方法即可。

30,Javascript中的數組和我們一般的編程語言中的數組是不太一樣,一般語言中數組的長度是固定的,有些語言中數組中的數據類型也要求是一樣的,但是javascript數組卻不受這些限制,在javascript中數組基本上是沒有長度限制的,而且類型也沒有限制,例如下面的一些使用方法:
var arr=new Array();
arr[1000]="ok";
arr[300]=255;
arr[200]=new Date();
var date=arr[200];
alert(date.getTime());
因爲數組的這種機制,我們可以使用數組實現許多數據結構,例如列表、哈西表等等。

31,對於XML的處理一般情況下都是在服務器端處理的,例如在Java中有W3C、JDOM、XPath等許多xml的解析器,但是現在許多時候我們需要在瀏覽器端處理xml字符串,目前在ie和netscape中都有針對xml字符串的解析,如果你喜歡使用,也沒有什麼關係,不過對於Java程序員,我給你介紹一個完全按照W3C Document API實現的XML解析器,相信你會非常喜歡的,因爲完全是Java的風格,請從 http://download.jsjava.com 下載jsjava0.91,在其中的src/jsorg/w3c/dom下有XML各個對象的實現,在頁面中只需引用其中的xmlp.js和i18n.js即可,具體使用可以參考裏面的例子:位於下載包的examples/XMLParser/XMLW3CParser下面,也可以直接訪問:http://jsjava.sourceforge.net/examples/XMLParser/XMLW3CParser/W3CXMLParser.html 查看例子。

32,一段文本的首行文本縮進兩個漢字,這是中文段落的格式要求,我們可以通過在首行加入多個&nbsp;來實現,不過還是建議使用css的標準屬性text-indent,例如下面的代碼:
<p style="text-indent:28;font-size:10pt">
這是一段文本,請注意它的格式,<br>
你看到了什麼效果?如果你看到首行<br>
縮進了,那麼說明起作用了。
</p>
顯示效果如下:

33,在Javascript中字符串的替換函數爲replace(regexp, newSubStr),其中第一個參數是一個正則表達式,但是我們在實際使用中,往往習慣使用爲一個字符串,這雖然不會報錯,但是得到的結果往往是不正確的,例如下面的例子:
var str=“ abbbbacc”;
var rs=str.replace(“a”,”0”);
(A)0bbbbacc (B)0bbbb0cc
正確答案是A,當然A可能不是你想要的結果,你想要的結果是字符串中所有的“a”都被替換爲“0”,可是上面的使用方式只能將第一個“a”替換爲“0”,正確的使用方式,在第一個參數中輸入一個正則表達式,如下所示:
var str=“ abbbbacc”;
var rs=str.replace(“/a/g”,”0”);//注意如果第一個參數爲/a/,結果也是不正確的。
(A)0bbbbacc (B)0bbbb0cc
這樣的話答案就是B了,如果你不明白/a/g是什麼意思,那麼你就需要對Javascript的正則表達式好好學習了,具體可以參看我以前寫過的一篇文章:http://blog.csdn.net/eye_of_back/archive/2006/07/14/922667.aspx

34,無論你使用的是ASP,還是PHP,或者JSP,都不建議在頁面代碼中夾雜着大量的業務邏輯代碼。我們應該將業務邏輯代碼封裝到應用服務器層或者說業務層,web端只是進行調用。在JSP和PHP中我們可以將業務邏輯封裝到BO(業務對象)中,由於支持類、接口等一套面向對象的機制,使得這種封裝顯得很容易,對於ASP,由於ASP.NET和C#的興起,使得它對業務封裝也變得相當方便。雖然我們都懂得服務器的三層架構,但是我們發現許多的項目之中,開發人員仍然在頁面中直接編寫業務邏輯,甚至直接訪問數據庫,面對這種情況,不能不說我們的項目管理是存在很大的問題的,我們的項目經理和程序設計師們,我們應該好好反思一下了。

35,有些時候我們在<a/>標籤的href中直接加入javascript代碼,通過window.open來打開一個自己可以控制許多屬性的窗口,例如下面的代碼:
<a href="javascript:window.open('http://www.google.com');">打開Google</a>
當我們點擊鏈接後,確實彈出了Google的頁面,但同時原頁面卻變爲了下面的樣子:

這種情況相信有些人遇到過,解決方式如下:
<a href="javascript:window.open('http://www.google.com');window.opener=null;window.close()">打開Google</a>
但是爲什麼前面的那種方式就會出現那種情況呢,其實只要做個簡單實驗就會明白了,你運行一下下面的代碼,點擊鏈接看看會出現什麼結果:
<a href="javascript:window">打開Google</a>
實驗後你會發現,點擊鏈接後頁面出現的結果與上面那種結果相同,然後你再實驗一下下面的代碼:
<a href="javascript:'test'">打開Google</a>
點擊鏈接後,你會發現頁面中會顯示test字樣。可見對於類似
<a href="javascript:js代碼">點擊</a>
的代碼,如果js代碼執行完畢後返回一個對象,那麼頁面內容會被沖掉,然後將該對象的描述輸出到頁面中,我們知道window.open方法返回的是彈出的頁面的窗口對象(window),因此javascript:window.open將會在彈出一個窗口的同時,原頁面會沖掉原有內容並將返回的window對象輸出到原頁面中。如果在window.open後面加入window.opener=null;window.close(),則彈出窗口後,返回給原頁面的對象爲空,則原頁面不執行任何其它操作。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章