js 函数传参改变div属性

<!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>

效果图：

js 函数传参改变div属性相关推荐

JS函数传参时:值传递与引用传递的区别
JS函数传参时:值传递与引用传递的区别一.先分析基础数据与复杂数据的区别 : 基本数据类型:Undefined.Null.Boolean.Number.String 引用数据类型:对象如:var ...
论JS函数传参时:值传递与引用传递的区别
JS函数传参时:值传递与引用传递的区别? 值传递:值传递的数据为基本数据类型,基本数据类型在内存中存放的是数值本身:值传递为单向传递,只能由实参传递给形参. 引用传递:引用传递的数据为复杂数据类型,复 ...
JS一起学02：函数传参、操作属性第二种方式、提取行间事件、循环、this、焦点问题、联动选择、选项卡焦点图
一.函数传参 1.函数传参:参数就是占位符----函数里定不下来的东西 var a1=function(){ alert(123); }; function a(f){ // 相当于 f=a1 ...
js函数传参解密
js 中的函数我们用了太多太多次了,但是关于函数的参数今天还是要说道说道. 1.js函数的参数分为两种,一种是显示参数,一种为隐式参数. 显示参数:在函数定义时列出隐式参数:在函数调用时传递的参数值 ...
js函数传参时：值传递和引用传递的区别
值传递是单向的传递,只能由实参传递给形参,而不能由形参传递给实参,因为值传递的数据,地址和值是一个内容,所以修改形参的数据不会影响到实参的数据.所以形参的改变不会影响到实参. 值传递就是在函数调用中函 ...
js 函数传参实参包含路径“\”处理
var test = "D:\blockchain\webapps\uxdm\WEB-INF\classes\com"; //包含路径的实参 ...
JS一起学05：Date对象、封闭空间、函数传参和封装、获取非行间样式、字符串操作
一.Date对象 1. 获取 oDate.getFullYear() 获取年份 oDate.getMonth()+1 获取月份 0-11----->1-12 oDate.getDate() 获 ...
用js实现改变随意改变div属性style的名称和值的结果
一些简单的例子,用原生js和jQuery实现随意改变div属性,和重置.代码如下: <!DOCTYPE html> <html> <head> <me ...
java div style_用js实现改变随意改变div属性style的名称和值的结果
一些简单的例子,用原生js和jQuery实现随意改变div属性,和重置.代码如下: 函数传参,改变Div任意属性的值 body,p{margin:0;padding:0;} body{color:#3 ...
函数传参之商品价格计算—JS学习笔记2015-6-6（第50天）
经常我们可以看到很多网站会有多个相同功能的模块,比如淘宝首页的轮播,比如新浪首页的tab切换: 那么可以看出这些地方在HTML结构上是类似的,所以我们可以考虑用一块功能代码去实现,而不同是仅仅是传递参 ...

js 函数传参改变div属性

js 函数传参改变div属性相关推荐

最新文章

热门文章