首先分清jQuery对象和DOM对象，这两者可相互转化，如：

var $cr=$("#cr");          //jquery对象

var cr=$cr[0] ;             //DOM对象

var cr=$cr.get(0);         //DOM对象

var cr=document.getElementById("cr");     //DOM对象

var $cr=$(cr);                                      //jquery对象

jquery选择器：

1.无论元素是否存在，$("xx")都都是一个对象，因此判断语句应这样写：

if ($("xx").length>0) {

}

2.

基本选择器：

$("#id")    $(".class")     $("*")      $("div,span,p.myclass")

层次选择器：

$("div span")                    后代元素范围大，只要是后代都满足

$("div>span")                   子元素范围小，只能是一级子元素才被选中

过滤选择器：

$("div:first")     格式以：开头

内容过滤选择器：

$("div:contains(text)")   同样以：开头，但以内容作为过滤依据

可见性过滤选择器：

属性过滤选择器：

子元素过滤选择器：

表单属性过滤选择器：

exa

<!DOCTYPE html>

<html>

<head>

   <meta charset="utf-8">

   <title>example for html5</title>

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

</head>

<body>

<div class="subcategorybox">

   <ul>

     <li><a href=#>佳能</a></li>

     <li><a href=#>索尼</a></li>

     <li><a href=#>三星</a></li>

     <li><a href=#>尼康</a></li>

     <li><a href=#>松下</a></li>

     <li><a href=#>卡西欧</a></li>

     <li><a href=#>富士</a></li>

     <li><a href=#>柯达</a></li>

     <li><a href=#>宾得</a></li>

     <li><a href=#>理光</a></li>

     <li><a href=#>奥林巴斯</a></li>

     <li><a href=#>明基</a></li>

     <li><a href=#>爱国者</a></li>

     <li><a href=#>其他</a></li>

   </ul>

</div>

<div class="showmore">

   <a href=# onclick="return false"><span>显示其他品牌</span></a>

</div>

<script type="text/javascript">

$(document).ready(function(){

$("div li:gt(6):not(last)").hide();

$(".showmore>a").click(

function(){

     if ($("li:hidden").length>0)

         {

            $(".showmore>a").html("精简显示品牌");

            $("li:hidden").show();}

     else

         {

            $(".showmore>a").html("显示其他品牌");

            $("div li:gt(6):not(:last)").hide();

         }

});        

});

</script>

</body>

</html>

锋利的jQuery笔记的更多相关文章

  1. jQuery总结或者锋利的jQuery笔记二

    第三章  jQuery 中 DOM 操作 , 进入这一章,你必须先要有 选择器的基础, 最好是基本选择器 (id,class,*,div,p 组合等) ,  层次选择器(div ul),(div> ...

  2. 【6】锋利的 jQuery 笔记

    1. 代码技巧 1. 利用 id, class 实现同级隐藏显示 效果如下: 2. 字体放大效果 效果图: 3. tab 切换 效果图: 4. 切换样式 添加 Cookie 效果图: 5. 编写插件 ...

  3. jQuery总结或者锋利的jQuery笔记一

      在线测试脚本网站 层次 选择器要多花时间看看. 第一章: hover = enter+leave jQuery对象 jQuery产生的对象时jQuery独有的,只能自己调用 var $c=$(&q ...

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

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

  5. 《锋利的jQuery》读书笔记（DOM+事件）

    前阵子买了一批书,就从锋利的jQuery看起吧,书中一些太过常规以及没有强记必要性的操作就不记录了. 1.DOM加载后执行JS $(document).ready(function(){ //.... ...

  6. 《锋利的JQuery》读书要点笔记1——认识JQuery&&选择器

    <锋利的jQuery>源码下载,包括了这本书中全部代码以及用到的CSS文件 第一章 认识jQuery jQuery是个Js库.首先该明确的一点是:在jQuery库中$就是jQuery的一个 ...

  7. JQuery笔记汇总

    jQuery相关资料 官网: jQuery官网 在线API: jQuery在线API W3School:W3School-jQuery教程(中文版哦) 下载jQuery:jQuery各版本下载 jQu ...

  8. jQuery笔记总结

    来源于:http://blog.poetries.top/2016/10/20/review-jQuery/ http://www.jianshu.com/p/f8e3936b34c9 首先,来了解一 ...

  9. jquery笔记之属性选择器 查找以某种条件开头的页面元素

    jquery笔记之属性选择器 查找以某种条件开头的页面元素 转载:http://www.blogbus.com/amyqiong-logs/78340326.html $("div[id]& ...

随机推荐

  1. 【转载】Centos7 中使用Supervisor守护进程

    配置supervisor实现进程守护 1.安装supervisor yum install Supervisor   2.启动服务 supervisord -c /etc/supervisord.co ...

  2. Erlang内存吃紧之解决思路

    首先使用erlang:memory()确定是哪个部分内存吃紧,根据输出的内容,比对内存占用大小,有针对性地进行分析.在erlang系统里内存的单位为word,通过erlang:system_info( ...

  3. Wing ide 6.0 注册 ，python 3.6环境

    直接切入主题,套路如下: 1.选择手动输入license license number输入:CN123-12345-12345-12345 2.在下一步中,选择第二项,拷贝的request code ...

  4. google gflag使用方法举例

    前言: 1. gflag是一种命令行编码参数解析工具,开源地址: https://github.com/gflags/gflags , 在caffe框架也使用了gflag来编码解析命令行. 那么什么是 ...

  5. ubuntu16中遇到libgstreamer-0.10.so.0缺失解决方案

    1. error while loading shared libraries: libgstreamer-0.10.so.0: cannot open shared object file: No ...

  6. Hadoop（十）Hadoop IO之数据完整性

    前言 上一篇我分享了Hadoop的压缩和编解码器,在我们开发的过程中其实是经常会用到的,所以一定要去掌握.这一篇给大家介绍的是Hadoop的数据完整性! Hadoop用户在使用HDFS储存和处理数据不 ...

  7. Codeforces Round #404 (Div. 2)(A.水,暴力，B,排序，贪心)

    A. Anton and Polyhedrons time limit per test:2 seconds memory limit per test:256 megabytes input:sta ...

  8. HDU1159-Common Subsequence-LCS

    上次写题解写到一半,写的比较具体,没写完,忘记存草稿了...导致现在没心情了. Common Subsequence Time Limit: 2000/1000 MS (Java/Others)    ...

  9. 浅尝辄止WPF自定义用户控件(实现颜色调制器)

    主要利用用户控件实现一个自定义的颜色调制控件,实现一个小小的功能,具体实现界面如下. 首先自己新建一个wpf的用户控件类,我就放在我的wpf项目的一个文件夹下面,因为是一个很小的东西,所以就没有用mv ...

  10. vi 方向键和Backspace键失效问题的解决方法

    安装的ubuntu默认的编辑器是vi,遇到了两个问题: ① insert模式下,按方向键将产生A.B.C.D等字符,解决方案: :set nocompatible ② insert模式下Backspa ...