JQuery选择器操作
!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="jquery-1.8.2.min.js"></script>
<script language="javascript">
//ready 事件的触发时机 ：在整个Html文本在浏览器加载完毕才会触发，图片之类的东西可能没显示出来 。
//相当于在</Html>之后写的脚本 **重要
$(document).ready(function () {
//alert("你好")
$("div div:contains(3)").click(function () {
//一基础过滤
//里面写div ,span是用标签选择器 里面写id 就用id选择器 还有些class==值 是用class 使用class选择器
//如果里面写div 空格div那就是查找 div里面的div（用空格是后代关系）
//div>div （查找父级是div的 div）
//.cc:first查找第一个.cc :first是第一个的意思 :last最后一个 :eq(索引号)找任意一个:lt(索引号)大于某个索引号 :gt(索引号) - 小于某个索引号
//:odd - 奇数个 :even - 偶数个:not(选择器)排除摸一个
//二属性过滤
//div[woqu] [属性名] - 选择拥有这个属性的元素 div[woqu=aaa] [属性名]找属性名等于某个值 [属性名!=aaa]找属性找属性名不等于某个值
//[属性名*=a] - 属性值中包含某个值 [属性名^=a] 属性值是以..开头 [属性名$=a] 属性值是...结尾
//三 内容过滤
//:has(span) - 开始与结束标记之间是否包含某类子元素，如果包含，就选择出来。
//:contains(3) - 开始与结束标记之间是否包含某段文字，如何包含就选择出来。
alert("你们好")//点击触发
}).mouseover(function () {
$(this).css("background-color", "red").css("font-size","48px");//this d等于是#dd 鼠标移动上去背景变成红色 mouseover 鼠标移动上去事件
}).mouseout(function () {
$(this).css("background-color", "white");//this d等于是#dd 鼠标移动下去背景变成白色 mouseout 鼠标离开事件
})
});//ready()是个事件 ，浏览器吧界面的Html代码加载完毕触发
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="dd">
环妹
<div>
一天虐我千百遍
</div>
</div>
<div id="dd" woqu="aaa">
文超
</div>
<div id="dd"class="cc">
<span>1234</span>
小雨
</div>
<div id="dd">
阿辉
</div>
<div id="dd" class="cc">
大梅子
</div>
<div id="dd">
随便乱写
</div>
<span>
a 啊啊
<div>
第三层
</div>
</span>
</div>
</form>
</body>
</html>
JQuery选择器操作的更多相关文章
- 10种jquery选择器操作详解（转）
jquery选择器大体上可分为4 类: 1.基本选择器2.层次选择器3.过滤选择器4.表单选择器 其中过滤选择器可以分为:1.简单过滤选择器2.内容过滤选择器3.可见性过滤选择器4.属性过滤选择器5. ...
- jQuery选择器和DOM操作——《锋利的jQuery》（第2版）读书笔记1
第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: ...
- [每日一题jQuery] jQuery选择器总结：进一步过滤、同级操作、后代操作
jQuery选择器继承自CSS的风格,可以通过jQuery选择器找出特定的DOM元素,在此基础上对该元素做相应处理.jQuery不仅支持简单的标签选择器.类选择器.id选择器,还针对表单状态.子元素. ...
- 【如何使用jQuery】【jQuery弹出框】【jQuery对div进行操作】【jQuery对class，id，type的操作】【jquery选择器】
1.如何使用jQuery jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗旨 ...
- [转]jQuery 选择器和dom操作
居然是12年的总结.... 文章地址: http://www.cnblogs.com/happyPawpaw/articles/2595092.html JQuery选择器 1.基本选择器 基本选择器 ...
- jQuery 效果函数，jquery文档操作，jQuery属性操作方法，jQuerycss操作函数，jQuery参考手册-事件，jQuery选择器
jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...
- JQuery选择器和DOM的操作-入门学习
嘿嘿,今天学习了JQuery,前面的一周都在学习javascript,今天学习了JQuery,虽然javascript的类库有很多个,例如:Prototype,Dojo,JQuery等,javascr ...
- Unit01： jQuery概述 、 jQuery选择器 、 jQuery操作DOM
Unit01: jQuery概述 . jQuery选择器 . jQuery操作DOM 使用jQuery放大字体: <!DOCTYPE html> <html> <head ...
- js进阶 11-18 jquery中操作选择器的方法有哪些
js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...
随机推荐
- c++，operator=
operator=为什么值得注意? 从语法上讲,下面的程序可以编译通过,我在另一篇笔记示例里面也这样用了. class A1 { public: int operator=(int a)//参数是in ...
- 用eclipse编写Android程序时怎样生成apk文件
转载请注明出处:http://blog.csdn.net/ns_code/article/details/16828449 APK是Android Package的缩写,即Android安装包.通过将 ...
- mysql 监控 大批量的插入,删除,和修改
监控大批量的插入,修改和删除: mysql> insert into aaa select * from aaa; mysql> SELECT trx_id, trx_state, trx ...
- linux c setitimer使用方法说明
在linux c编程中.setitimer是一个比較经常使用的函数.可用来实现延时和定时的功能,网上有各种零零散散的使用方法说明,都仅仅提到了个别使用方法,今天抽出时间实践整理了一份比較具体的: 使用 ...
- http异步请求
1.加载异步请求包文件 2.java代码 package com.example.asynchttp; import org.apache.http.Header; import com.loopj. ...
- 图片转换成Base64编码集成到html文件
首先为什么要这么做? 原因很简单这样可以减少与服务器的请求,当然对于一些浏览器并不支持,如IE8.通常用在手机版网站中,具体转化方法如下: 1.在线打开Base64的编码器将图片编码成Base64 ...
- 教师简介 (Alma Del Tango的小站)
教师简介 (Alma Del Tango的小站) Esteban Peng (TT) & Emilia Jia (Amy) TT和Amy是北京极具影响力的专业舞者,他们从07年开始推广阿根廷探 ...
- OnClientClick和OnClick
OnClientClick是客户端事件处理方法,一般采用JavaScript来进行处理,也就是直接在IE端运行,一点击就运行 OnClick是服务器端事件处理函数,使用C#或者vb.net,在服务器端 ...
- MSSQL - 存储过程Return返回值
1.存储过程中不使用外部参数. 存储过程: SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER ON GO -- ========================== ...
- 根据input 标签取value属性的值
jrhmpt01:/root/lwp/0526# cat a1.pl use LWP::UserAgent; use DBI; use POSIX; use Data::Dumper; use HTM ...