<!DOCTYPE html><html><head><title>函数传参改变Div属性的值</title><style type="text/css">*{ margin: 0px; padding: 0px; text-align: center; }.bpp3{ margin: 20px 400px; width: 250px; height: 280px; position: relative; }.bpp3 input{ width: 150px; height: 30px; margin: 5px; }.bpp3 button{ width: 55px; height: 30px; margin: 20px; margin-top: 5px; float: right; }#Div{ width: 150px; height: 150px; background: black; position: absolute; bottom: 0px; left: 80px; color: #ffffff; font:12px/1.5 Tahoma; }</style></head><body><div class="bpp3"><label>属性名：<input type="text" value="background" /><br>属性值：<input type="text" value="red" /><br></label><button>重置</button><button>确定</button><div id="Div">在上方输入框输入"属性名"及"属性值"，点击确定按钮查看效果。</div></div><script type="text/javascript">// 传参函数var changestyle = function(element, attribute, value){element.style[attribute] = value;}window.onload = function(){// 获取元素var Iname = document.getElementsByTagName("label")[0].getElementsByTagName("input");var Ibtn = document.getElementsByClassName("bpp3")[0].getElementsByTagName("button");var Div = document.getElementById("Div");// 按钮的点击事件Ibtn[1].onclick = function(){changestyle(Div, Iname[0].value, Iname[1].value);}Ibtn[0].onclick = function(){Div.removeAttribute("style");}}</script></body></html>
效果图：
