1.样式操作
总结：obj.className=x 设置类名为x
obj.classList 获取obj对象的所有类
obj.classList.add('c1') 在obj对象中添加类c1
obj.classList.remove('c2') 在obj对象中删除类c2
obj.style.fontSize='16px' 设置属性fontSize为16像素
2.属性操作
总结：obj.attributes 获取obj对象的所有属性
obj.getAttribute(x) 获取属性x
obj.removeAttribute (x) 删除属性x
obj.setAttribute(x,y) 添加属性x对应y值
3.创建标签
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="button" value="+" onclick="addlabel1();" /> <input type="button" value="+" onclick="addlabel2();" /> <div id="i1"> <input type="text" style="height:20px;width:50px;" /> </div> <script> function addlabel1(){ var tag='<p><input type="text"></p>'; //字符串形式的创建标签方法 document.getElementById('i1').insertAdjacentHTML("beforeBegin", tag) } function addlabel2(){ var tag=document.createElement('input'); //对象形式的创建标签方法 tag.type='text'; tag.style.height='20px'; tag.style.width='50px'; var p=document.createElement('p'); p.appendChild(tag); //将tag标签放在p标签里面 document.getElementById('i1').appendChild(p); } </script> </body> </html>
在addlabel1()中，insertAdjacentHTML的第一个参数有4种形式，除了上面的beforeBegin(在开始之前)，还有 beforeEnd(在结束之前)，AfterBegin(开始之后)，AfterEnd(结束之后)。