[簡介] JavaScript 讓你的網頁動起來!

123 - [簡介] JavaScript 讓你的網頁動起來!

忙完期中考後,心思就放在漫畫網的架設上,對網頁的語法其實並沒有很熟悉,所以也是想趁這個機會認識一下JavaScript是怎麼樣的一個運作方式,結果一陷進去就難以自拔了,原因在於語法簡單清楚,和C沒有太大的不同,操作起來又非常的好玩,雖然說如果只用記事本編輯、又沒有良好的習慣,很容易因為少一個分號而東找西找除不到錯XD


語法說明

我們一樣會需要一般的HTML元素,讓網頁上呈現一些可以被觸發的元件。以下即以按下按鈕後改變背景顏色的範例來說明JavaScript和HTML是如何相輔相成,在網頁上展現活力。

<form>
<input onclick=”change_color()” type=”button” value=”按下我背景變紅” />
</form>
<script language=”javascript”>
function change_color()
{
document.body.style.backgroundColor = “red”;
}
</script>

(由於本文在Blogger的框架中,這個按鈕是無效的)

Js的程式碼通常會被包在一個Function內,而在以一個網頁元件的事件中被觸發,這是最基本的一個例子,可以清晰地看出Js的結構和寫法,另外,網頁的元素還可以搭配CSS語法來做美化,將這三種不同的要素發揮到淋漓盡致,做出來的網站也會相對的漂亮和時尚許多。

  •  
  •  
  •  
  •  
  •  
  •  

沒有迴響

  • 匿名

    2013-12-06

    棒喔!現在關掉網站了… 作業系統大多用ubuntu 不想架站了 XD by.bla

    回復
  • 匿名

    2013-12-06

    哈!開燈鈕還沒做好 by.bla

    回復
  • 燒餅

    2013-12-07

    ubuntu!好酷喔XD 為什麼選擇它?

    回復
  • 燒餅

    2013-12-07

    被發現了哈哈 燈關掉了就回不來~

    回復
  • 燒餅

    2013-12-07

    架站我還是推薦虛擬主機啦,除非有特殊需求,不然實體機很耗電,划不來

    回復
  • 匿名

    2013-12-07

    免費虛擬主機用一下就不能用了…
    所以我才選擇本機
    最重要的是 上傳速度超快!
    by.bla

    回復
  • 燒餅

    2013-12-07

    其實現在要付費的也都很便宜,為了興趣花點小錢也還可以,只是很容易棄坑XD

    回復
  • 匿名

    2013-12-07

    lionhost原來是因為我架discuz所以被封了
    我現在重新架設
    DISCUZ的部份用到 http://ibbs.tw/

    給你我的3個網站XD by.bla

    回復
  • 匿名

    2013-12-07

    看過燒餅的蠟筆小新的程式碼才發現
    你教的好少阿!!!

    by.bla

    回復
  • 燒餅

    2013-12-08

    因為這篇是簡介嘛哈哈
    先為以後的各種語法舖個梗~
    話說好害羞啊,那程式碼很破爛的說xDD

    回復

留言