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 style 中visibility和display之间的区别
Jan 22 Javascript
jQuery学习笔记之Helloworld
Dec 22 Javascript
jquery 动态创建元素的方式介绍及应用
Apr 21 Javascript
script不刷新页面的联动前后代码
Sep 18 Javascript
jquery中插件实现自动添加用户的具体代码
Nov 15 Javascript
JS控制日期显示的小例子
Nov 23 Javascript
Javascript中typeof 用法小结
May 12 Javascript
基于js实现二级下拉联动
Dec 17 Javascript
Bootstrap源码解读网格系统(3)
Dec 22 Javascript
JS实现颜色的10进制转化成rgba格式的方法
Sep 04 Javascript
利用Vue实现一个markdown编辑器实例代码
May 19 Javascript
JavaScript 斐波那契数列 倒序输出 输出100以内的质数代码实例
Sep 11 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中mysql模块部分功能的简单封装
2011/09/30 PHP
phpQuery占用内存过多的处理方法
2013/11/13 PHP
两个php日期控制类实例
2014/12/09 PHP
php include类文件超时问题处理
2015/02/06 PHP
thinkPHP5.0框架命名空间详解
2017/03/18 PHP
laravel框架分组控制器和分组路由实现方法示例
2020/01/25 PHP
jquery.validate使用攻略 第二部
2010/07/01 Javascript
模拟电子签章盖章效果的jQuery插件源码
2013/06/24 Javascript
教你如何在 Javascript 文件里使用 .Net MVC Razor 语法
2014/07/23 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
如何利用JS通过身份证号获取当事人的生日、年龄、性别
2016/01/22 Javascript
jquery实现ajax加载超时提示的方法
2016/07/23 Javascript
使用snowfall.jquery.js实现爱心满屏飞的效果
2017/01/05 Javascript
Angular2 PrimeNG分页模块学习
2017/01/14 Javascript
JSON与JS对象的区别与对比
2017/03/01 Javascript
vue.js全局API之nextTick全面解析
2017/07/07 Javascript
vue-cli3 项目优化之通过 node 自动生成组件模板 generate View、Component
2019/04/30 Javascript
vue实现计算器功能
2020/02/22 Javascript
vue父子组件间引用之$parent、$children
2020/05/20 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
2020/09/08 Javascript
Python3实现从指定路径查找文件的方法
2015/05/22 Python
Python中标准模块importlib详解
2017/04/16 Python
Python smtplib实现发送邮件功能
2018/05/22 Python
python 2.7 检测一个网页是否能正常访问的方法
2018/12/26 Python
详解Python下载图片并保存本地的两种方式
2019/05/15 Python
selenium跳过webdriver检测并模拟登录淘宝
2019/06/12 Python
python 截取XML中bndbox的坐标中的图像,另存为jpg的实例
2020/03/10 Python
Python Django中的STATIC_URL 设置和使用方式
2020/03/27 Python
罗技美国官网:Logitech美国
2020/01/22 全球购物
行政文员实习自我鉴定范文
2014/09/14 职场文书
局领导领导班子四风对照检查材料
2014/09/27 职场文书
2014年为民办实事工作总结
2014/12/20 职场文书
Axios取消重复请求的方法实例详解
2021/06/15 Javascript
Vue实现tab导航栏并支持左右滑动功能
2021/06/28 Vue.js
Java SSH 秘钥连接mysql数据库的方法
2021/06/28 Java/Android
vscode内网访问服务器的方法
2022/06/28 Servers