僅供參考!
<form>
? <!--當(dāng)點擊相應(yīng)按鈕,執(zhí)行相應(yīng)操作,為按鈕添加相應(yīng)事件-->
??? <input type="button" value="改變顏色" onclick = "updateColor()"> ?
??? <input type="button" value="改變寬高" onclick = "updateWidthAndHeight()">
??? <input type="button" value="隱藏內(nèi)容" onclick = "hidingContent()">
??? <input type="button" value="顯示內(nèi)容" onclick = "displayContent()">
??? <input type="button" value="取消設(shè)置" onclick = "cancelSet()">
? </form>
? <script type="text/javascript">
//定義"改變顏色"的函數(shù)
??? var txt_document = document.getElementById('txt');
?? ?
??? function updateColor(){
??????? txt_document.style.color = "green";
??????? txt_document.style.backgroundColor = "black";
??? }
//定義"改變寬高"的函數(shù)
??? function updateWidthAndHeight(){
??????? txt_document.style.width = "200px";
??????? txt_document.style.height = "300px";
??? }
//定義"隱藏內(nèi)容"的函數(shù)
??? function hidingContent(){
??????? txt_document.style.display="none";
??? }
//定義"顯示內(nèi)容"的函數(shù)
??? function displayContent(){
??????? txt_document.style.display="block";
??? }
//定義"取消設(shè)置"的函數(shù)
??? function cancelSet(){
??????? var confirm_res = window.confirm("確定要取消設(shè)置嗎?");
??????? if(confirm_res){
??????????? txt_document.removeAttribute("style");
??????? }else{
??????????? return false;
??????? }
??? }
? </script>
2022-07-30
add