zoukankan      html  css  js  c++  java
  • [jquery]高级篇--获取div子元素

    参考:  http://zhidao.baidu.com/link?url=IfeQQBn1xMLqWvwdkKbQYJ8mC6ciGi_8M1NYkm6iQ-kXBMX2f2ylN-ckzFLiynnE0nz4hBC6e5CrwaOfwLfata

    参考:  http://blog.sina.com.cn/s/blog_7718755501019kg5.html

    实现方法:使用遍历函数children(),关键代码为 $(this).children("li"),表示获取当前元素下所有标签为<li>的子元素。

    下面实例演示:点击div标签后,何用$(this)选择它下面的<li>子元素,为了显示效果,将其设置为红色。

    1、新建HTML文件,输入如下的HTML结构,为了说明问题,在div标签下除了li元素外,还设置了其他类型的子元素。

    1 <div id="test">
    2     <span>我是span标签</span><br>
    3     <li>我是li标签</li>
    4     <a href="#">我是超链接a标签</a>
    5 </div>

    2、在上面新建文件的开头输入如下jquery代码,表示在单击div标签区域后,执行一个函数,具体动作为获取当前div下的li标签元素,然后使用css()函数设置它的字体颜色为红色。

    1 <script>
    2 $(function(){
    3     $("#test").click(function() {    // 单击div元素
    4         $(this).children('li').css('color','red');    // 使用children('li')获取div下的li元素,然后设置颜色为red即红色
    5     });
    6 }); 
    7 </script>

    3、保存文件,使用浏览器打开,演示效果如下图所示,从结果可知,只有div下的li子元素被选中。

    ------------------------------------------------------------------------------------------------------------------

    1 <div class="father"><div class="son"></div><div class="otherson"></div></div>
    2 <div class="father"><div class="son"></div><div class="otherson"></div></div>
    1 $(function(){
    2   $("father").mouseover(function(){
    3     $(this).find('.son').removeClass("disn");
    4   });
    5 });
  • 相关阅读:
    DNT论坛整合笔记二
    LINQ中的动态排序
    无法安装数据库关系图支持对象的解决方法
    总访问量,日访问量,周访问量统计代码
    ASP.NET 数据绑定控件和 Eval方法
    KindEditor ASP.NET 上传/浏览服务器 附源码
    地图定位 图吧地图定位 附javascript源码每行都有注释
    java.io.IOException: Unable to open sync connection!
    Canvas和Paint实例
    Android初级教程_获取Android控件的宽和高
  • 原文地址:https://www.cnblogs.com/aiqingqing/p/5048854.html
Copyright © 2011-2022 走看看