一些簡單的例子，用原生js和jQuery實作隨意改變div屬性，和重置。程式碼如下： 複製程式碼 程式碼如下: html 函數傳參，改變Div任意屬性的值 <BR>body,p{margin:0;padding:0;} <BR>body{color:#333;font:12px/1.5 Tahoma;padding-top:10px;} <BR>#outer {width:300px;margin:0 auto;} <BR>p{margin-bottom:10px;} <BR>button{margin-right:5px;} <BR>label{width:5em;display:inline-block; text-align:right;} <BR>input{padding:3px;font-family:inherit;border:1px solid #ccc;} <BR>#div1{color:#fff;width:180px;height:180px;background :#000;margin:0 auto;padding:10px;} <BR> < /script> <BR><script type="text/javascript"> <BR><!DOCTYPE html> <BR><html> <BR><head> <BR><meta charset="utf-8"/> <BR><title>函數傳參，改變Div任意屬性的值 <BR><style type="text/css"> <BR>body,p{margin:0;padding:0;} <BR>body{color:#333;font:12px/1.5 Tahoma;padding-top:10px;} <BR>#outer{width:300px;margin:0 auto;} <BR>p{margin-bottom:10px; } <BR>button{margin-right:5px;} <BR>label{width:5em;display:inline-block;text-align:right;} <BR>input{padding:3px;font-family:inherit; border:1px solid #ccc;} <BR>#div1{color:#fff;width:180px;height:180px;background:#000;margin:0 auto;padding:10px;} <BR> <BR><script type="text/javascript" src="js/jquery-1.4.2.min.js"> <BR>/*var changeSytle = function (elem,name,value){ <BR>elem.style[name] = value; <BR>} <BR>window.onload = function (){ <BR>var oDiv = document.getElementById("div11 "); <BR>var oBtn = document.getElementsByTagName("button"); <BR>var oInput = document.getElementsByTagName("input"); <BR>oBtn[0].onclick = function ("input"); <BR>oBtn[0].onclick = function ("input"); <BR>oBtn[0].onclick = function ("input"); <BR>oBtn[0].onclick = function ("input"); <BR>oBtn[0].onclick = function ("){ <BR> changeSytle (oDiv,oInput[0].value,oInput[1].value) <BR>} , <BR>oBtn[1].onclick = function (){ <br>oDiv.removeAttribute("style"); 🎜>} <br>} */原生js部分實作<BR><BR>$(function(){ <BR>$("button:first").click(function(){ <BR>var styleName= $ ("#outer").find("input:first").val(); <BR>var styleVal = $("#outer").find("input:last").val(); <BR> $("#div1").css(styleName,styleVal); <BR>}) <BR>$("button:last").click(function(){ <BR>$("#div1").removeAttr ("style"); <br>}) <br>}) <br><br> 屬性名稱： 屬性值： 確定 button>重設 上方輸入框輸入"屬性名稱"及"屬性值"，點選確定按鈕查看效果。
