js中改变不同的div属性值的操作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#div3{
    width:200px;
    height:200px;
    background:#FF0;
    }
</style>
<script>
function setColor(name,value)
{
    var oDiv=document.getElementById(‘div3‘);
    oDiv.style[name]=value;
}
</script>
</head>

<body>

<input type="button" value="变宽"  onclick="setColor(‘width‘,‘500px‘)"   />
<input type="button" value="变高"  onclick="setColor(‘height‘,‘500px‘)"/>
<input type="button"  value="变颜色"  onclick="setColor(‘background‘,‘green‘)"/>
<div id="div3"></div>
</body>
</html>
时间: 2024-07-31 10:21:22

js中改变不同的div属性值的操作的相关文章

在js中获取页面元素的属性值时,弱类型导致的诡异事件踩坑记录,

前几天写一个js的时候遇到一个非常诡异的事情,这个问题是这样的,我要获取一个页面的DOM元素的val值,判断这个值是否比某个变量大,这个需求原先数字最大也就是10,现在要改了,可能会更多,这个时候我发现比较大小的判断就出了问题: 代码粘出来: 1 // js弱类型导致的诡异现象,11 > 9 false 2 function downtest(id){// 现象是当val取到的元素val值是11的时候,11>9结果是false 3 // 当前点击下一题的是第几题, 4 var val=$(&q

JS中改变CSS样式以及阻止冒泡总结

在JS中改变CSS样式,一般是通过鼠标或者键盘事件触发调用函数来实现CSS样式的改变,采用“className.style.stylename="";”来实现,例如 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>DOM编程挑战</title> <link rel="stylesheet" type

JS使用getComputedStyle()方法获取CSS属性值

在对网页进行调试的过程中,经常会用到js来获取元素的CSS样式,方法有很多很多,现在仅把我经常用的方法总结如下: 1. obj.style:这个方法只能JS只能获取写在html标签中的写在style属性中的值(style="-"),而无法获取定义在<style type="text/css">里面的属性. 2. IE中使用的是obj.currentStyle方法,而FF是用的是getComputedStyle 方法 "DOM2级样式"

JS中的RegExp对象常用属性和方法

JavaScript提供了一个RegExp对象来完成有关正则表达式的操作和功能,每一条正则表达式模式对应一个RegExp实例.有两种方式可以创建RegExp对象的实例. 使用RegExp的显式构造函数,语法为:new RegExp("pattern"[,"flags"]). ~~~构造函数 new RegExp(..) 使用RegExp的隐式构造函数,采用纯文本格式:/pattern/[flags]. ~~~正则字面量 pattern部分为要使用的正则表达式模式文本

深入了解JS中通过[]和.获取对象属性的区别

一般来说,'.'运算符和[]可以相互替代,比如 1 let obj = { 2 name : 'sena' 3 }; 4 5 console.log(obj.name) // 'sena' 6 console.log(obj[name]) // 'sena' 在这之上,我们需要了解关于他们的一些限制 .运算符:  右侧必须是一个属性名称命名的简单标识符 [] :  右侧必须是一个计算结果为字符串的表达式 先复习一下JS中的标识符: /* 标识符 - 在JS中所有的可以由我们自主命名的都可以称为是

href标签中target的几个属性值

没有指定<a>的target属性值时,默认是"_blank,可以参考以下代码的设置来控制<a href="#" target="_blank">链接</a> target的值target="_blank":在新窗口中浏览新的页面. target="_self":在同一个窗口打开新的页面. target="_parent":在父窗口中打开新的页面.(页面中使用框架

android中GridView关于间距的属性值介绍

android:columnWidth  设置列的宽度.关联的方法为:setColumnWidth(int)  stretchMode属性值的作用是设置GridView中的条目以什么缩放模式去填充空间.参数stretchMode 可选值:NO_STRETCH,STRETCH_SPACING,STRETCH_SPACING_UNIFORM,或STRETCH_COLUMN_WIDTH android:gravity  设置此组件中的内容在组件中的位置.可选的值有:top.bottom.left.ri

webBrowser控件中获取元素 的class 属性值

html 代码如下: <TR id="t030006" class="sr plus selected"> <TD><INPUT id=cvrgNo030006 value=030006 readOnly CHECKED type=checkbox jQuery1456994811776="96"></TD> <TD>车辆损失险 </TD> <TD style=&quo

js解析xml,获取XMl标签属性值

<script type="text/javascript"> var xml="<?xml version=\"1.0\" encoding=\"UTF-8\"?>" +"<RecordInfo camId=\"1000000$1$0$0\" count=\"12\" />"; $(function(){ //加载xmlDoc v