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 相关文章推荐
让广告代码不再影响你的网页加载速度
Jul 07 Javascript
JavaScript中的Document文档对象
Jan 16 Javascript
js原型链原理看图说明
Jul 07 Javascript
通过AJAX的JS、JQuery两种方式解析XML示例介绍
Sep 23 Javascript
js获取IFRAME当前的URL的方法
Nov 13 Javascript
Jquery中的层次选择器与find()的区别示例介绍
Feb 20 Javascript
javascript生成随机数方法汇总
Nov 12 Javascript
尝试动手制作javascript放大镜效果
Dec 25 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
Jul 18 Javascript
js实现省份下拉菜单效果
Feb 15 Javascript
解决IE7中使用jQuery动态操作name问题
Aug 28 jQuery
微信小程序如何实现radio单选框单击打勾和取消
Jan 21 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
php获取后台Job管理的实现代码
2011/06/10 PHP
探讨:如何使用PhpDocumentor生成文档
2013/06/25 PHP
smarty模板引擎之内建函数用法
2015/03/30 PHP
详解Grunt插件之LiveReload实现页面自动刷新(两种方案)
2015/07/31 PHP
PHP数组生成XML格式数据的封装类实例
2016/11/10 PHP
用js做一个小游戏平台 (一)
2009/12/29 Javascript
JQuery 常用操作代码
2010/03/14 Javascript
基于jQuery的输入框无值自动显示指定数据的实现代码
2011/01/24 Javascript
多浏览器兼容性比较好的复制到剪贴板的js代码
2011/10/09 Javascript
formvalidator验证插件中有关ajax验证问题
2013/01/04 Javascript
js日期时间补零的小例子
2013/03/05 Javascript
jquery实现LED广告牌旋转系统图片切换效果代码分享
2015/08/26 Javascript
分享一个插件实现水珠自动下落效果
2016/06/01 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
2016/10/10 Javascript
jQuery自定义多选下拉框效果
2017/06/19 jQuery
封装运动框架实战左右与上下滑动的焦点轮播图(实例)
2017/10/17 Javascript
如何选择适合你的JavaScript框架
2017/11/20 Javascript
一篇文章看懂JavaScript中的回调
2021/01/05 Javascript
[42:32]Secret vs Optic 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python中使用PyHook监听鼠标和键盘事件实例
2014/07/18 Python
在DigitalOcean的服务器上部署flaskblog应用
2015/12/19 Python
Python实现的购物车功能示例
2018/02/11 Python
pygame游戏之旅 创建游戏窗口界面
2018/11/20 Python
Python列表list排列组合操作示例
2018/12/18 Python
Python递归调用实现数字累加的代码
2020/02/25 Python
css3实现背景颜色渐变让图片不再是唯一的实现方式
2012/12/18 HTML / CSS
html5录音功能实战示例
2019/03/25 HTML / CSS
预订从美国飞往印度的机票:MyTicketsToIndia
2017/05/19 全球购物
开普敦通行证:Cape Town Pass
2019/07/18 全球购物
澳大利亚有机化妆品网上商店:The Well Store
2020/02/20 全球购物
LVMH旗下最大的奢侈品网站平台:24S
2020/05/24 全球购物
C++面试题目
2013/06/25 面试题
可口可乐广告词
2014/03/20 职场文书
教师工作自我鉴定范文
2014/09/14 职场文书
三峡导游词
2015/01/31 职场文书
什么是检讨书?检讨书的格式及范文
2019/11/05 职场文书