使用jQuery操作的DOM
DOM操作分类
1.DOM core:任何一种支持DOM的编程语言都可以使用。 例如:getElementById()
2.HTML-DOM:用于处理HTML文档。例如:document.forms
3.css-DOM:用于操作css。例如:element.style.color=”green”;
javascript 对DOM这三种操作都提供了支持;
jQuery对javascript中的DOM操作进行封装,操作简单;
jQuery对DOM的操作可分为:
- 样式
- 内容及value属性操作
- 节点
- 节点属性
- 节点遍历
- css-DOM操作
直接设置样式值
$(" ").css(" ":" ");//"name","value"
$(" ").css({" ":" "," ":" "})//name与value用:隔开,每个name中间用,隔开
追加和移除样式
addclass("class");
removeclass("class");
切换样式
toggleclass()
HTML代码操作
html()//可以对HTML代码进行操作,类似于js中的innerHTML()
$("p").html();//获取元素中的html
document.getElementByName(".name").innerHTML();
html()与text()的区别
html() //网页内容或文本内容 用于获取
html(content) //网页内容或文本内容 用于设置
text() //文本内容 用于获取
text(content)//文本内容 用于设置
value值操作
$(this).val();//获取属性
$(this).val(" ");//设置属性
jQuery 节点操作主要分为:
- 查找节点(爬藤)
- 创建节点
- 插入节点
$(A).append(B);//B追加到A中
$(A).appended(B);//A被追加到B中
- 删除节点
remove();
- 替换节点
replaceWith();//一个
replaceAll();//一类
- 复制节点