首先登颓，來(lái)看一下 Html5 頁(yè)面引用 JavaScript 代碼的幾種方式：
1、Html5 頁(yè)面中使用 <script> 標(biāo)簽容納 JavaScript 代碼轧钓；
<script>
init();
</script>
這里不僅可以調(diào)用任意位置的函數(shù)，而且可以聲明變量，構(gòu)建函數(shù)和對(duì)象等等骏啰。
2、Html5 頁(yè)面中使用 <script src="xxx.js"></script> 引入同路徑下的 xxx.js 文件中的 JavaScript 代碼抽高；
<script src=
"js/main.js"
</script>
注意這里的 main.js 是與當(dāng)前 Html 頁(yè)面文件同目錄下的 js 子目錄中的文件判耕，使用時(shí)，確保相對(duì)路徑正確翘骂，當(dāng)然了壁熄，也可以使用絕對(duì)路徑。
3碳竟、Html5 界面元素事件直接賦與一段 JavaScript 代碼草丧；
<input type=
"button"
name=
"Button"
value=
"Button"
onclick=
"javascript：alert('測(cè)試')"
4.通過(guò)其他網(wǎng)站CDN直接進(jìn)行添加
<script src="http://cdn.uedsc.com/jquery/2.1.3/jquery.js"></script>
此處可參考 javascript設(shè)置onclick
以下資源可供參考，進(jìn)一步理解 JavaScritp：JavaScript的5種調(diào)用函數(shù)的方法
解讀ECMAScript[1]——執(zhí)行環(huán)境莹桅、作用域及閉包
解讀ECMAScript[2]——函數(shù)昌执、構(gòu)造器及原型
百度百科 javascript
要想真正掌握 JavaScript 語(yǔ)言，那么閉包是必須要深刻理解和領(lǐng)悟的核心诈泼。
順便懂拾，記錄一下引用 [CSS] 的幾種方式：
1、外部樣式表
css 樣式存于一個(gè) .css 擴(kuò)展名的文件中铐达，引用方式：
<link href=
"../Styles/Site.css"
rel=
"stylesheet"
type=
"text/css"
2岖赋、內(nèi)部樣式表
<title>page標(biāo)題</title>
<style type=
"text/css"
input{background-color:Green }
</style>
3、內(nèi)聯(lián)樣式
<input type=
"text"
style=
"background-color:Blue;"
value=
"input1"
更詳細(xì)的 CSS 運(yùn)用瓮孙，可參考 CSS 選擇器及各樣式引用方式介紹 贾节。
最后，切入主題衷畦，頁(yè)面加載初始調(diào)用 JavaScript 代碼的三種方式：
1栗涂、body 的 onload 事件觸發(fā)回調(diào) JavaScript 函數(shù)；
該事件在 document 文檔中的所有內(nèi)容都加載完成后才會(huì)被調(diào)用祈争，這種方式顯得有點(diǎn)笨拙斤程，但比較把握，確保一切安好，才去調(diào)用忿墅。
如想避勉過(guò)多加載扁藕，那么頁(yè)面設(shè)計(jì)上可以相對(duì)講究些方法，人為達(dá)到滯后加載的效果疚脐，就可以給這個(gè)事件進(jìn)行減壓亿柑，達(dá)到盡快執(zhí)行的目標(biāo)。
2棍弄、document 的 onready 事件觸發(fā)回調(diào) JavaScript 函數(shù)望薄；
document.onready = init();
該事件在 document 文檔中的 dom 模型加載完成就會(huì)產(chǎn)生回調(diào)，而不考慮引用的圖片呼畸、腳本等資源痕支。
3、在引入 Html5 頁(yè)面的 JavaScript 代碼中蛮原，直接調(diào)用 JavaScript 函數(shù)或執(zhí)行 JavaScript 命令卧须；
<script>
init();
</script>
或在外部 js 腳本中，直接調(diào)用 init();
init() 可以是 Html5 頁(yè)面中聲明的函數(shù)儒陨，也可以是外部引用的腳本中的函數(shù)花嘶。
不過(guò)發(fā)現(xiàn)一個(gè)有趣的問(wèn)題，當(dāng)在 init() 函數(shù)定義中蹦漠，通過(guò)
document.getElementById(
'container'
);
獲取 container 元素的引用時(shí)椭员，如果該 Html5 元素在該段頁(yè)面內(nèi) JavaScript 代碼之后時(shí)，會(huì)獲取不到該元素津辩。
這說(shuō)明一個(gè)問(wèn)題拆撼，第三種啟動(dòng)執(zhí)行方式，是邊加載邊執(zhí)行喘沿，所以對(duì)順序有要求闸度；
4.網(wǎng)站使用CDN的好處和弊端
1、多域名加載資源
一般情況下蚜印，瀏覽器都會(huì)對(duì)單個(gè)域名下的并發(fā)請(qǐng)求數(shù)（文件加載）進(jìn)行限制莺禁，通常最多有4個(gè)，那么第5個(gè)加載項(xiàng)將會(huì)被阻塞窄赋，直到前面的某一個(gè)文件加載完畢哟冬。
因?yàn)镃DN文件是存放在不同區(qū)域（不同IP）的，所以對(duì)瀏覽器來(lái)說(shuō)是可以同時(shí)加載頁(yè)面所需的所有文件（遠(yuǎn)不止4個(gè)）忆绰，從而提高頁(yè)面加載速度浩峡。
2、文件可能已經(jīng)被加載過(guò)并保存有緩存
一些通用的js庫(kù)或者是css樣式庫(kù)，如jQuery，在網(wǎng)絡(luò)中的使用是非常普遍的。當(dāng)一個(gè)用戶在瀏覽你的某一個(gè)網(wǎng)頁(yè)的時(shí)候拷邢，很有可能他已經(jīng)通過(guò)你網(wǎng)站使用的CDN訪問(wèn)過(guò)了其他的某一個(gè)網(wǎng)站纸淮，恰巧這個(gè)網(wǎng)站同樣也使用了jQuery平斩，那么此時(shí)用戶瀏覽器已經(jīng)緩存有該jQuery文件（同IP的同名文件如果有緩存，瀏覽器會(huì)直接使用緩存文件咽块，不會(huì)再進(jìn)行加載）绘面，所以就不會(huì)再加載一次了，從而間接的提高了網(wǎng)站的訪問(wèn)速度侈沪。
3揭璃、高效率
你的網(wǎng)站做的再NB也不會(huì)NB過(guò)百度NB過(guò)Google吧？一個(gè)好的CDNs會(huì)提供更高的效率峭竣，更低的網(wǎng)絡(luò)延時(shí)和更小的丟包率塘辅。
4晃虫、分布式的數(shù)據(jù)中心
假如你的站點(diǎn)布置在北京皆撩，當(dāng)一個(gè)香港或者更遠(yuǎn)的用戶訪問(wèn)你的站點(diǎn)的時(shí)候，他的數(shù)據(jù)請(qǐng)求勢(shì)必會(huì)很慢很慢哲银。而CDNs則會(huì)讓用戶從離他最近的節(jié)點(diǎn)去加載所需的文件扛吞，所以加載速度提升就是理所當(dāng)然的了。
5荆责、內(nèi)置版本控制
通常滥比，對(duì)于CSS文件和JavaScript庫(kù)來(lái)說(shuō)都是有版本號(hào)的，你可以通過(guò)特定版本號(hào)從CDNs加載所需的文件做院，也可以使用latest加載最新版本（不推薦）盲泛。
6、使用情況分析
一般情況下CDNs提供商（如百度云加速）都會(huì)提供數(shù)據(jù)統(tǒng)計(jì)功能键耕，可以了解更多關(guān)于用戶訪問(wèn)自己網(wǎng)站的情況寺滚，可以根據(jù)統(tǒng)計(jì)數(shù)據(jù)對(duì)自己的站點(diǎn)適時(shí)適當(dāng)?shù)淖龀鲂┰S調(diào)整。
7屈雄、有效防止網(wǎng)站被攻擊
一般情況下CDNs提供商也是會(huì)提供網(wǎng)站安全服務(wù)的村视。
