1.导航菜单：选中后显示当前标签下的子标签并且高亮，并且隐藏其他同级标签，（一行级联操作即完成），主要看end()函数用法。

end():

回到最近的一个"破坏性"操作之前。就是指任何改变所匹配的jQuery元素的操作。

这包括在 Traversing 中任何返回一个jQuery对象的函数--'add', 'andSelf', 'children', 'filter', 'find', 'map', 'next', 'nextAll', 'not', 'parent', 'parents', 'prev', 'prevAll', 'siblings' and 'slice'--再加上 Manipulation 中的 'clone'。

我的理解：上边的函数会使当前操作的jqeury对象改变，加上end()回到原来的jquery对象，方便级联操作。

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

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>--</title>

<style type="text/css">

#menu {

    width:300px;

}

.has_children{

    background : #;

    color :#fff;

    cursor:pointer;

}

.highlight{

    color : #fff;

    background : green;

}

div{

    padding:;

}

div a{

    background : #;

    display : none;

    float:left;

    width:300px;

}

</style>

<!-- 引入 jQuery -->

<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>

<script type="text/javascript">

//等待dom元素加载完毕.

$(document).ready(function(){

    $(".has_children").click(function(){

        $(this).addClass("highlight")            //为当前元素增加highlight类

            .children("a").show().end()            //将子节点的a元素显示出来并重新定位到上次操作的元素

        .siblings().removeClass("highlight")        //获取元素的兄弟元素，并去掉他们的highlight类

            .children("a").hide();                //将兄弟元素下的a元素隐藏

    });

});

</script>

</head>

<body>

<div id="menu">

    <div class="has_children">

        <span>第1章-认识jQuery</span>

        <a>1.1-JavaScript和JavaScript库</a>

        <a>1.2-加入jQuery</a>

        <a>1.3-编写简单jQuery代码</a>

        <a>1.4-jQuery对象和DOM对象</a>

        <a>1.5-解决jQuery和其它库的冲突</a>

        <a>1.6-jQuery开发工具和插件</a>

        <a>1.7-小结</a>

    </div>

    <div class="has_children">

        <span>第2章-jQuery选择器</span>

        <a>2.1-jQuery选择器是什么</a>

        <a>2.2-jQuery选择器的优势</a>

        <a>2.3-jQuery选择器</a>

        <a>2.4-应用jQuery改写示例</a>

        <a>2.5-选择器中的一些注意事项</a>

        <a>2.6-案例研究——类似淘宝网品牌列表的效果</a>

        <a>2.7-还有其它选择器么？</a>

        <a>2.8-小结</a>

    </div>

    <div class="has_children">

        <span>第3章-jQuery中的DOM操作</span>

        <a>3.1-DOM操作的分类</a>

        <a>3.2-jQuery中的DOM操作</a>

        <a>3.3-案例研究——某网站超链接和图片提示效果</a>

        <a>3.4-小结</a>

    </div>

</div>

</body>

</html>

锋利的jQuery-1--end()的更多相关文章

  1. 锋利的jQuery学习总结

    通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...

  2. [jQuery]《锋利的jQuery》插件部分总结

    /** * <锋利的jQuery>插件部分总结 * * jQuery插件推荐命名:jquery.name.js * * $.fn.extend用于封装对象方法的插件 * $.extend用 ...

  3. 锋利的jQuery读书笔记---选择器

    前段时间入手了锋利的jQuery(第二版),想着加强下自己的js能力,可前段时间一只在熟悉Spring和Hibernate.最近抽时间开始读这本书了,随便也做了些记录. 读书的过程是边看边代码测试,所 ...

  4. 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行

    最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...

  5. 【锋利的jQuery】表单验证插件踩坑

    和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在f ...

  6. 锋利的jQuery幻灯片实例

    //锋利的jQuery幻灯片实例 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  7. 锋利的jQuery（第二版）学习总结

    通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...

  8. jQuery下拉框操作系列$("option:selected",this) &&（锋利的jQuery）

    jQuery下拉框操作系列$("option:selected",this)  &&(锋利的jQuery) <!DOCTYPE html> <ht ...

  9. Jquery全选系列操作（锋利的jQuery）

    Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  10. 读《锋利的jQuery》中first-child时的一个细节

    今天在看<锋利的jQuery>这书时,看到过滤选择器那一节.有个知识点引起了我的注意. (我不用书里一模一样的代码做例子)举个简单的例子-代码: <ul> <li> ...

随机推荐

  1. linux输入输出重定向

    http://www.cnblogs.com/chengmo/archive/2010/10/20/1855805.html 在Linux下,当一个用户进程被创建的时候,系统会自动为该进程创建三个数据 ...

  2. 使用Uploadify实现上传图片生成缩略图例子,实时显示进度条

    不了解Uploadify的,先看看前一篇详细说明 http://www.cnblogs.com/XuebinDing/archive/2012/04/26/2470995.html Uploadify ...

  3. Backbone源码分析-Backbone架构+流程图

    作者:nuysoft/高云/nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接. Backbone0.9.1源码分析分析系列 jQuery1.6.1源码分析系 ...

  4. [iOS翻译]《The Swift Programming Language》系列：Welcome to Swift-01

    注:CocoaChina翻译小组已着手此书及相关资料的翻译,楼主也加入了,多人协作后的完整译本将很快让大家看到. 翻译群:291864979,想加入的同学请进此群哦.(本系列不再更新,但协作翻译的进度 ...

  5. JS 模板引擎之JST模板

    项目中有用到JST模板引擎,于是抽个时间出来,整理了下关于JST模板引擎的相关内容. 试想一个场景,当点击页面上列表的翻页按钮后,通过异步请求获得下一页的列表数据并在页面上显示出来.传统的JS做法是编 ...

  6. [CareerCup] 3.4 Towers of Hanoi 汉诺塔

    3.4 In the classic problem of the Towers of Hanoi, you have 3 towers and N disks of different sizes ...

  7. VC6.0中MFC界面换肤简例

    利用VC中的MFC进行界面设计时,发现界面上的各控件无法简易地进行调整,比如字体大小.颜色.格式等. 为了改变外观,小小地美化一下,今天决定动手一试. 网上提供的库和方法不计其数,我选择了SkinMa ...

  8. 如何添加win10命令提示符字体，美化显示效果

    如图,win10命令提示符的字体真让人难受的要死,难道就不能改成好看一点的吗?笔者开始了停不下来的百度和Google 在查找了大量零碎或者过时的资料后,终于找到了一篇看起来还是很靠谱的文章: Quic ...

  9. linux中的服务

    一.服务分类 独立的服务比如像httpd服务,用户可以直接来访问.并且独立服务常驻内存.而xinetd服务是一个服务管理器,它是常驻内存的,它下面有很多子服务,但这些子服务并不长驻内存.当用户想要使用 ...

  10. 开放封闭原则（OCP，Open Closed Principle）

    tks:http://www.cnblogs.com/Benjamin/p/3251987.html