jQuery学习笔记 操作jQuery对象 文档处理
下面就是一些常用方法,格式为$(selector).方法,其中$(selector)即当前选定元素:
移动元素
方法 |
描述 |
append($(selector)) |
向当前元素的内部追加内容 |
appendTo($(selector)) |
将当前元素在某元素内部追加。但由于会根据需要对当前元素进行移动,所以jQuery对象更改了,可用end()还原 |
prepend($(selector)) |
向当前元素的内部前置内容 |
prependTo($(selector)) |
将当前元素在某元素内部前置。类似于appendTo(),会改变对象 |
after($(selector)) |
向当前元素之后插入内容 |
insertAfter($(selector)) |
将当前元素插入到某元素之后。类似于appendTo(),会改变对象 |
before($(selector)) |
向当前元素之前插入内容 |
insertBefore($(selector)) |
将当前元素插入到某元素之前。类似于appendTo(),会改变对象 |
添加元素
方法 |
描述 |
$(html) |
创建生成jQuery对象。根据原始HTML代码字符串,创建指向新元素的jQuery对象,再利用移动方法来添加到文档中 |
clone() |
复制生成jQuery对象。复制当前选定页面元素,生成副本元素的jQuery对象,同样利用移动方法来添加到文档中。而且clone()指向副本,相当于更改了jQuery对象,所以可用一次end()还原到当前选定元素;二次end()则彻底还原对jQuery对象的更改 |
替换元素
方法 |
描述 |
replaceWith($(selector)) replaceWith($(html)) |
移动页面上原有的元素来替换当前选定的页面元素,也可以添加新元素来替换 |
replaceAll($(selector)) replaceAll($(html)) |
用当前选定的元素来替换某元素,可以使页面上原有元素,也可以是新元素。同样会根据需要复制当前元素副本,从而更改jQuery对象 |
包裹元素
方法 |
描述 |
wrap($(selector)) wrap($(html)) |
复制页面上原有的元素来包裹当前选定的元素,也可以添加新元素来包裹 |
unwrap() |
用来去除当前元素的父元素,但是父元素内部的文本内容依旧保留 |
wrapAll($(selector)) |
复制页面原有元素把所有当前选定元素包裹在一起,不同于wrap()分别包裹每个元素 |
wrapInner($(selector)) |
复制页面原有元素把分别包裹每个当前选定元素内部的文本和后代元素,不同于wrap()分别包裹每个元素本身 |
删除和清空元素
方法 |
描述 |
remove() |
删除当前元素,该元素包含的文本内容和后代元素会一起删除掉,绑定的事件也不复存在 |
detach() |
同样是删除当前元素,但是绑定的事件还是存在的 |
empty() |
清空当前元素,该元素的文本内容和后代元素都将删除,但保留其本身 |