增加、创建、修改
- document.createElement(nodename) :创建一个新的标签节点
- document.createTextNode(text): 创建新的文本内容
- node.appendChild(node):向一个节点尾部插入一个新的节点
- node.insertBefore(newnode,existingnode):向一个节点首部插入一个新的节点
- document.createAttribute(attributename)
删除
- parentNode.removeChild(childNode):删除节点
查询
- document.getElementById(elementID): 根据id查寻
- document.getElementsByClassName(className): 根据类名查询,返回一个数组,通过下标获取并进行操作
- document.getElementsByTagName(TagName): 根据标签元素查询,返回一个数组
- document.querySelector(CSS selectors): 根据选择器查询,所以 #、.都要带上,返回查询到的第一个元素
- document.querySelectorAll(CSS selectors):根据选择器查询,返回一个数组
js修改样式
- document.querySelector(CSS selectors).style[‘display’] = ‘none’;
- document.getElementById(id).style.property = new style;:直接修改样式属性值
对应的可选的property:property
-
document.querySelector(CSS selectors).className += ’ CSS selectors’: 有一个空格,通过添加类名
-
document.querySelector(CSS selectors).style.cssText :内联样式