8.1.1 行為隔離 · javascript面向對象編程指南

一個網頁通常有三個元素 - 內容 - 外觀 - 行為 ##內容（HTML） - 盡量避免在HTML標簽中使用style屬性 - 不要使用與外觀有關的HTML標簽，例如<font> - 盡量根據語義需要來選擇標簽，而不是去考慮瀏覽器會如何繪制它們。 ##外觀（CSS）將外觀與內容分開，有一種好方法就是對瀏覽器默認的繪制行為進行重置。 ##行為（JS） - 盡可能少用<script>標簽 - 盡量不要使用內嵌事件的處理方法 - 盡量不要使用CSS表達式 - 當js被用戶禁用時，我們要動態地添加一些表示無目標的替換標記 - 在內容末尾、<body>標簽之前，插入一個external.js文件 ##行為隔離實例 ``` |-index.html//實例 ``` ##異步的js代碼載入 - 當<script>標簽被放置在<body>元素的最末，這么做是因為載入js代碼的過程會阻塞頁面DOM的構建，甚至某些瀏覽器中，一些需要下載的組件也會被阻塞。將<script>移動到頁面底部可以確保它形成阻塞，并且這段js被載入后只會增強這個基本功能已經完整的頁面。 - 另一種防止js文件阻塞頁面的方法是將他們異步載入，這么做的話，我們早一些開始載入它們。HTML5為此提供了defer屬性 ``` <script defer src='behaviors.js'></script> ``` 有部分老的瀏覽器不支持defer屬性，我們可以用動態創建script節點，然后將它插入DOM的方法來解決這個問題，而且這種方法新老瀏覽器都能接受。我們需要使用一些內聯js代碼來載入外部js文件。這段代碼可以放在文檔的頂部，這樣一來外部js文件就會早一些被載入： ``` <head> <script> (function(){ var s = document.createElement('script'); s.src = 'behaviors.js'; document.getElementByTagName('head')[0].appendChild(s); }); </script> </head> ```