js中获取属性的三种方法及区别

1、通过点的方式

2、通过括号的方式

3、通过DOM的方式

例：

<input type="text" value="hello" id="text"/>
var oText = document.getElementById("text")

（1）通过点的方式   oText.property

注意的是：（a）点要查找的是JS中本来就存在的属性名，不能找到变量或者函数的参数，比如下面：

var  name = "value"
oText.name
//这种方式访问就会出错，因为用点的方式访问，它会去input的标签里面直接到有没有name的属性，如果没有就找不到，所以访问不到我们定义的这个变量的值
//而且如果name是某个函数的参数也不可以获取到，原理是一样的。所以封装函数属性需要作为参数的时候，访问的时候不要用点，用括号

（b）标准浏览器下无法访问HTML中的自定义属性，可以获取通过JS参加的自定义属性。

（c）无法获取相对网址，比如img.src获取的是绝对路径。

（2）通过括号的方式 oText[property]

（a）可以访问任何变量和参数；

（b）标准浏览器下无法访问HTML中的自定义属性，可以获取通过JS参加的自定义属性。

（c）无法获取相对网址，比如img.src获取的是绝对路径。

（3）通过DOM的方式

获取属性的值：getAttribute(属性名) 

设置属性的值：setAttribute(属性名，要设置的值)

删除属性：removeAttribute(属性名)

优势：

1 可以获取html中自定义的属性

2 获取的是相对网址，不过 IE7以下还是绝对网址

3 IE下可以通过style访问

<input type='text' style='width:100px;' />
var oText = document.getElementById("text")
//IE下可以这样用：oText.style.getAttribute('width') 标准浏览器不可以