jQuery过滤选择器经典应用


Posted in Javascript onAugust 18, 2016

本文实例为大家分享了经典的jQuery过滤选择器应用,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>过滤选择器</title>
  <style type="text/css">
    #txt_show {display:none; color:#00C;}
    #txt_hide {display:block; color:#F30;}
  </style>
 
  <script src="js/jquery-1.8.3.js"></script>
  <script language="JavaScript">
    $(document).ready(function () {
      $("[name=show]").click(function () {
        $("p:hidden").show();
      }) ;
      $("[name=hide]").click(function () {
        $("p:visible").hide() ;
      });
    });
 
  </script>
 
</head>
<body>
<p id="txt_hide">点击按钮,我会被隐藏哦~</p>
<p id="txt_show">隐藏的我,被显示了,嘿嘿^^</p>
<input name="show" type="button" value="点击显示文字" />
<input name="hide" type="button" value="点击隐藏文字" />
 
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 32位整型无符号操作示例
Dec 08 Javascript
js中Math之random,round,ceil,floor的用法总结
Dec 26 Javascript
jQuery实现当按下回车键时绑定点击事件
Jan 28 Javascript
angularJS结合canvas画图例子
Feb 09 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
Jun 11 Javascript
详细分析JavaScript变量类型
Jul 08 Javascript
防止Node.js中错误导致进程阻塞的办法
Aug 11 Javascript
详解微信小程序开发之城市选择器 城市切换
Jan 17 Javascript
Jquery根据浏览器窗口改变调整大小的方法
Feb 07 Javascript
Vue.extend构造器的详解
Jul 17 Javascript
JQuery Ajax跨域调用和非跨域调用问题实例分析
Apr 16 jQuery
微信小程序如何播放腾讯视频的实现
Sep 20 Javascript
jQuery表单事件实例代码分享
Aug 18 #Javascript
Angularjs结合Bootstrap制作的一个TODO List
Aug 18 #Javascript
AngularJS 执行流程详细介绍
Aug 18 #Javascript
AngularJS国际化详解及示例代码
Aug 18 #Javascript
ECMAScript6轮播图实践知识总结
Aug 17 #Javascript
jQuery 全选 全部选 反选 实现代码
Aug 17 #Javascript
AngularJS 自定义指令详解及示例代码
Aug 17 #Javascript
You might like
php中文字符截取防乱码
2008/03/28 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
laravel框架模板之公共模板、继承、包含实现方法分析
2019/08/30 PHP
node.js实现多图片上传实例
2014/06/03 Javascript
深入理解Javascript中this的作用域
2014/08/12 Javascript
JavaScript位移运算符(无符号) &gt;&gt;&gt; 三个大于号 的使用方法详解
2016/03/31 Javascript
详解Vue2.0里过滤器容易踩到的坑
2017/06/01 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
Node.js创建Web、TCP服务器
2017/12/05 Javascript
微信小程序实现点击按钮移动view标签的位置功能示例【附demo源码下载】
2017/12/06 Javascript
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
2018/04/17 jQuery
Vue自定义指令封装节流函数的方法示例
2018/07/09 Javascript
微信小程序自定义带价格显示日历效果
2018/12/29 Javascript
微信公众平台 客服接口发消息的实现代码(Java接口开发)
2019/04/17 Javascript
Object.keys() 和 Object.getOwnPropertyNames() 的区别详解
2020/05/21 Javascript
element-ui tree结构实现增删改自定义功能代码
2020/08/31 Javascript
vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件
2021/02/20 Vue.js
[46:27]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#2LGD VS MVP.Phx第一局
2016/03/02 DOTA
Python中遍历字典过程中更改元素导致异常的解决方法
2016/05/12 Python
Python算法之图的遍历
2017/11/16 Python
JSONLINT:python的json数据验证库实例解析
2017/11/28 Python
Python 从一个文件中调用另一个文件的类方法
2019/01/10 Python
Python 实现try重新执行
2019/12/21 Python
配置python的编程环境之Anaconda + VSCode的教程
2020/03/29 Python
基于DOM+CSS3实现OrgChart组织结构图插件
2016/03/02 HTML / CSS
美国知名的网上鞋类及相关服装零售商:Shoes.com
2017/05/06 全球购物
外贸业务员的岗位职责
2013/11/23 职场文书
大学生的网络创业计划书
2013/12/26 职场文书
优秀党员获奖感言
2014/02/18 职场文书
护士感人事迹
2014/05/01 职场文书
动画设计系毕业生求职信
2014/07/15 职场文书
2014年十八届四中全会思想汇报范文
2014/10/17 职场文书
房产公证书格式
2015/01/26 职场文书
教师学习十八届五中全会精神心得体会
2016/01/05 职场文书
python实现简易自习室座位预约系统
2021/06/30 Python
使用canvas仿Echarts实现金字塔图的实例代码
2021/11/11 HTML / CSS