JavaScript match() 方法
示例1:
- <script type="text/javascript">
- var str="Hello world!"
- document.write(str.match("world") + "<br />")
- document.write(str.match("World") + "<br />")
- document.write(str.match("worlld") + "<br />")
- document.write(str.match("world!"))
- </script>
输出:
- world
- null
- null
- world!
示例2:
- <script type="text/javascript">
- var str="1 plus 2 equal 3"
- document.write(str.match(/\d+/g))
- </script>
输出:
- 1,2,3
JQuery中ID含有特殊符号的解决办法
在使用jQuery选择器的时,如果id里包含#:[]之类的特殊的符号,或者xml里有如
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title> </title>
- <script type="text/javascript" src="jquery.js"> </script>
- <script type="text/javascript">
- $(document).ready(function(){
- d =$("#\\#5").html();
- alert(d);
- });
- </script>
- </head>
- <body>
- <div id="#5">ss</div>
- </body>
- </html>
jQuery 选择器
| 选择器 | 实例 | 选取 |
|---|---|---|
| * | $(“*”) | 所有元素 |
| #id | $(“#lastname”) | id=lastname 的元素 |
| .class | $(“.intro”) | 所有 class=”intro” 的元素 |
| element | $(“p”) | 所有 <p> 元素 |
| .class.class | $(“.intro.demo”) | 所有 class=intro 且 class=demo 的元素 |
| :first | $(“p:first”) | 第一个 <p> 元素 |
| :last | $(“p:last”) | 最后一个 <p> 元素 |
| :even | $(“tr:even”) | 所有偶数 <tr> 元素 |
| : odd | $(“tr:odd”) | 所有奇数 <tr> 元素 |
| :eq(index) | $(“ul li:eq(3)”) | 列表中的第四个元素(index 从 0 开始) |
| :gt(no) | $(“ul li:gt(3)”) | 列出 index 大于 3 的元素 |
| :lt(no) | $(“ul li:lt(3)”) | 列出 index 小于 3 的元素 |
| :not(selector) | $(“input:not(:empty)”) | 所有不为空的 input 元素 |
| :header | $(“:header”) | 所有标题元素 <h1><h2>… |
| :animated | 所有动画元素 | |
| :contains(text) | $(“:contains(‘W3School’)”) | 包含文本的所有元素 |
| :empty | $(“:empty”) | 无子(元素)节点的所有元素 |
| :hidden | $(“p:hidden”) | 所有隐藏的 <p> 元素 |
| :visible | $(“table:visible”) | 所有可见的表格 |
| s1,s2,s3 | $(“th,td,.intro”) | 所有带有匹配选择的元素 |
| [attribute] | $(“[href]“) | 所有带有 href 属性的元素 |
| [attribute=value] | $(“[href='#']“) | 所有 href 属性的值等于 “#” 的元素 |
| [attribute!=value] | $(“[href!='#']“) | 所有 href 属性的值不等于 “#” 的元素 |
| [attribute$=value] | $(“[href$='.jpg']“) | 所有 href 属性的值包含 “.jpg” 的元素 |
| :input | $(“:input”) | 所有 <input> 元素 |
| :text | $(“:text”) | 所有 type=”text” 的 <input> 元素 |
| :password | $(“:password”) | 所有 type=”password” 的 <input> 元素 |
| :radio | $(“:radio”) | 所有 type=”radio” 的 <input> 元素 |
| :checkbox | $(“:checkbox”) | 所有 type=”checkbox” 的 <input> 元素 |
| :submit | $(“:submit”) | 所有 type=”submit” 的 <input> 元素 |
| :reset | $(“:reset”) | 所有 type=”reset” 的 <input> 元素 |
| :button | $(“:button”) | 所有 type=”button” 的 <input> 元素 |
| :image | $(“:image”) | 所有 type=”image” 的 <input> 元素 |
| :file | $(“:file”) | 所有 type=”file” 的 <input> 元素 |
| :enabled | $(“:enabled”) | 所有激活的 input 元素 |
| :disabled | $(“:disabled”) | 所有禁用的 input 元素 |
| :selected | $(“:selected”) | 所有被选取的 input 元素 |
| :checked | $(“:checked”) | 所有被选中的 input 元素 |
JQuery中siblings()用法
siblings(expr)
取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合。 可以用可选的表达式进行筛选。
参数:
- expr (String): (可选) 用于筛选同辈元素的表达式
示例:
找到每个div的所有同辈元素。
- $("div").siblings()
HTML 代码:
- <p>Hello</p><div><span>Hello Again</span></div><p>And Again</p>
结果:
- [ <p>Hello</p>, <p>And Again</p> ]
示例:
找到每个div的所有同辈元素中带有类名为selected的元素。
- $("div").siblings(".selected")
HTML 代码:
- <div><span>Hello</span></div><p class="selected">Hello Again</p><p>And Again</p>
结果:
- [ <p class="selected">Hello Again</p> ]
示例:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <script src="http://code.jquery.com/jquery-latest.js"></script>
- <script>
- $(document).ready(function(){
- var len = $(".hilite").siblings()
- .css("color", "red")
- .length;
- $("b").text(len);
- });
- </script>
- <style>
- ul { float:left; margin:5px; font-size:16px; font-weight:bold; }
- p { color:blue; margin:10px 20px; font-size:16px; padding:5px;
- font-weight:bolder; }
- .hilite { background:yellow; }
- </style>
- </head>
- <body>
- <ul>
- <li>One</li>
- <li>Two</li>
- <li class="hilite">Three</li>
- <li>Four</li>
- </ul>
- <ul>
- <li>Five</li>
- <li>Six</li>
- <li>Seven</li>
- </ul>
- <ul>
- <li>Eight</li>
- <li class="hilite">Nine</li>
- <li>Ten</li>
- <li class="hilite">Eleven</li>
- </ul>
- <p>Unique siblings: <b></b></p>
- </body>
- </html>
结果:
