JQuery里面的几种选择器 查找满足条件的元素$("#控件ID")


Posted in Javascript onAugust 23, 2011

样式:$(function (){
$("要选择的标签").click(function (){alert ("弹出对话框内容");})
});
第一种:Id选择器
用法:

<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js" type ="text/javascript" ></script> 
<script type ="text/javascript"> 
$(function (){ 
$("p").click(function (){alert ("小P");}) 
}); 
</script> 
</head> <body> 
<input type="button" value ="PlayGame" id="btnClick" /> 
<p>第一个</p> 
<p>第二个</p> 
</body>

说明:对所有<P>标签点击都有弹出对话框的提示
第二种:CSS选择器
<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js" type ="text/javascript" ></script> 
<script type ="text/javascript"> 
$(function (){ 
$(".warning").click(function (){alert("这是警告信息");}); 
}); 
</script> 
<style type="text/css" > 
.warning{background-color :Yellow ;color :Red ;} 
</style> 
</head> <body> 
<p>没有警告</p> 
<div class ="warning " >请带好小孩</div> 
<p class ="warning ">再次警告你</p> 
<input class ="warning " type ="button" value ="别点啊" /> 
</body>

说明:对所有CSS样式为:.warning点击都有弹出对话框的提示
第三种:多条件选择器
<head> 
<title></title> 
<script src ="Jq/jquery-1.4.2.js"></script> 
<script type ="text/javascript" > 
$(function (){ 
$(".docc,p,#txt1").click(function (){alert ("不要上当啊");}) 
}) 
</script> 
<style type="text/css" > 
.docc{background-color :Fuchsia ;color :Olive ;} 
</style> 
</head> <body> 
<p>电脑热卖</p> 
<input type ="text" id="txt1" /> 
<input class ="docc" type ="button" value ="上当" /> 
<input type ="checkbox" /> 
</body>

说明:可以对多个同时选中做处理。
Javascript 相关文章推荐
JavaScript学习笔记(十)
Jan 17 Javascript
Jquery动态更改一张位图的src与Attr的使用
Jul 31 Javascript
js动态创建标签示例代码
Jun 09 Javascript
AngularJS中如何使用$parse或$eval在运行时对Scope变量赋值
Jan 25 Javascript
JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
Jun 02 Javascript
jQuery实现链接的title快速出现的方法
Feb 20 Javascript
Bootstrap.css与layDate日期选择样式起冲突的解决办法
Apr 07 Javascript
详解HTML5 使用video标签实现选择摄像头功能
Oct 25 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
Aug 28 jQuery
浅谈目前可以使用ES10的5个新特性
Jun 25 Javascript
prettier自动格式化去换行的实现代码
Aug 25 Javascript
微信小程序实现简单的select下拉框
Nov 23 Javascript
基于JQuery的Select选择框的华丽变身
Aug 23 #Javascript
MooTools 页面滚动浮动层智能定位实现代码
Aug 23 #Javascript
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
Aug 23 #Javascript
jQuery页面滚动浮动层智能定位实例代码
Aug 23 #Javascript
jqGrid jQuery 表格插件测试代码
Aug 23 #Javascript
30个精美的jQuery幻灯片效果插件和教程
Aug 23 #Javascript
js 函数的副作用分析
Aug 23 #Javascript
You might like
smtp邮件发送一例
2006/10/09 PHP
PHP实现截取中文字符串不出现?号的解决方法
2016/12/29 PHP
JavaScript下申明对象的几种方法小结
2008/10/02 Javascript
javascript 放大镜效果js组件 qsoft.PopBigImage.v0.35 加入了chrome支持
2009/04/07 Javascript
javascript hasFocus使用实例
2010/06/29 Javascript
iframe异步加载实现点击左边菜单加载右边内容实例讲解
2013/03/04 Javascript
js写的评论分页(还不错)
2013/12/23 Javascript
js opener的使用详解
2014/01/11 Javascript
JavaScript中的标签语句用法分析
2015/02/10 Javascript
JQuery fileupload插件实现文件上传功能
2016/03/18 Javascript
简单了解JavaScript操作XPath的一些基本方法
2016/06/03 Javascript
基于 Vue 实现一个酷炫的 menu插件
2017/11/14 Javascript
angular4强制刷新视图的方法
2018/10/09 Javascript
JS复杂判断的更优雅写法代码详解
2018/11/07 Javascript
node实现爬虫的几种简易方式
2019/08/22 Javascript
js节流防抖应用场景,以及在vue中节流防抖的具体实现操作
2020/09/21 Javascript
解决ant Design中this.props.form.validateFields未执行的问题
2020/10/27 Javascript
vue 数据操作相关总结
2020/12/17 Vue.js
Python调用C/C++动态链接库的方法详解
2014/07/22 Python
详解Python中的静态方法与类成员方法
2017/02/28 Python
python实现大转盘抽奖效果
2019/01/22 Python
Python 文件操作之读取文件(read),文件指针与写入文件(write),文件打开方式示例
2019/09/29 Python
python之openpyxl模块的安装和基本用法(excel管理)
2021/02/03 Python
荷兰游戏商店:Allyouplay
2019/03/16 全球购物
英国打印机墨盒销售网站:Ink Factory
2019/10/07 全球购物
加拿大品牌鞋包连锁店:Little Burgundy
2021/02/28 全球购物
编写一子程序,将一链表倒序,即使链表表尾变表头,表头变表尾
2016/02/10 面试题
如何开发安全的AJAX应用
2014/03/26 面试题
95%的面试官都会问到的50道Java线程题,附答案
2012/08/03 面试题
如何打造一封优秀的留学推荐信
2014/01/25 职场文书
《小山羊和小灰兔》教学反思
2014/02/19 职场文书
反腐倡廉警示教育活动总结
2014/05/05 职场文书
新文化运动的基本口号
2014/06/21 职场文书
银行贷款委托书范本
2014/10/11 职场文书
毕业典礼主持词
2015/06/29 职场文书
2016年党建工作简报
2015/11/26 职场文书