iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 9
1
自我挑戰組

前端成長日記系列 第 9

網頁程式入門: jQuery

  • 分享至 

  • xImage
  •  

今天談談jQuery

HTML和CSS都不是程式語言,前者是「標記語言」,後者是「樣式」,想要讓網頁能有互動性、接後端資料的話,就要靠程式語言JavaScript了。

jQuery這款以JS寫成的函式庫,相對於JS是較好入門的,且功能也相當完整。

二話不說先打出jQuery起手式:

$().();

1.第一個括號可以想像成CSS選擇器,放入字串
2.在點點後面放要偵聽的事件,例如click, mousedown, hover.
3.第二個括號放入當事件發生時要執行的函式。

$("p").click(function(){
	alert("Hello");
});

這樣的結果就是,當<p>元素被點到時,瀏覽器會彈出對話框顯示'Hello'。

同樣的效果以JS來寫,可能會長這樣:

var p = document.getElementsByTagName('p')[0];
p.addEventListener('click', function(){
	alert('Hello');
});

jQuery是不是簡單多了呢?雖然jQuery當初是為了跨瀏覽器這個現在已相對不嚴重的問題而出現,但簡單易用的語法到今日仍廣受歡迎。


上一篇
美化網頁: CSS
下一篇
個人網站
系列文
前端成長日記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言