<form>
? <!--當點擊相應按鈕，執行相應操作，為按鈕添加相應事件-->
??? <input type="button" value="改變顏色" onclick = "updateColor()"> ?
??? <input type="button" value="改變寬高" onclick = "updateWidthAndHeight()">
??? <input type="button" value="隱藏內容" onclick = "hidingContent()">
??? <input type="button" value="顯示內容" onclick = "displayContent()">
??? <input type="button" value="取消設置" onclick = "cancelSet()">
? </form>
? <script type="text/javascript">
//定義"改變顏色"的函數
??? var txt_document = document.getElementById('txt');
?? ?
??? function updateColor(){
??????? txt_document.style.color = "green";
??????? txt_document.style.backgroundColor = "black";
??? }

//定義"改變寬高"的函數
??? function updateWidthAndHeight(){
??????? txt_document.style.width = "200px";
??????? txt_document.style.height = "300px";
??? }

//定義"隱藏內容"的函數
??? function hidingContent(){
??????? txt_document.style.display="none";
??? }

//定義"顯示內容"的函數
??? function displayContent(){
??????? txt_document.style.display="block";
??? }

//定義"取消設置"的函數
??? function cancelSet(){
??????? var confirm_res = window.confirm("確定要取消設置嗎？");
??????? if(confirm_res){
??????????? txt_document.removeAttribute("style");
??????? }else{
??????????? return false;
??????? }
??? }

? </script>