JS操作属性和样式

元素属性JS有两种获取元素属性的方式：
1）元素.属性名

var div1 = document.getElementById('div1');

div1.style.width = '100px';
2）元素[‘属性名’]

var div1 = document.getElementById('div1');

div1.style['width'] = '100px';
两种方式的区别：
1）第一组种方式简单、好用。
2）第二组方式可以解决一些第一种方式解决不了的问题，例如通过参数传递属性名。

1 操作元素内容
简介：
元素内容指开始标签与结束标签之间的内容，单标签没有元素内容，表单标签除外。

1.1操作闭合标签内容
1.闭合标签的内容需要设置或修改，使用闭合标签的innerHTML属性。
语法：
设置：标签.innerHTML = “内容”；
获取：var text = 标签.innerHTML；

1.2操作表单元素内容

操作表单元素用的是表单的value属性。

2 js操作元素属性

语法：

元素.属性名 = “属性值”;

3 js操作元素样式

语法：

元素.style.样式名 = “样式值”;

4 cssText

cssText用于设置html的style属性值，

二、js操作元素属性和获取元素的方法
2.1js操作元素属性
2.1.1.获取双标签中的内容
a.获取元素

var obj = document.getElementById（“id名”）；

修改元素内容

obj.innerHTML = “”;

2.2.2.操作input中的值
var txt = document.getElementById（“id名”）；

txt.value = " ";
三、JS操作元素内容的方法
3.1操作普通双标签
操作普通双标签    innerText
作用1    获取元素的纯文本内容
用法    元素.innerText
例子    看5.1
作用2    设置元素的内容
用法    元素.innerText = “值”
例子    看5.1
注意点    内容中有html 标签的话 是不会被解析的
操作普通双标签    innerHTML
作用1    获取元素的内容
用法    元素.innerHTML
例子    看5.2
作用2    设置元素的内容
用法    元素.innerHTML= “值”