jquery是继prototype后一个很好用的javascript库。jquery是一个轻量级的库,拥有强大的选择器,出色的DOM操作,可靠的事件处理,完善的兼容性和链式操作等功能.

window.onload  与$(document).ready()的区别
1.执行时机:window.onload 必须等待网页中所有的内容加载完毕之后才能执行(包括图片)
                  
而$(document).ready()当网页中所有DOM结构绘制完毕之后就执行,可能DOM关联的东西并没有加载完。
2.编写个数:window.onload只能编写一次,而后者可以编写好多次
3.简化写法:前者没有,后者可以简写成为$(function(){.......});

一个导航栏的小例子

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
</head>

<style type="text/css">
  .menu{ width:300px;}
  .has_children{ background:#555; color:#fff; cursor:pointer}
  .highlight{ color:#fff; background:green;}
  div{ padding:0; margin:10px 0;}
  div a{ background:#888; display:none; float:left; width:300px;}
</style>

<script type="text/javascript">
$(function(){
    $('.has_children').click(function(){
        $(this).addClass('highlight').children('a').show().end().siblings().removeClass('highlight').children('a').hide();
    });
 
});   
</script>
<body>
<div class="menu">
   <div class="has_children">
      <span>第一章 认识jquery</span>
      <a>1.1javascript 和javascript库</a>
      <a>1.2javascript 和javascript库</a>
      <a>1.3javascript 和javascript库</a>
      <a>1.4javascript 和javascript库</a>
      <a>1.5javascript 和javascript库</a>
      <a>1.6javascript 和javascript库</a>
      <a>1.7javascript 和javascript库</a>
   </div>
   
   <div class="has_children">
      <span>第二章 jquery选择器</span>
      <a>2.1javascript 和javascript库</a>
      <a>2.2javascript 和javascript库</a>
      <a>2.3javascript 和javascript库</a>
      <a>2.4javascript 和javascript库</a>
      <a>2.5javascript 和javascript库</a>
      <a>2.6javascript 和javascript库</a>
      <a>2.7javascript 和javascript库</a>
   </div>
   
   <div class="has_children">
      <span>第三章 jquery操作DOM</span>
      <a>3.1javascript 和javascript库</a>
      <a>3.2javascript 和javascript库</a>
      <a>3.3javascript 和javascript库</a>
      <a>3.4javascript 和javascript库</a>
      <a>3.5javascript 和javascript库</a>
      <a>3.6javascript 和javascript库</a>
   </div>
</div>
</body>
</html>

如何将一个jquery对象转换成DOM对象

(1)jquery对象是一个数组对象,可以通过[index]对象转换

var $cr=$('#cr');   var cr=$cr[0];   alert(cr.checked);

(2)利用jquery本身的get(index)方法

var $cr=$('#cr');      var cr=$cr.get(0);   alert(cr.checked);

 

jquery学习之笔记一的更多相关文章

  1. [2016-10-24]jQuery学习回顾笔记1.0

    一.如何把 jQuery 添加到网页 <script> 标签应该位于页面的 <head> 部分. <head> <script src="jquer ...

  2. JQuery学习使用笔记 -- JQuery插件开发

    内容转载自 http://www.css88.com/archives/4821 扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间.这篇文章将概述jQuery插件开发的基本知识,最 ...

  3. jQuery学习笔记(一)jQuery选择器

    目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...

  4. jQuery 学习笔记

    jQuery 学习笔记   一.jQuery概述    宗旨: Write Less, Do More.    基础知识:        1.符号$代替document.getElementById( ...

  5. jQuery学习笔记(一):入门

      jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...

  6. jQuery学习笔记 - 基础知识扫盲入门篇

    jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...

  7. JQuery学习笔记——层级选择器

    JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...

  8. jQuery学习笔记之Ajax用法详解

    这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...

  9. WCF入门教程(四)通过Host代码方式来承载服务 一个WCF使用TCP协议进行通协的例子 jquery ajax调用WCF,采用System.ServiceModel.WebHttpBinding System.ServiceModel.WSHttpBinding协议 学习WCF笔记之二 无废话WCF入门教程一[什么是WCF]

    WCF入门教程(四)通过Host代码方式来承载服务 Posted on 2014-05-15 13:03 停留的风 阅读(7681) 评论(0) 编辑 收藏 WCF入门教程(四)通过Host代码方式来 ...

随机推荐

  1. java 读取并且显示 txt 文件

    系统:mac os x 10.9 eclipse 在eclipse 中建立一个project, 命名为Cin_txt, Cin_txt的内容 test wang hello world 以下是输入的代 ...

  2. (转)Source vs Binary Disadvantages & Advantages of each!

    原链接:http://www.linuxforums.org/forum/newbie/26472-source-vs-binary-disadvantages-advantages-each.htm ...

  3. Wordpress更换主题之后出错

    今天吃完午饭,休息休息,最近搞了一下google adsense,不过最终的审核没通过,我想会不会是界面不好看呢,饭后就在电脑旁,更换了几个wordpress主题,我的博客使用wordpress搭建的 ...

  4. JVM学习积累

    1. Java代码编译和执行的整个过程包含了三个重要的机制: Java源码编译机制 类加载机制 类执行机制 2. 关于Java源码编译机制 Java源码编译由以下三个过程组成: 分析和输入符号表 注解 ...

  5. 轻量级jquery框架之--布局(layout)

    布局需求 (1)支持横向生成布局项即可,不需要纵向生成布局. (2)支持布局项右侧收缩功能 (3)支持自定义布局项图标.标题,并提供动态修改布局项图片和标题的api (4)支持JSON/html/if ...

  6. 轻量jquery框架之--组件交互基础设计

    概要 组件交互基础,即考虑在JQUERY对象下($)下扩展所有组件都需要用到的通用api,如ajax入口.对表单的操作.html片段加载.通用的配合datagrid通用的curd客户端对象等. 扩展a ...

  7. Nightmare(BFS)

    #include <iostream> #include <cstdio> #include <cstring> #include <queue> #d ...

  8. 1005 Jugs

    辗转相减,新手入门题.两个容量的灌水题,无所谓最优解. #include<stdio.h> int main(){ int A,B,T,sA,sB; ){ sA=sB=; ){ ){ pr ...

  9. USB枚举过程的详细流程

    USB枚举过程的详细流程 用户将一个USB设备插入USB端口,主机为端口供电,设备此时处于上电状态.主机检测设备.1>Hub使用中断通道将事件报告给Host.2>Host发送Get_Por ...

  10. DES、AES、TEA加密算法的比较

    1.     DES算法介绍: DES算法具有对称性, 既可以用于加密又可以用于解密.对称性带来的一个很大的好处在于硬件实现, DES 的加密和解密可以用完全相同的硬件来实现.DES 算法的明文分组是 ...