标签:dom jquery库 操作 一个 text cte pre index 查询
JQuery是一个JavaScript函数库。极大地简化了JavaScript编程。同时也很容易学习。
JQuery库包含以下特性:
JQuery库位于一个JavaScript文件中,包含所有的JQuery函数,可以通过<script>标签把JQuery添加到网页上。
JQuery语法:是为HTML元素的选取编制的,可以对元素执行某些操作。基础语法是:$(selector).action()
通常,文档中的JQuery函数都位于一个document ready函数中:$(document).ready(function(){......}) ; 这是为了防止文档在完全加载就绪之前运行JQuery代码。
JQuery选择器
通过选择器可以对元素组或单个元素进行操作。JQuery元素选择器和属性选择器允许通过标签名、属性名或内容对HTML元素进行选择。选择器允许对HTML元素组或单个元素进行操作。
JQuery元素选择器
JQuery使用CSS选择器里选取HTML元素
$("p")选取<p>元素。
$("p.intro")选取所有class="intro"的<p>元素。
$("p#demo")选取所有id="demo"的<p>元素。
JQuery属性选择器
JQuery使用XPath表达式来选择带有给定属性的元素
$("[href]")选取所有带有href属性的元素。
$("[href=‘#‘]")选取所有带有href值等于"#"的元素。
$("[href!=‘#‘]")选取所有带有href值不等于"#"的元素。
$("[href$=‘.jpg‘]")选取所有href值以".jpg"结尾的元素。
JQuery CSS选择器
JQuery CSS选择器可用于改变HTML元素的CSS属性。
$("p").css("background-color","red") ;
JQuery选择器:
选择器 | 实例 | 选取 |
* | $("*") | 所有元素 |
#id | $("#lastname") | id="lastname"的元素 |
.calss | $(".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() | $("input:not(:empty)") | 所有不为空的input元素 |
:heder | $("header") | 所有标题元素<h1>--<h6> |
:animate | 所有动画元素 | |
:contains(text) | $("contains(W3S)") | 编号指定字符串的所有元素 |
: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"的元素 |
:password | $(":password") | 所有type="password"的元素 |
:radio | $(":radio") | 所有type="radio"的元素 |
:checkbox | $(":checkbox") | 所有type="checkbox"的元素 |
:submit | $(":submit") | 所有type="submit"的元素 |
:reset | $(":reset") | 所有type="reset"的元素 |
:button | $(":button") | 所有type="button"的元素 |
:image | $(":image") | 所有type="image"的元素 |
:file | $(":file") | 所有type="file"的元素 |
:enabled | $(":enabled") | 所有激活的 input 元素 |
:disabled | $(":disabled") | 所有禁用的 input 元素 |
:selected | $(":selected") | 所有被选取的 input 元素 |
:checked | $(":checked") | 所有被选中的 input 元素 |
标签:dom jquery库 操作 一个 text cte pre index 查询
原文地址:http://www.cnblogs.com/sdlzspl/p/7458907.html