（17）什么是jQuery（jq的流程和基本操作）
jQuery就是对原生js二次封装的工具类（在jq叫构造函数）
jQuery就是一堆方法的集合，jq对象就可以直接调用这些方法来完成指定的需求
使用jq的流程：
1、在HTML页面倒入jq.js文件
2、获取唯一jq对象
3、通过该对象完成具体的事
jq的使用
jq的官网：https://jquery.com/
下载安装：点击这个
下载
（production是生产者版本是看不到源码的，已经打包好的）
（development是开发者版本可以看到源码，）
如何下载jq
1、新建一个文件夹 Directory（自己名命名）
2、新建一个javaScript文件，使用开发者版本，点击开发者版本后复制源码，黏贴入这个jq.js文件内 / 使用生产者版本，点开生产者版本后复制源码，黏贴入jq.min.js文件内（命名的时候min表示压缩版本，就是生产者版本）
PS：压缩版本只有两行，第一行是基本信息，第二行是所有的压缩代码，不能手动去修改，必须通过指定的工具去处理
PS：查看源码，为什么源码中都是window.jQuery，
因为window就是顶级对象（和python中类中的object一样），是代表浏览器打开的整个窗口，也是浏览器自身,所有人都属于window所以window可以省略
PS： $ 就代表jQuery,为什么能代表jQuery，因为本质上$在底层源码中就是window.$，
PS：唯一的jQuery对象我们就是 $ 来表示
jq的基本操作
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jq初识</title>
</head>
<body>
<div class="box">box</div>
<div class="box">box1</div>
</body>
<!--1、页面中导入jq-->
<script src="js/jq.js"></script>
<script>
//在jQuery中通过选择器获取标签的值
console.log($('.box')); //这里获取到的是jQuery对象 //获取到的值保存下来，放入一个变量
var $box = $('.box');
console.log('这里是保存好的jq对象',$box);
//PS:有时候可以看到var $box = $('.box),创建变量名的前面加$就表示这个变量属兔jQ变量，通常都喜欢在变量名前加$
var box = document.querySelector('.box'); //这个属于js对象，使用js方法 //js与jq对象相互转换
//jq转成js，通过数组的索引来转换，js转成jq，将js对象用$包裹起来
console.log(box,$(box),$(box)[0]); //第一个是js对象，第二个是jq对象，第三个通过索引取值后jq对象变成了js对象 //$box 存放着页面两个box的jq对象，如何获取第一个box对应的jq对象
console.log('这里查看',$box.eq(0)); //通过eq（index）索引的方式获得的还是jq对象 //通过对象完成具体的业务逻辑,比如点击事件,而且区分标签
// .box代表页面中所有的类名为box的标签，这些标签全部拥有点击弹窗
$box.click(function () {
alert($(this).index()) //this代表的是自己的js对象 => $(this) 当前被点击的对象
}) </script>
</html>
（17）什么是jQuery（jq的流程和基本操作）的更多相关文章
- jQuery validate运作流程以及重复提示错误问题
一,运作流程 jQuery validate要想运作,首先要加载相应的js <script type="text/javascript" src="/js/clas ...
- Ubuntu 17.04 搭建LAMP服务器环境流程
安装Apache2 安装代码 sudo apt-get install apache2 更改默认目录 sudo vim /etc/apache2/apache2.conf // 将 <Direc ...
- <day005>jQuery事件、文档基本操作 + 点赞事件
任务1: jQuery的基本操作 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta cha ...
- 2018/3/4 Activiti教程之对于流程的基本操作以及从发起到完成还有相关注意事项(与Springboot整合版)三
写教程实在太累了,,,还浪费时间,Activiti教程就写到这好了,不过最近在玩区块链,到时候写几个区块链方面的教程. 这是一些流程的查询与删除api,删除这块,默认是级联删除(加个false参数,就 ...
- 25个实用的jQuery技巧和解决方案
1. 去除页面的右键菜单 $(document).ready(function(){ $(document).bind(“contextmenu”,function(e){returnfalse;}) ...
- 25个实用的jquery技巧
1. 去除页面的右键菜单 $(document).ready(function(){ $(document).bind(“contextmenu”,function(e){returnfalse; ...
- jQuery插件开发（转）
jQuery插件开发 - 其实很简单 [前言]jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常 ...
- jQuery插件开发 - 其实很简单
[前言] jQuery已经被广泛使用,凭借其简洁的API,对DOM强大的操控性,易扩展性越来越受到web开发人员的喜爱,我在社区也发布了很多的jQuery插件,经常有人询问一些技巧,因此干脆写这么一篇 ...
- jQuery之jQuery扩展和事件
一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...
随机推荐
- Android Studio2.1版本后使用虚拟机碰见的问题总结以及其他问题
一.androidstudio的sdk配置问题 如果点击Start a new Android Studio project是没有反应的,并且在Configure下面的SDK Manager是灰色的, ...
- js匀速运动
匀速运动 封装匀速运动原理:设置定时器,将传入的ele,设定一个速度,使用定时器获取当前时间的一个位置,加上速度值,给回节点,当节点到达目标位置,判断给他清除定时器. 匀速效果地址:http ...
- Unity中DOTween插件的DOTweenPath轨迹移动
先来看一下DOTweenPath组件的截图 1.Scene View Commands (1)SHIFT+CTRL:add a waypoint 加一个轨迹点 (2)SHIFT+ALT: ...
- 解决WDCP3环境gbk网站编码程序乱码问题
因为默认WDCP V3版本环境编码格式是UTF-8版本,如果我们程序采用的是GBK编码肯定都会有乱码问题. 我们到WDCP后台,"网站管理"-"PHP设置",看 ...
- 图的邻接矩阵存储实现，C++描述
body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...
- 数据库-->表操作
一.MySQL存储引擎 # InnoDB MySql 5.6 版本默认的存储引擎.InnoDB 是一个事务安全的存储引擎,它具备提交.回滚以及崩溃恢复的功能以保护用户数据.InnoDB 的行级别锁定以 ...
- ：复合模式：duck
#ifndef __QUAKEABLE_H__ #define __QUAKEABLE_H__ #include <iostream> #include <vector> us ...
- 《软件调试 Windows概要》
操作系统是计算机系统中的基本软件.它负责管理系统中的软硬件资源.通常都包括文件管理.内存管理.进程管理.打印管理.网络管理等基本功能.除此之外,支持调试也是操作系统设计的一项根本任务. 0x01 进 ...
- ssh免密登陆
1:建立新用户hadoop 2:进入/home/hadoop/.ssh/目录 3:所有要免密连接的终端运行: ssh-keygen -t rsa 三次回车后会产生:id_rsa,id_rsa.pub两 ...
- 福大软工 · BETA 版冲刺前准备之拖鞋旅游队
拖鞋旅游队BETA 版冲刺前准备 前言 队名:拖鞋旅游队 组长博客:https://www.cnblogs.com/Sulumer/p/10083834.html 本次作业:https://edu.c ...