js基础——属性操作
2015-06-14 00:10
471 查看
html属性:属性名——属性值
操作:读 、 写
读操作:用来获取、找到属性名对应的属性值,方法:元素.属性名
例如:var oBtn = document.getElementById('btn1');
alert(oBtn.value);
写操作:用来添加、替换、修改属性名与属性值,方法:元素.属性名 = 新的属性值
例如:var oSelect = document.getElementById('select1');
oSelect.value = "aaa";
但是,当我们读取或者设置class属性时,不可以直接写 元素.class,因为class为保留字,我们可以通过 元素.className来读取和设置该属性值
另外,在设置或者读取类似font-size、background-color等值时,不可以写作 元素.style.font-size,js不支持“-”,此时要写为“驼峰”式,即 元素.style.fontSize即可
对于img中的src属性,我们可以给其设置属性值,该值可以是绝对路径、相对路径以及URL地址,但是当我们在读取src属性时,该值是绝对路径,并且如果有中文的话,中文会经过UrlEncode编码之后返回,所以我们一般不可以利用这种方式进行判断if( oImg.src == 'img/1.jpg' ){},也就说src属性值不能作为判断条件,类似于src这种情况的还有:颜色值:color: red #f00 rgb() rgba()
现在,再说说float,如果直接进行这样设置:oDiv.style.float = 'right';,恐怕结果要让我们失望了,对于IE浏览器,我们需要这样设置:oDiv.style.styleFloat = 'right'; 对于非IE浏览器,我们这需要这样设置:oDiv.style.cssFloat = 'left';
额,还有input中的type属性,一般,我们是可以修改type属性的,不过IE6/7/8则不支持
操作:读 、 写
读操作:用来获取、找到属性名对应的属性值,方法:元素.属性名
例如:var oBtn = document.getElementById('btn1');
alert(oBtn.value);
写操作:用来添加、替换、修改属性名与属性值,方法:元素.属性名 = 新的属性值
例如:var oSelect = document.getElementById('select1');
oSelect.value = "aaa";
但是,当我们读取或者设置class属性时,不可以直接写 元素.class,因为class为保留字,我们可以通过 元素.className来读取和设置该属性值
另外,在设置或者读取类似font-size、background-color等值时,不可以写作 元素.style.font-size,js不支持“-”,此时要写为“驼峰”式,即 元素.style.fontSize即可
对于img中的src属性,我们可以给其设置属性值,该值可以是绝对路径、相对路径以及URL地址,但是当我们在读取src属性时,该值是绝对路径,并且如果有中文的话,中文会经过UrlEncode编码之后返回,所以我们一般不可以利用这种方式进行判断if( oImg.src == 'img/1.jpg' ){},也就说src属性值不能作为判断条件,类似于src这种情况的还有:颜色值:color: red #f00 rgb() rgba()
现在,再说说float,如果直接进行这样设置:oDiv.style.float = 'right';,恐怕结果要让我们失望了,对于IE浏览器,我们需要这样设置:oDiv.style.styleFloat = 'right'; 对于非IE浏览器,我们这需要这样设置:oDiv.style.cssFloat = 'left';
额,还有input中的type属性,一般,我们是可以修改type属性的,不过IE6/7/8则不支持
相关文章推荐
- JavaScript中使用自然对数ln的方法
- JavaScript中的Math.LOG2E属性使用详解
- 简介JavaScript中Math.LOG10E属性的使用
- JavaScript中使用Math.PI圆周率属性的方法
- JavaScript中的Math.SQRT1_2属性使用简介
- JavaScript中Math.SQRT2属性的使用详解
- 介绍JavaScript中Math.abs()方法的使用
- JavaScript中的acos()方法使用详解
- JavaScript中反正弦函数Math.asin()的使用简介
- 浅谈JavaScript中的Math.atan()方法的使用
- JS中的array迭代方法
- 2015061308 - 两个jsp页面之间数据传递的方式
- 深入 JavaScript
- [LeetCode][JavaScript]Compare Version Numbers
- 编写可维护的js代码-编程风格笔记
- JavaScript读书笔记(6)-Function
- 运算符1—JS学习笔记2015-6-13(第56天)
- Canjs基础教程之Mustach
- 再转JavaScript的原型
- jsp——学习篇:简单使用JavaScript