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
Apr 18 Javascript
table行随鼠标移动变色示例
May 07 Javascript
js中遍历Map对象的简单实例
Aug 08 Javascript
AngularJS实现controller控制器间共享数据的方法示例
Oct 30 Javascript
浏览器调试动态js脚本的方法(图解)
Jan 19 Javascript
ionic2中使用自动生成器的方法
Mar 04 Javascript
webpack打包node.js后端项目的方法
Mar 10 Javascript
JavaScript的词法结构精华篇
Oct 17 Javascript
javascript实现切割轮播效果
Nov 28 Javascript
jQuery 实现扁平式小清新导航
Jul 07 jQuery
如何理解Vue简单状态管理之store模式
May 15 Vue.js
webpack介绍使用配置教程详解webpack介绍和使用
Jun 25 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
php5 图片验证码实现代码
2009/12/11 PHP
PHP使用array_multisort对多个数组或多维数组进行排序
2014/12/16 PHP
php curl登陆qq后获取用户信息时证书错误
2015/02/03 PHP
PHP curl使用实例
2015/07/02 PHP
基于PHP实现简单的随机抽奖小程序
2016/01/05 PHP
PHP中in_array的隐式转换的解决方法
2018/03/06 PHP
php中用unset销毁变量并释放内存
2020/05/10 PHP
论坛里点击别人帖子下面的回复,回复标题变成“回复 24# 的帖子”
2009/06/14 Javascript
Jquery优化效率 提升性能解决方案
2010/09/06 Javascript
对象无length属性时IE6/IE7中无法将其转换成伪数组(ArrayLike)
2011/07/31 Javascript
Javascript实现页面跳转的几种方式分享
2013/10/26 Javascript
js实现商品抛物线加入购物车特效
2020/11/18 Javascript
全面理解JavaScript中的闭包
2016/05/12 Javascript
浅析Javascript ES6中的原生Promise
2016/08/25 Javascript
Node.js v8.0.0正式发布!看看带来了哪些主要新特性
2017/06/02 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
2017/12/13 Javascript
webpack写jquery插件的环境配置
2017/12/21 jQuery
JavaScript字符串处理常见操作方法小结
2019/11/15 Javascript
[46:57]EG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python实现的数据结构与算法之快速排序详解
2015/04/22 Python
深入解析Python中的urllib2模块
2015/11/13 Python
Java多线程编程中ThreadLocal类的用法及深入
2016/06/21 Python
Django 前后台的数据传递的方法
2017/08/08 Python
运用TensorFlow进行简单实现线性回归、梯度下降示例
2018/03/05 Python
pandas全表查询定位某个值所在行列的方法
2018/04/12 Python
详解用python实现基本的学生管理系统(文件存储版)(python3)
2019/04/25 Python
python获取磁盘号下盘符步骤详解
2019/06/19 Python
pyqt5 QScrollArea设置在自定义侧(任何位置)
2019/09/25 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
美国顶级防滑鞋:Shoes For Crews
2017/03/27 全球购物
服务生自我鉴定
2014/01/22 职场文书
大班上学期幼儿评语
2014/04/30 职场文书
公司市场专员岗位职责
2014/06/29 职场文书
乡镇干部党的群众路线教育实践活动个人对照检查材料
2014/09/24 职场文书
会议通知格式范文
2015/04/15 职场文书
quickjs 封装 JavaScript 沙箱详情
2021/11/02 Javascript