jQuery 学习（1）——认识jQuery
1.下载
下载地址：http://jquery.com/download/
jquery-3.2.1.js——用于开发和学习（229K）
jquery-3.2.1.min.js——用于项目和产品（31K）
2.引入jQuery.js
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-3.2.1.js"></script>
<script src="js/jquery-3.2.1.min.js"></script>
</head>
3.编写jQuery代码
<script type="text/jscript">
$(document).ready(function(){
<!--语句体-->
alert("0000000001");
});
<!--简写-->
$(function(){
<!--语句体-->
alert("0000000002");
});
</script>
结论：网页中所有DOM绘制完毕后执行，可能元素关联的东西并没有加载完，前后同时输出
4.DOM对象——Document Object Model,文档对象模型。DOM树，用来构建一个基本网页。
<h3>\<p>/<ul><li>子节点都是DOM元素节点。
获得DOM对象：
var domObj=document.getElementById("id");
使用JavaScript中的属性——innerHTML：
var ObjHTML=domObj.innerHTML;
5.jQuery对象——通过jQuery包装DOM对象后产生的对象。.jQuery对象只能使用.jQuery对象方法。
获取id为foo的元素内的html代码。html()是.jQuery方法，如下：
$("#foo").html();
等同于
document.getElementById("foo").innerHTML;
6.jQuery对象和DOM对象的相互转换
如果获取的对象是——jQuery对象，那么在变量前加$.
var $variable=jQuery对象;
如果获取的对象是——DOM对象
var variable=DOM对象;
(1)jQuery对象——转——DOM对象
方法一：jQuery对象是一个类似数组的对象，可以通过[index]的方法得到相应的DOM对象。
var $cr=$("#cr"); //jQuery对象
var cr=$cr[0]; //DOM对象
alert(cr.checked); //检测checked是否被选中了
方法一：jQuery方法，通过get(index)方法得到相应的DOM对象。
var $cr=$("#cr"); //jQuery对象
var cr=$cr.get(0); //DOM对象
alert(cr.checked); //检测checked是否被选中了
(2)DOM对象——转——jQuery对象
方法：只要用$()把DOM对象包装起来，就可以获得一个jQuery对象；方式为$(DOM对象)
var cr=docment.getElentById("cr"); //DOM对象
var $cr=$(cr); //jQuery对象
1.5 jQuery库和其它库的冲突
（1）jQuery库在其他库之后导入
方法一：在jQuery第一行，调用jQuery.noConflict()函数来将变量$的控制权移交给其他JavaScript库；
方法二：用其它快捷字母代替$，自定义一个快捷方式。
语法： var 其它快捷字母代替$=jQuery.noConflict();
var $j=jQuery.noConflict(); //自定义一个快捷方式
$j(function(){ //使用jQuery，利用自定义快捷方式——$j
$j("p").click(function(){
alert($j(this).text());
})
})
$("pp").style.display='none'; //使用prototype.js隐藏元素
可以自定义备用名称，如jq\$j\awesomequery等。
问题：如果不想给jQuery自定义名称，还想使用$而不管其他库的$（）方法，同时又不想与其它库相冲突。
解决方法一：
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(function($){ //使用jQuery设定页面加载时执行的函数
$("p").click(function(){ //在函数内部继续使用$()方法
alert($(this).text());
})
})
$("pp").style.display='none'; //使用prototype.js隐藏元素
解决方法二：
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
(function($){ //定义匿名函数并设置形参为$
$(function(){ //匿名函数内部的$均为jQuery
$("p").click(function(){ //继续使用$()方法
alert($(this).text());
})
})
})(jQuery); //执行匿名函数且传递实参jQuery
$("pp").style.display='none'; //使用prototype.js隐藏元素
（2）jQuery库在其他库之前导入
可以直接使用“jQuery”来做一些jQuery工作。同时使用$（）方法作为其他库的快捷方式，无需调用jQuery.noConflict()函数。如下：
jQuery(function(){ //直接使用jQuery，无需调用jQuery.noConflict()函数
jQuery("p").click(function(){
alert(jQuery(this).text());
})
})
$("pp").style.display='none'; //使用prototype.js隐藏元素
jQuery 学习（1）——认识jQuery的更多相关文章
- jQuery 学习笔记：jQuery 代码结构
jQuery 学习笔记:jQuery 代码结构 这是我学习 jQuery 过程中整理的笔记,这一部分主要包括 jQuery 的代码最外层的结构,写出来整理自己的学习成果,有错误欢迎指出. jQuery ...
- jQuery学习笔记之jQuery的Ajax（3）
jQuery学习笔记之jQuery的Ajax(3) 6.jQuery的Ajax插件 源码地址: https://github.com/iyun/jQueryDemo.git ------------- ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- jQuery学习之二 jQuery选择器
一.jQuery选择器是什么1.CSS选择器2.jQuery选择器 二.jQuery选择器的优势1.简洁的写法2.支持从CSS1到CSS3选择器3.完善的处理机制 传统js选择器假如要操作的元素不存 ...
- jQuery学习-什么是jquery? Js与jquery之间的关系 Jquery选择器
1. 什么是jQuery以及学习的意义等 jQuery是一个js库 JS库是什么? 把常用的方法,进行封装,封装到一个单独的js文件当中,要用的时候直接调用. 学习jQuery主要学什么? 学习jQ ...
- jQuery学习笔记(二)jQuery中DOM操作
目录 DOM操作分类 jQuery中的各种DOM操作 查找节点 创建节点 删除节点 复制节点 替换节点 包裹节点 属性操作 样式操作 对HTML.文本和值的操作 遍历节点 CSS-DOM操作 小结 本 ...
- JQuery学习使用笔记 -- JQuery插件开发
内容转载自 http://www.css88.com/archives/4821 扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间.这篇文章将概述jQuery插件开发的基本知识,最 ...
- jQuery学习笔记之jQuery.fn.init()的参数分析
这篇文章主要介绍了jQuery.fn.init()的参数分析,需要的朋友可以参考下 从return new jQuery.fn.init( selector, context, rootjQuer ...
- jQuery学习笔记（jquery.ui插件）
官网地址:http://ui.jquery.com/ jQuery UI源自于一jQuery插件-Interface.目前版本是1.10.3,需要jQuery 1.6以上版本支持. jQuery UI ...
- jQuery学习笔记（jquery.simplemodal插件）
官网地址:http://www.ericmmartin.com/ SimpleModal是一个轻量级的jQuery插件,它为模式窗口的开发提供了一个强有力的接口,可以把它当作模式窗口的框架.Simpl ...
随机推荐
- mysql字符集问题汇总
1.设置mysql字符集:在my.ini中添加以下设置,没有my.ini可以将my_default.ini改成他.character-set-server=utf8[client]loose-defa ...
- HttpWatch入门使用教程
HttpWatch V10.0.20.0 官方免费版 HttpWatch是强大的网页数据分析工具.集成... HttpWatch Professional V10.0.20.0 官方下载 HttpWa ...
- ghithub中PHPOffice/PHPWord的学习
1.概念:PHPWord是用纯PHP提供了一组类写入和从不同的文档格式的文件阅读库.PHPWord的当前版本支持微软的Office Open XML(OOXML或处理OpenXML),用于Office ...
- 高性能之js
alloyteam团队的总结: 链接在:http://www.alloyteam.com/2012/10/high-performance-front-end-high-performance-jav ...
- Nginx报502错误,PHP最大执行时间设置
PHP执行时间太长导致的 我在程序的最上方写了set_time_limit(0);不管用 因为max_execution_time在 php-cgi(php-fpm) 中,该参数不会起效. 真正能够控 ...
- 使用 Django-debug-toolbar 优化Query 提高代码效率
一段程序执行效率慢,除了cpu计算耗时外,还有一个很重要的原因是SQL的Duplicated过多,使用Django-debug-toolbar能够快速找出哪些地方的SQL可以优化,提高程序执行效率 1 ...
- Noj - 在线强化训练1
1445 A 求n个整数的和 1564 B 判断一个数是否是完全数 1011 C 判素数(Prime number) 1566 D 输入一组整数,找出最小值 1200 E 判断三角 ...
- C++实现--最大公因数和最小公倍数
一丶 最大公因数求法: 辗转相除法(也称欧几里得算法)原理: 二丶最小公倍数求法:两个整数的最小公倍数等于两整数之积除以最大公约数 C++ 代码实现 #include <iostream ...
- 基于C语言的Socket网络编程搭建简易的Web服务器（socket实现的内部原理）
首先编写我们服务器上需要的c文件WebServer.c 涉及到的函数API: int copy(FILE *read_f, FILE * write_f) ----- 文件内容复制的方法 int Do ...
- python mysql中文乱码
问题: MySQLdb存入数据库后,在命令行查询 "select * from ip;",其中的中文都是乱码的. 但是通过python 执行 "select * from ...