jQuery类选择器用法实例


Posted in Javascript onDecember 23, 2014

本文实例讲述了jQuery类选择器用法。分享给大家供大家参考。具体分析如下:

类选择的器匹配具有指定类名的所有元素。

例子:

$(".mydiv")

以上代码选取类名为mydiv的所有元素。
注意:在mydiv前面有一点(.)。
实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title> 

<style type="text/css"> 

div{ 

  height:150px; 

  width:150px; 

  background-color:green; 

  margin-top:10px; 

} 

</style> 

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $(".mydiv").hide(); 

  }) 

}) 

</script> 

</head> 

<body> 

  <div class="mydiv"></div> 

  <div class="anotherdiv"></div> 

  <button>点击隐藏div元素</button> 

</body> 

</html>

以上代码可以将类名为mydiv的div元素隐藏。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JS处理VBArray的函数使用说明
May 11 Javascript
jQuery学习3:操作元素属性和特性
Feb 07 Javascript
js AppendChild与insertBefore用法详细对比
Dec 16 Javascript
如何用angularjs制作一个完整的表格
Jan 21 Javascript
jQuery获取父元素节点、子元素节点及兄弟元素节点的方法
Apr 14 Javascript
AngularJs定制样式插入到ueditor中的问题小结
Aug 01 Javascript
微信小程序 Windows2008 R2服务器配置TLS1.2方法
Dec 05 Javascript
整理关于Bootstrap模态弹出框的慕课笔记
Mar 29 Javascript
探索webpack模块及webpack3新特性
Sep 18 Javascript
使用proxy实现一个更优雅的vue【推荐】
Jun 19 Javascript
vue发送ajax请求详解
Oct 09 Javascript
微信小程序+腾讯地图开发实现路径规划绘制
May 22 Javascript
基于JQuery制作可编辑的表格特效
Dec 23 #Javascript
JavaScript调试工具汇总
Dec 23 #Javascript
jQuery制作简洁的多级联动Select下拉框
Dec 23 #Javascript
jQuery元素选择器用法实例
Dec 23 #Javascript
jquery制作漂亮的弹出层提示消息特效
Dec 23 #Javascript
使用jQuery仿苹果官网焦点图特效
Dec 23 #Javascript
jQuery分组选择器用法实例
Dec 23 #Javascript
You might like
JoshChen_web格式编码UTF8-无BOM的小细节分析
2013/08/16 PHP
thinkphp5 加载静态资源路径与常量的方法
2017/12/24 PHP
Javascript 构造函数 实例分析
2008/11/26 Javascript
childNodes.length与children.length的区别
2009/05/14 Javascript
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
javascript 导出数据到Excel(处理table中的元素)
2009/12/18 Javascript
Extjs Ext.MessageBox.confirm 确认对话框详解
2010/04/02 Javascript
使用dynatrace-ajax跟踪JavaScript的性能
2010/04/12 Javascript
Prototype源码浅析 Enumerable部分之each方法
2012/01/16 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
2013/05/15 Javascript
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
2013/06/26 Javascript
用js代码改变单选框选中状态的简单实例
2013/12/18 Javascript
对table和ul实现js分页示例分享
2014/02/24 Javascript
jQuery实现仿QQ头像闪烁效果的文字闪动提示代码
2015/11/03 Javascript
JavaScript设计模式开发中组合模式的使用教程
2016/05/18 Javascript
在windows上用nodejs搭建静态文件服务器的简单方法
2016/08/11 NodeJs
jquery实现input框获取焦点的方法
2017/02/06 Javascript
JavaScript实现两个select下拉框选项左移右移
2017/03/09 Javascript
解决bootstrap下拉菜单点击立即隐藏bug的方法
2017/06/13 Javascript
基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
2018/01/09 Javascript
基于vue 开发中出现警告问题去除方法
2018/01/25 Javascript
详解Angular5 路由传参的3种方法
2018/04/28 Javascript
vue的keep-alive中使用EventBus的方法
2019/04/23 Javascript
jquery绑定事件 bind和on的用法与区别分析
2020/05/22 jQuery
[00:21]DOTA2亚洲邀请赛 Logo演绎
2015/02/07 DOTA
python实现求最长回文子串长度
2018/01/22 Python
使用python采集脚本之家电子书资源并自动下载到本地的实例脚本
2018/10/23 Python
django将数组传递给前台模板的方法
2019/08/06 Python
Python如何在循环内使用list.remove()
2020/06/01 Python
详解pandas中利用DataFrame对象的.loc[]、.iloc[]方法抽取数据
2020/12/13 Python
泰国办公用品购物网站:OfficeMate
2018/02/04 全球购物
澳大利亚领先的内衣店:Bendon Lingerie澳大利亚
2020/05/15 全球购物
简单租房协议书范本
2014/08/20 职场文书
群众路线教育实践活动对照检查材料
2014/09/22 职场文书
2015年父亲节寄语
2015/03/23 职场文书
Python爬虫网络请求之代理服务器和动态Cookies
2022/04/12 Python