JavaScript-DOM操作2

1.非表单元素的属性操作

href、title、id、src、className width height等等都属于非表单元素。

若将一个图片获取命名为imgBox想通过JavaScript修改图片的属性只需要以下操作

1.添加src属性值显示图片：imgBox.src = "images/jie.jpg";

2.改变图片大小：imgBox.width = 750;        imgBox.height = 500;

3.通过style改变宽高：imgBox.style.width = 750 + "px";        imgBox.style.height = 500 + "px";

通过样式属性设置宽高、位置的属性类型是字符串，需要加上px。凡是css中这个属性是多个单词的写法,在js代码中DOM操作的时候.把-干掉,后面的单词的首字母大写即可。

4.通过类名改变宽度： imgBox.className = "imgCl";（将img的属性名更改为imgCl。从而改变属性值）

5.隐藏元素：1、src=""        2、display=none;不占位置的        3、visibility="hidden

6.this的指向问题：

（1）普通函数中，this指向window 

（2）构造函数中，this指向实例化对象 

（3）对象函数中，this指向当前的对象

（4）事件函数中，this指向事件源

2.表单元素属性操作

value 用于大部分表单元素的内容获取(option除外)

type 可以获取input标签的类型(输入框或复选框等)

disabled 禁用属性checked 复选框选中属性

selected 下拉菜单选中属性

3.文本内容属性

innerText和textContent

使用innerText主要是设置文本的,设置标签内容,是没有标签的效果的

innerHTML是可以设置文本内容

innerHTML主要的作用是在标签中设置新的html标签内容,是有标签效果的

想要设置标签内容,使用innerHTML,想要设置文本内容,innerText或者textContent,或者innerHTML,推荐用innerHTML