jquery层级选择器的实现(匹配后代元素div)


Posted in Javascript onSeptember 05, 2016

如下所示:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>层级 </title>
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
 <script type="text/javascript">
 /*
 ancetor descendant:匹配祖先元素下的后代元素
 parent>child:匹配父元素下的子元素
 prev+next:匹配前一个元素后的下一个元素,必须是挨着的
 prev~siblings:匹配前一个元素后的所有平辈元素
 */
  window.onload=function(){
   $('#btnOk').click(function(){
    //匹配后代元素div
    $('#index div').html('php');
   });
  };
 </script>
 </head>
 <body>
  <div id='index'>
   <div>div1</div>
   <form>
    <div>div2</div>
    <div>div3</div>
   </form>
   <div>div4</div>
   <div>div5</div>
 </div>
 <div>yang</div> <!--该元素没有再id=index下的div中-->
 <hr/>
 <input type="button" id='btnOk' value='确定' />
 </body>
</html>

以上这篇jquery层级原则器的实现(匹配后代元素div)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在Javascript里访问SharePoint列表数据的实现方法
May 22 Javascript
Javascript 多浏览器兼容总结(实战经验)
Oct 30 Javascript
详解JavaScript中数组的相关知识
Jul 29 Javascript
JS脚本实现动态给标签控件添加事件的方法
Jun 02 Javascript
BootStrap无限级分类(无限极分类封装版)
Aug 26 Javascript
关于ES6的六个小特性(二)
Feb 20 Javascript
简单谈谈JS中的正则表达式
Sep 11 Javascript
vue element-ui table表格滚动加载方法
Mar 02 Javascript
基于Vue+element-ui 的Table二次封装的实现
Jul 20 Javascript
vue-cli 目录结构详细讲解总结
Jan 15 Javascript
微信小程序封装多张图片上传api代码实例
Dec 30 Javascript
vue tab滚动到一定高度,固定在顶部,点击tab切换不同的内容操作
Jul 22 Javascript
Vue.js每天必学之数据双向绑定
Sep 05 #Javascript
JS快速实现移动端拼图游戏
Sep 05 #Javascript
jQuery实现的tab标签切换效果示例
Sep 05 #Javascript
Vue.js每天必学之构造器与生命周期
Sep 05 #Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
Sep 05 #Javascript
JS查找字符串中出现次数最多的字符
Sep 05 #Javascript
node网页分段渲染详解
Sep 05 #Javascript
You might like
7个超级实用的PHP代码片段
2011/07/11 PHP
PHP CLI模式下的多进程应用分析
2013/06/03 PHP
php获取一个变量的名字的方法
2014/09/05 PHP
php正则preg_replace_callback函数用法实例
2015/06/01 PHP
div模拟滚动条效果示例代码
2013/10/16 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
JS从一组数据中找到指定的单条数据的方法
2016/06/02 Javascript
jQuery 插件实现随机自由弹跳气泡样式
2017/01/12 Javascript
Vue.js结合bootstrap实现分页控件
2017/03/10 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
微信小程序表单验证错误提示效果
2017/05/19 Javascript
Vuejs 2.0 子组件访问/调用父组件的方法(示例代码)
2018/02/08 Javascript
Angular2进阶之如何避免Dom误区
2018/04/02 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
p5.js临摹动态图形的方法
2019/10/23 Javascript
JavaScript获取时区实现过程解析
2020/09/24 Javascript
vue+vant实现购物车全选和反选功能
2020/11/17 Vue.js
[56:20]LGD vs VP Supermajor 败者组决赛 BO3 第三场 6.10
2018/07/04 DOTA
用Python中的__slots__缓存资源以节省内存开销的方法
2015/04/02 Python
python实现将pvr格式转换成pvr.ccz的方法
2015/04/28 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
Python实现扩展内置类型的方法分析
2017/10/16 Python
Python类的继承和多态代码详解
2017/12/27 Python
Python3一行代码实现图片文字识别的示例
2018/01/15 Python
利用numpy和pandas处理csv文件中的时间方法
2018/04/19 Python
在python中利用最小二乘拟合二次抛物线函数的方法
2018/12/29 Python
Python实现的文轩网爬虫完整示例
2019/05/16 Python
Python如何筛选序列中的元素的方法实现
2019/07/15 Python
中东奢侈品购物网站:Ounass
2020/09/02 全球购物
大学生职业生涯规划范文
2014/01/08 职场文书
人力资源管理专业自荐书范文
2014/02/10 职场文书
婚前协议书范本
2014/04/15 职场文书
写给孩子的新学期寄语
2015/02/27 职场文书
python中取整数的几种方法
2021/11/07 Python
Python绘画好看的星空图
2022/03/17 Python
redis数据一致性的实现示例
2022/03/18 Redis