91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

JavaScript入門之三種引入方式怎么使用

發布時間:2022-08-03 17:04:59 來源:億速云 閱讀:127 作者:iii 欄目:web開發

這篇文章主要介紹“JavaScript入門之三種引入方式怎么使用”,在日常操作中,相信很多人在JavaScript入門之三種引入方式怎么使用問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”JavaScript入門之三種引入方式怎么使用”的疑惑有所幫助!接下來,請跟著小編一起來學習吧!

JavaScript入門之三種引入方式怎么使用

1.行內引入方式

寫在行內,每個標簽里面單獨設置

通過在開標簽中的事件屬性引用js的函數

(1)寫在標簽的事件屬性當中(以on開頭的屬性),如onclick【on+事件類型】

推薦:html使用雙引號,js使用單引號

例:

<input type="button" value="點我打開世界" onclick="alert('Hello World')" />

注:行內引入,在JS中沒用提升權重的概念,所以其不常用[基本不用]

示例如下:

<html>
  <title>js樣式內聯寫法</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <body>
  <!--js內聯寫法01開始-->
    <!--當鼠標點擊圖片時跳出彈窗顯示1223-->
    <div class="img">
    單擊事件:
      <img src="images/001.jpg" onclick="alert(1223)"></img>
    </div>
  <!--js內聯寫法01結束-->
  </body>
</html>

輸出結果:

JavaScript入門之三種引入方式怎么使用

2.內嵌引入方式(內部引入)

寫在script標簽中

內部引用: 通過在script標簽中編寫js代碼使用

  • script標簽可以寫在頁面任何位置

  • script標簽通常使用在body中的最后, 或者body的后面

(1)可以寫在任意地方;

當需要我們在頭部引用腳本就放在頭部,否則則放在底部,因為放在頭部可能會影響瀏覽器渲染。

<script>
    alert('Hello World!');
</script>

注:一般在自己寫練習的時候,想偷懶不想設置js文件時使用 [練習使用]

通常自己做項目的時候放在底部,不影響加載順序又可以和CSS文件進行區分,并且不會影響瀏覽器渲染;若放在其他處最好用onload套起來用

示例如下:

<html>
  <title>js樣式內聯寫法</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <body>
  <!--js內聯寫法02開始-->
  <div class="img">
    單擊事件:
      <img src="images/002.jpg" id='yuansu'></img>
  </div>
  <!--js內聯寫法02結束-->
  </body>
  <script>
    //js代碼
    //找到XX元素,一般給元素加id 
    yuansuojb=document.getElementById('yuansu');    
    //給xx元素加事件
    yuansuojb.onclick=function(){
      //代碼段
      alert(1);
    }
    //觸發事件
  </script>
</html>

輸出結果:

JavaScript入門之三種引入方式怎么使用

3.外部引入方式

在script標簽中使用src引入外部文件

步驟:

  • 編寫獨立的js文件

  • 在頁面中通過script標簽引用

(1)引入外部JS文件的script中不可以寫代碼

(2)利用HTML頁面代碼結構化,把多段JS代碼獨立至HTML頁面外面,美觀,且方便文件復用

<script src="main.js"></script>

注:和行內樣式一樣放在底部和頭部需要分情況考慮[經常使用]

使用的是src不是href

示例如下:

將js的代碼寫到.js的文件中,并在HTML中引用

.html文件內容如下:

<html>
  <title>js樣式外聯寫法</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <body>
  <div class="img">
    外聯寫法--單擊事件:
      <img src="images/003.jpg" id='yuansu'></img>
  </div>
  </body>
  <script src='js/index.js'></script>
</html>

.js文件內容如下:

//js代碼

//找到XX元素,一般給元素加id 
yuansuojb=document.getElementById('yuansu');    
//給xx元素加事件
yuansuojb.onclick=function(){
  //代碼段
  var str="hello world !!!";
  alert(str);
}

輸出結果:

JavaScript入門之三種引入方式怎么使用

到此,關于“JavaScript入門之三種引入方式怎么使用”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注億速云網站,小編會繼續努力為大家帶來更多實用的文章!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

墨竹工卡县| 万州区| 石狮市| 湟源县| 保德县| 黎城县| 叶城县| 普定县| 赤壁市| 英超| 乡城县| 句容市| 易门县| 彩票| 集安市| 富顺县| 固原市| 佛冈县| 阳曲县| 赣州市| 汉寿县| 安龙县| 岐山县| 安岳县| 临洮县| 祥云县| 景德镇市| 云和县| 通化市| 焉耆| 赫章县| 迭部县| 封开县| 天气| 新蔡县| 马鞍山市| 朝阳县| 天门市| 三亚市| 吉林省| 永州市|