DOM模型在页面文档中，通过树状模型展示页面的元素和内容，其展示的方式则是通过节点（node）来实现的。
3.1 访问元素
3.1.1 元素属性操作
Attr()可以对元素属性执行获取和设置操作，而removeAttr()方法则可以轻松删除某一指定的属性。
Attr(name):获取名为name的属性
Atrr(name1,value1;name2,value2……):设置属性
3.1.2 元素内容操作
操作元素内容的方法包括html()和text()。前者与JavaScript中的innerHTML属性类似，即获取或设置元素的HTML内容；后者类似于JavaScript中innerText属性，即获取或设置元素的文本内容。
|
语法格式 |
参数说明 |
功能描述 |
|
Html() |
无参数 |
用于获取元素的HTML内容 |
|
Html(val) |
Val参数为元素的HTML内容 |
用于设置元素的HTML内容 |
|
Text() |
无参数 |
用于获取元素的文本内容 |
|
Text(val) |
Val参数为元素的文本内容 |
用于设置元素的文本内容 |
Htm()方法仅支持XHTML文档，不支持XML文档，而text()则及支持HTML文档，也支持XML文档。
3.1.3 获取或设置元素值
通过val()方法获取或设置元素的值。
另外，通过val()方法还可以获取select标记中的多个选项值，语法：val().join(“,”)
3.1.4 元素样式操作
① 直接设置元素样式值
Css(name,value)
② 增加css类别
addClass();
③ 类别切换
通过toggleClass()方法切换不同的元素类别。
toggleClass(class)；
其中参数class为类别名称。其功能是当前元素中含有名称为class类别时，删除该类别，否则增加一个该名称的css类别。
④ 删除类别
removeClass()；
3.2 创建节点元素
函数$()用于动态创建页面元素。
3.3 插入节点
内部插入节点方法
|
语法格式 |
功能描述 |
|
Append(content) |
向所选择的元素内部插入内容 |
|
Append(function(index,html)) |
向所选的元素内部插入function函数所返回的内容 |
|
appendTo(content) |
把所选择的元素追加到另一个指定的元素集合中 |
|
Prepend(content) |
向每个所选择的元素内部前置内容 |
|
Prepend(function(){}) |
向所选的元素内部前置function函数所返回的内容 |
|
prependTo(content) |
将所选择的元素前置到另一个指定的元素集合中 |
外部插入节点方法
|
语法 |
功能 |
|
After(content) |
向所选元素外部后面插入内容 |
|
After(function()) |
向所选择的元素外部后面插入function函数返回的内容 |
|
Before(content) |
向所选择的元素外部前面插入内容 |
|
Before(function()) |
向所选择的元素外部前面插入function函数返回的内容 |
|
insertAfter(content) |
将所选择的元素插入另一个指定的元素外部后面 |
|
insertBefore(content) |
将所选择的元素插入另一个指定的元素外部前面 |
3.4 复制节点
Clone():其功能为赋值匹配的DOM元素并且选中复制成功的元素，该方法近视复制元素本身，被复制后的新元素不具有任何元素行为。如果需要在赋值时将该元素的全部行为也进行复制，可与通过方法clone(true)实现。
3.5 替换节点
replaceWith()和replaceAll()两种方法。
3.6 包裹节点
|
语法 |
功能 |
|
Wrap(html) |
把所选择的元素用其他字符串代码包裹起来 |
|
Wrap(elem) |
把所有选择的元素用其他DOM元素包裹起来 |
|
Wrap(fn) |
把所有选择的元素用function函返回值包裹起来 |
|
Unwrap() |
|
|
wrapAll(html) |
|
|
wrapAll(elem) |
|
|
wrapInner(html) |
|
|
wrapInner(elem) |
|
|
wrapInner(fn) |
3.7 遍历元素
Each(callback)
3.8删除元素
Remove()
Empty()