Yuanji's Wiki

人間は考える葦である

用户工具

站点工具


dev:jquery

差别

这里会显示出您选择的修订版和当前版本之间的差别。

到此差别页面的链接

dev:jquery [2019/11/19 16:17 JST] (当前版本)
gimo 创建
行 1: 行 1:
 +====== jQuery ======
  
 +===== 选择器 =====
 +
 +^ 选择器                     ^ 示例                          ^ 描述                                                      ^
 +| parent > child          | $("div > p"               | <div> 元素的直接子元素的所有 <p> 元素                                |
 +| parent descendant       | $("div p"                 | <div> 元素的后代的所有 <p> 元素                                   |
 +| element + next          | $("div + p"               | 每个 <div> 元素相邻的下一个 <p> 元素                                |
 +| element ~ siblings      | $("div ~ p"               | <div> 元素同级的所有 <p> 元素                                    |
 +| [attribute]             | $("[href]"                | 所有带有 href 属性的元素                                         |
 +| [attribute=value]       | $("[href='default.htm']"  | 所有带有 href 属性且值等于 "default.htm" 的元素                      |
 +| [attribute!=value]      | $("[href!='default.htm']" | 所有带有 href 属性且值不等于 "default.htm" 的元素                     |
 +| [attribute%%^%%=value]  | $("[title='Tom']"         | 所有带有 title 属性且值以 "Tom" 开头的元素                            |
 +| [attribute$=value]      | $("[href$='.jpg']"        | 所有带有 href 属性且值以 ".jpg" 结尾的元素                            |
 +| [attribute~=value]      | $("[title~='hello']"      | 所有带有 title 属性且值包含单词 "hello" 的元素                         |
 +| [attribute*=value]      | $("[title*='hello']"      | 所有带有 title 属性且值包含字符串 "hello" 的元素                        |
 +| :first                  | $("p:first"               | 第一个 <p> 元素                                              |
 +| :last                   | $("p:last"                | 最后一个 <p> 元素                                             |
 +| :even                   | $("tr:even"               | 所有偶数 <tr> 元素,索引值从 0 开始,第一个元素是偶数 (0),第二个元素是奇数 (1),以此类推。  |
 +| :odd                    | $("tr:odd"                | 所有奇数 <tr> 元素,索引值从 0 开始,第一个元素是偶数 (0),第二个元素是奇数 (1),以此类推。  |
 +| :first-child            | $("p:first-child"         | 属于其父元素的第一个子元素的所有 <p> 元素                                 |
 +| :first-of-type          | $("p:first-of-type"       | 属于其父元素的第一个 <p> 元素的所有 <p> 元素                             |
 +| :last-child             | $("p:last-child"          | 属于其父元素的最后一个子元素的所有 <p> 元素                                |
 +| :last-of-type           | $("p:last-of-type"        | 属于其父元素的最后一个 <p> 元素的所有 <p> 元素                            |
 +| :nth-child(n)           | $("p:nth-child(2)"        | 属于其父元素的第二个子元素的所有 <p> 元素                                 |
 +| :nth-last-child(n)      | $("p:nth-last-child(2)"   | 属于其父元素的第二个子元素的所有 <p> 元素,从最后一个子元素开始计数                    |
 +| :nth-of-type(n)         | $("p:nth-of-type(2)"      | 属于其父元素的第二个 <p> 元素的所有 <p> 元素                             |
 +| :nth-last-of-type(n)    | $("p:nth-last-of-type(2)" | 属于其父元素的第二个 <p> 元素的所有 <p> 元素,从最后一个子元素开始计数                |
 +| :only-child             | $("p:only-child"          | 属于其父元素的唯一子元素的所有 <p> 元素                                  |
 +| :only-of-type           | $("p:only-of-type"        | 属于其父元素的特定类型的唯一子元素的所有 <p> 元素                             |
 +
 +
 +===== 备忘 =====
 +
 +  *[[https://stackoverflow.com/questions/6003819/what-is-the-difference-between-properties-and-attributes-in-html|javascript - What is the difference between properties and attributes in HTML? - Stack Overflow]]
 +  *[[https://www.runoob.com/try/try.php?filename=tryjquery_html_detach_remove|jQuery 中 remove 和 detach 的不同]]
 +
 +
 +===== 参考资料 =====
 +
 +  *[[https://www.runoob.com/jquery/jquery-ref-selectors.html|jQuery 选择器 | 菜鸟教程]]
dev/jquery.txt · 最后更改: 2019/11/19 16:17 JST 由 gimo