<!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(){

               //匹配父元素下的子元素

                $('#index>div').html('php');

            });

        };

  </script>

 </head>

 <body>

     <div id='index'>

            <div>div1</div>

            <form>

                <div>div2</div> <!--为index下div的孙子辈元素-->

                <div>div3</div><!--为index下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层级原则器（匹配父元素下的子元素）的更多相关文章

  1. jquery层级原则器（匹配前一个元素后的下一个元素，必须是挨着的）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jquery层级原则器（匹配前一个元素后的所有平辈元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jquery层级原则器（匹配后代元素div）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. css控制父元素下的子元素自适应高度，且高度一致

    css代码: .wrap{width:600px;margin:0 auto; overflow:hidden;} .left{background:#ccc;width:300px;float:le ...

  5. stylus选中hover元素的兄弟元素下的子元素

    stylus设置兄弟元素样式:鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ . ...

  6. 当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE ...

  7. 当fixed元素相互嵌套时，父元素会影响子元素的层叠关系，最好不要嵌套使用fixed

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. 解释:层叠关系是受层叠上下文影响的.文档中的层叠上下文由满足以下任意一个条件的元素形成: ...

  8. AngularJs中，如何在父元素中调用子元素为自定义Directive中定义的函数？

    最近一段时间准备使用AngularJs中的自定义Directive重构一下代码. 在这里说明一下,把自定义控件封装成Directive并不一定是要复用,而是要让代码结构更加清晰.就好像你将一个长方法拆 ...

  9. css 选择其父元素下的某个元素

    一,选择器 :first-child   p:first-child(first第一个 child子元素)(找第一个子元素为p) :last-child    p:last-child(last倒数 ...

随机推荐

  1. lua跨平台文件夹遍历匹配查找

    require"lfs" --[[Desc:在B路径D文件中下 搜寻A路径下的没用到的C类文件: 并且将没用到的B类文件名称打印出来: 设置好路径拖到lua自带编辑器中即可运行之; ...

  2. Atitit 团队建设的知识管理

    Atitit 团队建设的知识管理 1.1. 要遵循"知识积累--创造--应用--形成知识平台--再积累--再创造--再应用--形成新的知识平台"的循环过程.1 1.2. 显性知识包 ...

  3. vuejs学习网站推荐

    vuejs学习网站推荐 https://coligo.io/

  4. 执行SSIS Package的三种方式

    1,使用SQL Server job 创建一个job用于执行package,可以制定一个schedule来定时执行job,也可以使用TSql 代码来执行job EXEC msdb.dbo.sp_sta ...

  5. Android入门(七)碎片的生命周期与限定符

    原文链接:http://www.orlion.ga/560/ 这篇文章实际已经在上篇文章中写的差不多了,但是万恶的wordpress没保存!已经不止一次出现这种情况了! 一.碎片的生命周期 1.碎片的 ...

  6. CSS弹性盒模型flex在布局中的应用

    × 目录 [1]元素居中 [2]两端对齐 [3]底端对齐[4]输入框按钮[5]等分布局[6]自适应布局[7]悬挂布局[8]全屏布局 前面的话 前面已经详细介绍过flex弹性盒模型的基本语法和兼容写法, ...

  7. javaBean和jsp应用

    原网页:http://www.douban.com/note/102320977/ JavaBean是一种可复用,跨平台的组件.共有两种JavaBean:一种无用户界面,这种一般用于处理数据运算,操作 ...

  8. 重读 code complete 说说代码质量

    重读code complete 说说代码质量 2014年的第一篇文章本来计划写些过去一年的总结和新年展望,但是因为还有一些事情要过一阵才能完成,所以姑且不谈这个,说说最近重读code complete ...

  9. [New Portal]Windows Azure Virtual Machine (22) 使用Azure PowerShell，设置Virtual Machine Endpoint

    <Windows Azure Platform 系列文章目录> 我们可以通过Windows Azure Management Portal,打开Virtual Machine的Endpoi ...

  10. group by 和聚合函数

    group by 的基本用法 group by做为分组来使用,后面为条件,可以有多个条件,条件相同的为一组,配合聚合函数进行相关统计.在不同数据库中用法稍有不同,这里只测试mysql和oracle. ...