jQuery selectors
1. Basic selector
| Selector | describe |
|---|---|
| #id | Match an element based on a given ID |
| .class | Match elements based on the given class name |
| element | Match elements by given element name |
| * | match all elements |
| selector1,selector2,selector3 | Combine the elements matched by each selector and return |
2. Hierarchy selector
| Selector | describe |
|---|---|
| $('a d') | Select all d descendant elements in a element |
| $('p>c') | Select the c sub-element under the p element |
| $('prev+next') | Select the next element immediately after the prev element |
| $('prev~siblings') | Select all siblings after the prev element |
3. Filter selector
| Selector | describe |
|---|---|
| :first | select the first element |
| :last | select last element |
| :not(selector) | removes all elements matching the specified selector |
| :even | Select all elements with even indices |
| :odd | select all elements with odd indices |
| :containes(text) | Select all elements with text content 'text' |
| :empty | Selects empty elements that do not contain child elements or text |
| :has | Selects the parent element containing the element matched by the selector |
| [attr] | Selects elements with this attribute |
| [attr = value] | Select the element whose attribute value is value |
| [attr^=value] | Select elements whose attribute value starts with value |
| [attr$=value] | Selects elements whose attribute value ends with value |
| [attr*=value] | Select the element whose attribute value contains value |
| :nth-child(index) | Select the index-th child element or parity element under the parent element |
| :first-child | Select the first child element of the parent element |
| :last-child | Select the last child element of each parent element |
Find Nodes and Create Nodes
1. Find the node
1. Find element nodes
Finding element nodes is very simple and can be done with jQuery selectors.
After using the selector to find the desired element, you can use attr()methods to get its various attribute values.
2. Create a node
1.创建元素节点
使用 jQuery 的工厂函数$()来完成创建，然后使用append()方法插入文档中。
创建属性节点也是直接在创建元素时一起创建。
插入节点和删除节点
1.插入节点的方法
| 方法 | 描述 |
|---|---|
append() |
向每个元素内部追加内容 |
appendTo() |
将所有匹配的元素追加指定的元素中 |
prepend() |
向每个匹配的元素内部前置内容 |
prependTo() |
将所有匹配的元素前置到指定元素中 |
after() |
在每个匹配的元素之后插入内容 |
insertAfter() |
将所有匹配的元素插入到指定元素的后面 |
before() |
在每个匹配的元素之前插入内容 |
insertBefore() |
将所有匹配的元素插入到指定元素的前面 |
2.删除节点
jQuery提供了三种方法删除节点：remove(),detach(),empty()。
1.remove()方法
2.detach()方法
同样是从DOM中去掉所有匹配的元素，但不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。
3.empty()方法
严格来讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中所有后代节点。