• 招生咨詢熱線:4008-569-579 
  • 手機版
    用手機掃描二維碼直達商品手機版
招生咨詢熱線
4008-569-579
機構(gòu)主頁 > 培訓資料 > Web前端培訓:通過將 JavaScript 移動到外部文件來改進網(wǎng)頁
機構(gòu)主頁 > 培訓資料>Web前端培訓:通過將 JavaScript 移動到外部文件來改進網(wǎng)頁

Web前端培訓:通過將 JavaScript 移動到外部文件來改進網(wǎng)頁

來源:廣州達內(nèi)教育        時間:2023-05-30        熱度:35℃        返回列表

  將 Javascript 直接放入包含網(wǎng)頁 HTML 的文件中非常適合在學習 Javascript

時使用的短腳本。對Javascript 感興趣的同學可以參加Web前端培訓,在專業(yè)老師的指導下,可以獲得高效的學習。


  但是,當你開始創(chuàng)建腳本來為你的網(wǎng)頁提供重要功能時,Javascript

的數(shù)量可能會變得非常大,并且將這些大型腳本直接包含在網(wǎng)頁中會帶來兩個問題:如果 Javascript

占據(jù)了頁面內(nèi)容的大部分,它可能會影響你的頁面在各種搜索引擎中的排名。這降低了使用關鍵字和短語來識別內(nèi)容的頻率;這使得在你網(wǎng)站的多個頁面上重用相同的

Javascript 功能變得更加困難。每次你想在不同的頁面上使用它時,你都需要將其復制并插入到每個附加頁面中,以及新位置所需的任何更改。


  如果我們讓 Javascript 獨立于使用它的網(wǎng)頁會更好。


  選擇要移動的 Javascript 代碼


  幸運的是,HTML 和 Javascript 的開發(fā)者已經(jīng)為這個問題提供了解決方案。我們可以將我們的 Javascript

移出網(wǎng)頁,但仍保持其功能完全相同。


  我們需要做的第一件事是在使用它的頁面外部創(chuàng)建 Javascript 代碼,即選擇實際的 Javascript

代碼本身(不包括周圍的 HTML 腳本標簽)并將其復制到單獨的文件中。參加web前端培訓,可以幫助你快速掌握

Javascript的使用技能,更好地進行開發(fā)工作。




  例如,如果以下腳本在我們的頁面上,我們將選擇并復制粗體部分:


  <script type="text/javascript">

  var hello = Hello World;

  document.write(hello);

  </script>


  曾經(jīng)有一種做法是將 Javascript 放在 HTML 文檔中的注釋標記內(nèi),以阻止舊版瀏覽器顯示代碼; 但是,新的

HTML 標準規(guī)定瀏覽器應該自動將 HTML 注釋標簽內(nèi)的代碼視為注釋,這會導致瀏覽器忽略你的 Javascript。


  如果你從其他人那里繼承了帶有注釋標簽內(nèi)的 Javascript 的 HTML 頁面,那么你不需要在你選擇和復制的

Javascript 代碼中包含這些標簽。


  例如,你將只復制粗體代碼,省略以下代碼示例中的 HTML 注釋標記 <!-- and

-->:


  <script type="text/javascript"><!--

  var hello = Hello World;

  document.write(hello);

  // --></script>


  將 Javascript 代碼保存為文件


  選擇要移動的 Javascript

代碼后,將其粘貼到新文件中。為文件命名,以暗示腳本的作用或標識腳本所屬的頁面。在Web前端培訓中,會有很多實操項目的練習課程,可以充分激發(fā)你的創(chuàng)造性思維,讓你掌握技能的同時,還能提高解決問題的能力。


  給文件一個 .js 后綴,以便你知道該文件包含 Javascript。例如,我們可以使用 hello.js 作為保存上例中的

Javascript 的文件名。




  鏈接到外部腳本


  現(xiàn)在我們已經(jīng)將我們的 Javascript 復制并保存到一個單獨的文件中,我們需要做的就是在我們的 HTML

網(wǎng)頁文檔中引用外部腳本文件。


  首先,刪除腳本標簽之間的所有內(nèi)容:


  <script type="text/javascript">

  </script>


  這還沒有告訴頁面運行什么 Javascript,所以我們接下來需要向 script

標簽本身添加一個額外的屬性,告訴瀏覽器在哪里可以找到腳本。


  我們的示例現(xiàn)在看起來像這樣:


  <script type="text/javascript"

  src="hello.js">

  </script>


  src 屬性告訴瀏覽器應該從中讀取該網(wǎng)頁的 Javascript 代碼的外部文件的名稱(在我們上面的示例中是

hello.js)。你不必將所有的 Javascript 放在與 HTML 網(wǎng)頁文檔相同的位置。你可能希望將它們放入單獨的 Javascript

文件夾中。在這種情況下,你只需修改 src 屬性中的值以包含文件的位置。你可以為 Javascript 源文件的位置指定任何相對或絕對 Web

地址。


  你現(xiàn)在可以獲取你編寫的任何腳本或從腳本庫中獲取的任何腳本,并將其從 HTML 網(wǎng)頁代碼移動到外部引用的 Javascript

文件中。然后,你可以通過添加調(diào)用該腳本文件的適當 HTML 腳本標簽從任何網(wǎng)頁訪問該腳本文件。通過Web前端培訓的學習,你不僅能夠掌握

Javascript的技術(shù)應用,也會對其底層原理有所了解,并通過實戰(zhàn)項目,具備獨立負責 Javascript相關項目的能力。

電話咨詢

電話咨詢

咨詢電話:
4008-569-579
回到頂部

回到頂部