、下面是三種button點擊的方法。

1. btn.onclick=function(){}
2. btn.addEventListener("click",function(){})
3. function btclick(){} 前提是標簽里有onclick="btclick()"

• 第1種方法參看javascript通過dom實現按鈕點擊事件。【303】
• 第3種方法參看最簡單的網頁按鈕單擊函數響應事件，基于javascript。【302】

二、第2種方法就看我下面的表現了。

做個按鈕

加入javascript，dom取得按鈕元素。

添加click監聽函數。

ss實現常用的開關按鈕功能，常用在一些網站的設置頁面中，一般用在手機端的頁面比較多，實現的做法有很多，可以利用圖片完成，也可以用css和js完成！具體效果如下：

實現代碼：

html結構：

css樣式：

js:

一篇文章我們說了單選框、多選框以及下拉框的使用，今天呢我們繼續看一下表單剩下的常用控件：提交按鈕以及重置按鈕。

（1）提交按鈕

提交按鈕，顧名思義就是當我們填好了表單中的數據之后，我們需要通過提交按鈕來將數據傳遞到后臺的服務器中，供后臺程序使用。

使用語法：<input type="submit" value="提交數據">

詳細講解：

1、type：只有當type值設置為submit時，按鈕才有提交作用，才能正常的進行表單的提交。（或者使用JavaScript代碼來觸發提交事件，這個到后期我們講解js的時候我進行介紹）

2、value：按鈕上顯示的文字，顯示按鈕的名稱。

（2）重置按鈕

當用戶需要重置表單信息到初始時的狀態時，比如用戶輸入“用戶名”后，發現書寫有誤，可以使用重置按鈕使輸入框恢復到初始狀態。只需要把type設置為"reset"就可以。

使用語法：<input type="reset" value="重置數據">

詳細講解：

1、type：只有當type值設置為reset時，按鈕才有重置作用，點擊按鈕會將form表單內的所有信息還原到初始未輸入的狀態。

2、value：按鈕上顯示的文字，顯示重置按鈕的名稱

使用練習：

我們創建一個表單，數據我們以post的形式提交到百度首頁，表單里邊有姓名和年齡的輸入框，并且添加提交數據按鈕以及重置數據按鈕。具體代碼如下圖所示：

在網頁中的顯示效果就如下圖所示：

我們在姓名和年齡輸入框中輸入內容，點擊重置數據既可以清空里邊的內容，還原到初始狀態，點擊提交數據按鈕，那么數據將會提交到我們的指定鏈接處。

以上呢就是表單最常用的一些控件了，接下來我們對學到的表單知識進行一次綜合的測試，我們來寫一個完整的表單包含我們學到的所有知識。

我們在這里就寫一個網站制作常用的留言表，表格名稱就叫留言表，然后表中包含有姓名輸入框、性別單選框（默認選中男）、愛好多選框（默認選中第一個）、所在地區下拉框、留言內容多行文本框，以及提交信息按鈕和重置信息按鈕。數據提交呢我們還是提交到百度，提交類型我們使用post。具體的代碼如下圖所示：

在網頁中的顯示效果就如下圖所示：

好了，到了這里我們的第一個表單就算是做完了，到這有人就會問了，為什么別人的代碼在瀏覽器上看起來都是那么的規整，我這么寫完看著怎么這么丑，接下來的文章我們將為大家介紹css的知識了，學習了css你也可以將你的頁面做的高達上起來。最后大家看完一定要自己動手寫一寫，只有自己寫出的代碼才能體會到其中的樂趣，多加練習才是王道。

每日金句：人生最大的喜悅是每個人都說你做不到，你卻完成它了！喜歡我的文章的小伙伴記得關注一下哦，每天將為你更新最新知識。