實例:盡可能寫友好的Javascript代碼
更新時間:2006年10月09日 00:00:00 作者:
在Search Engine的robot搜索時,針對的type,text/html此類“文本”的友好度是最高的(現(xiàn)階段text/xml除外),而text/javascript此類的友好度不理想,如果robot還要判斷DHTML代碼的話,那這個復(fù)雜度也是較高,而且劃不來,因此,在DHTML編程時,如果要提升代碼的友好度。采用的方法,較好的方法是“盡可能是把DHTML的代碼簡化成沒有HTML的代碼”。這句話如何理解?
e.g:
一個javascript menu。
方法一、采用常規(guī)的編程方法:
<script type="text/javascript">
var navi_menu = neverDHTMLmenu();
/* addItem method
* @ pid
* @ id
* @ text
* @ href
*/
navi_menu.addItem("0","1","home","http://www.never-online.net");
navi_menu.addItem("0","2","blog","http://blog.never-online.net");
navi_menu.addItem("0","3","music","http://www.never-online.net/music");
navi_menu.init("navigator_Container");
</script>
二、采用對Search Engine較友好的編程方法
<script type="text/javascript">
onload = function() {
var config = {
container: document.getElementById("navigator_Container");
// and more configuration code
}
var navi_menu = new neverCssDHTMLMenu(config);
navi_menu.init();
</script>
<div id="navigator_Container" class="navigator_menu">
<ul>
<li><a >home</a></li>
<li><a >blog</a></li>
<li><a >music</a></li>
<!-- more... -->
</ul>
<div>
從方法一和方法二來比較,方法一把一些HTML封裝到了neverDHTMLmenu()里,但這樣做并沒有實際的好處,雖然我們依然可以把CSS給到這個類里。
方法二中可以看到有很多好處,比如,可以將view與program分離,可以實現(xiàn)客戶端的MVC。換個角度說,可以提高開發(fā)效率。
可能有些朋友會問,除了menu,還有哪些程序可以按上述的方法分離呢?
上面也提到了,一般與頁面交互較多的,會產(chǎn)生大量的HTML的,會影響Search Engine的robot的,都可以采用這種方法,當(dāng)然了,這些只是討論對Search Engine的友好度,所以,任何代碼都必須由實際情況而定。
也或者有朋友問,這樣為何會提高開發(fā)效率?
比如,美工做好模板后,(假設(shè)此美工會一些相關(guān)的HTML編寫)那么按照xhtml標(biāo)準(zhǔn),(如上例如示)
假設(shè)我要把原本的home改成Default page,那么美工得和程序員溝通,說要改這個menu的字,溝通時間在開發(fā)中也會多了。因此,在開發(fā)進(jìn)度上,這個時間要算進(jìn)去的。假設(shè)要改模板了,那么還得溝通。再或者假如原來用js生成的HTML是table做成的menu,要改版了,那么這個程序還得改寫。不利于維護(hù)...
這個方法建議大家可以試試,意思主要就是JS負(fù)責(zé)業(yè)務(wù)實現(xiàn),而視圖則仍然交由HTML來處理。
e.g:
一個javascript menu。
方法一、采用常規(guī)的編程方法:
<script type="text/javascript">
var navi_menu = neverDHTMLmenu();
/* addItem method
* @ pid
* @ id
* @ text
* @ href
*/
navi_menu.addItem("0","1","home","http://www.never-online.net");
navi_menu.addItem("0","2","blog","http://blog.never-online.net");
navi_menu.addItem("0","3","music","http://www.never-online.net/music");
navi_menu.init("navigator_Container");
</script>
二、采用對Search Engine較友好的編程方法
<script type="text/javascript">
onload = function() {
var config = {
container: document.getElementById("navigator_Container");
// and more configuration code
}
var navi_menu = new neverCssDHTMLMenu(config);
navi_menu.init();
</script>
<div id="navigator_Container" class="navigator_menu">
<ul>
<li><a >home</a></li>
<li><a >blog</a></li>
<li><a >music</a></li>
<!-- more... -->
</ul>
<div>
從方法一和方法二來比較,方法一把一些HTML封裝到了neverDHTMLmenu()里,但這樣做并沒有實際的好處,雖然我們依然可以把CSS給到這個類里。
方法二中可以看到有很多好處,比如,可以將view與program分離,可以實現(xiàn)客戶端的MVC。換個角度說,可以提高開發(fā)效率。
可能有些朋友會問,除了menu,還有哪些程序可以按上述的方法分離呢?
上面也提到了,一般與頁面交互較多的,會產(chǎn)生大量的HTML的,會影響Search Engine的robot的,都可以采用這種方法,當(dāng)然了,這些只是討論對Search Engine的友好度,所以,任何代碼都必須由實際情況而定。
也或者有朋友問,這樣為何會提高開發(fā)效率?
比如,美工做好模板后,(假設(shè)此美工會一些相關(guān)的HTML編寫)那么按照xhtml標(biāo)準(zhǔn),(如上例如示)
假設(shè)我要把原本的home改成Default page,那么美工得和程序員溝通,說要改這個menu的字,溝通時間在開發(fā)中也會多了。因此,在開發(fā)進(jìn)度上,這個時間要算進(jìn)去的。假設(shè)要改模板了,那么還得溝通。再或者假如原來用js生成的HTML是table做成的menu,要改版了,那么這個程序還得改寫。不利于維護(hù)...
這個方法建議大家可以試試,意思主要就是JS負(fù)責(zé)業(yè)務(wù)實現(xiàn),而視圖則仍然交由HTML來處理。
相關(guān)文章
淺談JavaScript中面向?qū)ο蟮牡纳羁截惡蜏\拷貝
下面小編就為大家?guī)硪黄獪\談JavaScript中面向?qū)ο蟮牡纳羁截惡蜏\拷貝。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-08全面總結(jié)Javascript對數(shù)組對象的各種操作
最近有個同事問了個問題,關(guān)于數(shù)組,對象和類數(shù)組的,仔細(xì)說起來都是基礎(chǔ),其實都沒什么好講的,不過看到還是有很多朋友有些迷糊,決定還是寫出來吧,下面這篇文章主要給大家介紹了Javascript對數(shù)組對象的各種操作,需要的朋友可以參考借鑒。2017-01-01詳解JavaScript如何利用異步解密回調(diào)地獄
為了更好地處理這些異步操作,JavaScript?引入了異步編程的概念,這篇文章主要來和大家詳細(xì)聊聊JavaScript中異步的相關(guān)應(yīng)用,希望對大家有所幫助2024-02-02IE關(guān)閉時判斷及AJAX注銷案例學(xué)習(xí)
當(dāng)關(guān)閉系統(tǒng)時會提示:你確定要退出系統(tǒng)嗎?退出請按'離開此頁'接下來將講解下IE關(guān)閉判斷及AJAX注銷,感興趣的你可不要錯過了哈,希望本例對你學(xué)習(xí)ajax有所幫助2013-02-02