当前位置：首页 > 编程日记 > 正文

jQuery学习(第一天)

编程日记 2024-09-19 08:00:00

js的回顾

遇到的问题

1.window.onload只能使用一个(事件覆盖问题)
2.代码的容错性不强
3.浏览器兼容性问题
4.代码量较多,书写很繁琐
5.代码很乱到处都是
6.动画效果我们很难实现

jQuery的基本使用

image.png

min：它是压缩过的版本
区别：我们开发过程中，会用未压缩的版本，或者压缩的。
项目上线的时候，我们要用压缩过的版本。
版本问题：
1.1.xxx 版本 jQuery-1.11.1.js
2.2.xxx 版本不再支持IE6、7、8

引包

1.要把我们的jQuery源文件拿到我们的项目里面来
2.在我们的页面中引用jQuery文件

image.png

问题：

image.png

如果遇到这种问题，那肯定是没有引用我们的jQuery源文件。
用jQuery之前，先引入jQuery，然后，再去写我们的jQuery代码。

入口函数的书写方式(两种)

$(document).ready(function(){});
$(function(){});

2018-01-08 17-16-29 的屏幕截图.png

事件处理程序

事件源
js:document.getElementById("id");
jq:$("#id")

2.事件
js:document.getElementById("id").onclick = function(){//语句}
jq:$("#id").click(function(){//语句})

区别:
jQuery事件不带on

简单的练习
- 使显示的div框隐藏起来

//引包
<script src="js/jquery.js"></script>
//给定格式
<style type="text/css">* {margin: 0;padding: 0;}div {height: 200px;background: #000000;margin-bottom: 10px;/*display: none;*/}</style>
//具体函数代码<script>//入口函数$(document).ready(function () {//语句$("#click").click(function () {$("div").hide();});});</script>
.
.
.
//页面主体(body)
<input type="button" value="我是按钮" id="click" />
<div></div>

JQuery详细介绍

$的问题

js命名规则:
a)Js命名归法：下划线、字母、$、数字
b)但是不能以数字作为开头
var $ = “我是$符号”;
jQUery的两个变量：$ 和 jQuery
jQuery占用了我们两个变量：$ 和 jQuery

js入口函数与jQuery入口函数的区别

1.Js的window.onload事件是等到所有内容，以及我们的外部图片之类的文件加载完了之后，才回去执行
2.jQuery的入口函数是在 html所有标签都加载之后，就回去执行。

js创建对象

三种方式
- var obj = {}
- var obj1 = new Object();
- var obj2 = Object.create();

1跟2的区别：
推荐使用第一个方式
第二种方式存在效率问题，因为要new对象，会涉及到原型查找的问题。

jquery选择器

回顾css选择器

image.png

image.png

jquery选择器

image.png

image.png

规律：$(selector).css(“background”,”red”);
Console.log();在控制台(网页)打印
具体实现

image.png

image.png

image.png

设置多个样式为$("#...").css({...});
根据自己的意愿设置的时候函数内的参数为形参（可自定义）
设置某一个时需要进行相应的判断

jQuery是什么

jQuery就是javascript的一个库，把我们常用的一些功能进行了封装，方便我们来调用，提高我们的开发效率。
####### Javascipt跟jQuery的区别

Javascript是一门编程语言，我们用它来编写客户端浏览器脚本。
jQuery是javascript的一个库，包含多个可重用的函数，用来辅助我们简化javascript开发
image.png

故：jQuery能做的javascipt都能做到，而javascript能做的事情，jQuery不一定能做到。

jQuery其他选择器

层级选择器

image.png

* 层级选择器选择了选择符后面那个元素，比如，div > p，是选择>后面的p元素。

过滤选择器
- 基本选择器

image.png

image.png

属性选择器

image.png

image.png

mouseover/mouseout事件跟mouseenter/mouseleave事件的区别

mouseover/mouseout事件，鼠标经过的时候会触发多次，每遇到一个子元素就会触发一次。
mouseenter/mouseleave事件，鼠标经过的时候只会触发一次
推荐使用mouseenter/mouseleave

dom对象与jQuery对象之间的相互转换

jQuery对象转换成DOM对象:
方式一：$(“#btn”)[0]
方式二：$(“#btn”).get(0)

DOM对象转换成jQuery对象：
$(document) -> 把DOM对象转成了jQuery对象
var btn = document.getElementById(“bt n”);
btn -> $(btn);

鼠标事件的几种方法

 <script>$(document).ready(function () {
//第一种// mouseenter事件 是 鼠标经过时触发的事件/*$(".wrap li").mouseenter(function () {$(this).children("ul").show();});$(".wrap li").mouseleave(function () {$(this).children("ul").hide();});*/
//第二种 hover 传两个参数/*$(".wrap li").hover(function () {//alert("1");$(this).children("ul").show();}, function () {$(this).children("ul").hide();});*/
//第三种 hover 传一个参数 进行必要的判断/*$(".wrap li").hover(function () {/!*alert("1");*!/var $this = $(this).children("ul");var isShow = $this.css("display");if(isShow === "block") {$this.hide();} else {$this.show();}});*/
//第四种 hover 传一个参数 （给一个‘slideToggle’ 切换 的效果）$(".wrap li").hover(function () {$(this).children("ul").slideToggle();});});</script>

实例

image.png

image.png

https://www.dkcj.cn/info/19380.html

【组队学习】曹志宾：基于Python的会员数据化运营

分享人：曹志宾，Datawhale成员，香港科技大学硕士在读分享内容： 案例描述与分析前期准备与数据预处理RFM模型使用与操作Excel中的RFM分析组队学习： 红星：基于Python的会员数据化运营孙健坤：…

编程日记2024/09/19 07:50:00

为什么要参加java培训?有哪些优势?

很多人都想要通过学习java技术进入到互联网行业，有一部分人是自学，有一部分是报Java培训班学习，报培训班的人比较多，那么为什么要参加java培训?有哪些优势?来看看下面的详细介绍。为什么要参加java培训?有哪些优势?俗话说&am…

编程日记2024/09/19 07:40:00

一、javaSE （二十三）多线程

1:多线程(理 (1)多线程:一个应用程序有多条执行路径进程: 正在执行的应用程序线程: 进程的执行单元,执行路径单线程: 一个应用程序只有一条执行路径多线程: 一个应用程序有多条执行路径多进程的意义? 提高CpU的使用率多线程的意义? 提高应用程序的使用案 (2)Java程序的…

编程日记2024/09/19 07:30:00

【青少年编程】【二级】绘制图形

「青少年编程竞赛交流群」已成立（适合6至18周岁的青少年），公众号后台回复【Scratch】或【Python】，即可进入。如果加入了之前的社群不需要重复加入。微信后台回复“资料下载”可获取以往学习的材料（视频、代码、文档&…

编程日记2024/09/19 07:20:00

web前端培训分享：面向对象中类和对象的定义是什么?

在学习web前端技术的时候，我们接触的最多的便是面向对象这一块，其实很多编程技术都有用到这个现象，下面我们就为大家详细的介绍一下面向对象中类和对象的定义是什么? web前端培训分享：面向对象中类和对象的定义是什么?面向对象让…

编程日记2024/09/19 07:10:00

无法嵌入互操作类型...请改用适用的接口解决办法

http://blog.163.com/quan2006126/blog/static/1702286352010101810324232/背景：visual studio 2010、“添加引用”时出错： “无法嵌入互操作类型...请改用适用的接口” 解决方案： 选中项目中引入的dll， 鼠标右键， 选择…

编程日记2024/09/19 07:00:00

宁彦吉：如何进行作业的评审？

如何进行作业的评审由于我们的组队学习是开放的，大家都可以一起学习，一起来做航海士，宁彦吉把作业评选的教程总结出来，这样方便后面的航海士熟悉任成森开发的系统。一、登录 1、登录流程打开浏览器输入作业评审中心地址…

编程日记2024/09/19 06:50:00

O(1) 常数阶 #include <stdio.h> #include <string.h>int main( ) {int i,sum 0,n 100000000000;sum (1 n) * (n /2);printf("%d",sum);return 0; }执行次数不随n的变化而变化。 O(n) 线性阶 #include <stdio.h> #include <string.h>int …

编程日记2024/09/19 06:40:00

access百度翻译 get_百度AI攻略：智能上色

1.功能描述：想必大家家里都有很多黑白的老照片，里面有着满满的回忆。百度智能识别黑白图像内容并填充色彩，使黑白图像变得鲜活，让老照片重新焕发活力。说干就干，攻略和代码奉上。2.平台接入黑白图像上色接入网址&#…

编程日记2024/09/19 06:30:00

sql语句中left join和inner join中的on与where的区别分析

原文:sql语句中left join和inner join中的on与where的区别分析关于SQL SERVER的表联接查询INNER JOIN 、LEFT JOIN和RIGHT JOIN，经常会用到ON和WHERE的条件查询，以前用的时候有时是凭感觉的，总是没有搞清楚，今日亲自测试了下&…

编程日记2024/09/19 06:20:00

linux 笔记一

编程日记2024/09/19 06:10:00

【青少年编程】【三级】躲避恐龙

「青少年编程竞赛交流群」已成立（适合6至18周岁的青少年），公众号后台回复【Scratch】或【Python】，即可进入。如果加入了之前的社群不需要重复加入。我们将有关编程题目的教学视频已经发布到抖音号21252972100，小马老…

编程日记2024/09/19 06:00:00

小数加分数怎样计算讲解_2020人教版三年级下册数学知识点汇总带视频讲解，让孩子在学习！...

小学生延期开学，孩子功课不能落下啊！帝源教育网课推出1-6年级语文数学英语教材同步讲解视频，让孩子在假期也能提早预习课文知识！手机用户访问：m.46344.com 即可观看学习哦！随着疫情的蔓延，学校…

编程日记2024/09/19 05:50:00

JUnit基础及第一个单元测试实例（JUnit3.8）

JUnit基础及第一个单元测试实例（JUnit3.8） 单元测试单元测试（unit testing） ，是指对软件中的最小可测试单元进行检查和验证。单元测试不是为了证明您是对的，而是为了证明您没有错误。单元测试主要是用来…

编程日记2024/09/19 05:40:00

Scratch青少年编程能力等级测试模拟题（三级）

青少年编程竞赛交流群已成立（适合6至18周岁的青少年），公众号后台回复【Scratch】或【Python】，即可进入。如果加入了之前的社群不需要重复加入。微信后台回复“资料下载”可获取以往学习的材料（视频、代码、文档&…

编程日记2024/09/19 05:30:00

Qt 程序在 Windows 下的发布

「博客搬家」原地址: CSDN 原发表时间: 2016-06-04本文讨论在 Windows 平台下编译成功的 Qt 程序，如何在未配置 Qt 开发环境的 Windows 平台下独立运行的方法。经过验证发现，在 Ubuntu 平台下编译成功的程序可在未安装 Qt 开发环境下的 Ubuntu16.04 中…

编程日记2024/09/19 05:20:00

楷书书法规则_硬笔书法入门学习“三步法”，让练字不再难

生活中，常常有人肯于吃苦,坚持经常练习硬笔书法，但却进步不大，收获甚微。因此，凡有志学好硬笔书法的人，必须掌握一些学习硬笔书法的方法。硬笔书法学习的方法可以采用“三步法”。一、规范入门硬笔一般比较短小灵硬&am…

编程日记2024/09/19 05:10:00

系统异常设计规范与原则

为什么80%的码农都做不了架构师？>>> 1.系统异常设计的出发点： 良好的异常信息展示，开发运维人员能快速定位问题。响应外部调用异常时，应能明确指明是内部异常还是调用条件不满足导至。响应用户操作异常时，…

编程日记2024/09/19 05:00:00

陈长沙：学习者参考手册

学习者参考手册组队学习的核心是“和一群有意思的人在一起学感兴趣的知识的过程，这个过程充满了人与人之间的交流互动，是融入社交属性和学习属性的过程”。作为参与组队学习活动的学习者，一定想了解有关该项活动的各种环节。于是&#xff0…

编程日记2024/09/19 04:50:00

TC配置文件WCMD.INI详解，只能在ini重修改的配置

有*的项目扩展了功能，有★的项目是只能在INI中修改的配置。 ★Allowed 允许访问哪些驱动器（\代表网络邻居）。例如写为Allowedcde\，代表仅允许访问C、D、E和网络邻居，其余驱动器无法访问，也不会出现在驱动…

编程日记2024/09/19 04:40:00

mapgis矢量化怎么打分数_mapgis矢量化的详细工作流程

感觉不错就麻烦评下分哦1、准备光栅文件，启动MAPGIS输入编辑子系统，新建工程、新建控制点、界址点、线层等项目文件，建立界址点文件和线层文件的属性结构；2、采集控制点，记录图幅左下角经纬度，保存项目、工…

编程日记2024/09/19 04:30:00

AutoFac使用方法总结:Part I

utoFac是.net平台下的IOC容器产品，它可以管理类之间的复杂的依赖关系。在使用方面主要是register和resolve两类操作。这篇文章用单元测试的形式列举了AutoFac的常用使用方法： 注册部分使用RegisterType进行注册 [Fact]public void can_resolve_myclass…

编程日记2024/09/19 04:20:00

canvas烟花锦集

canvas可以实现不同动画效果，本文主要记录几种不同节日烟花效果实现。原文链接实现一效果地址 html <canvas id"canvas"></canvas>css body {background: #000;margin: 0; }canvas {cursor: crosshair;display: block; }js // when animat…

编程日记2024/09/19 04:10:00

【青少年编程（第29周）】8月份的青少年编程组队学习结营了！

2021年09月05日（周日）晚20:00我们在青少年编程竞赛交流群开展了第二十九次直播活动。我们直播活动的主要内容如下： 首先，我们奖励了上周测试超过60分的小朋友。其次，我们一起观看了电子学会等级测试流程的视频。再…

编程日记2024/09/19 04:00:00

led伏安特性实验误差分析_检测实验室误差分析知识汇编

2019-12-20 09:56:10 来源: 检测实验室误差分析知识汇编-检测家第一部分误差理论简介在日常检测工作中，我们虽然有最好的检验方法、有检定合格的仪器设备、有满足检验要求的环境条件和熟悉检验工作的操作人员，但是，得到的检验结果却往往不可…

编程日记2024/09/19 03:50:00

从Qcheck 1.3 不能在不同操作系统上运行问题（chro124、chro342）说开来------

【本文重在技巧学习，授人以鱼，不如授人以渔！！！】因为公司项目需要对带宽占用进行测试， 最近看电子工业出版社《网络管理工具使用详解》就qcheck 1.3 不能在不同的操作系统之间运行做一个总结。本文以标题…

编程日记2024/09/19 03:40:00

Spark笔试

1.Spark 的四大组件下面哪个不是 (D ) A.Spark Streaming B Mlib C Graphx D Spark R 2.下面哪个端口不是 spark 自带服务的端口 (C ) A.8080 B.4040 C.8090 D.18080 3.spark 1.4 版本的最大变化 (B ) A spark sql Release 版本 B 引入 Spark R C DataFrame D支持动态资源…

编程日记2024/09/19 03:30:00

秦州：西瓜书 + 南瓜书吃瓜系列 10. 集成学习（下）

Datawhale南瓜书是经典机器学习教材《机器学习》（西瓜书）的公式推导解析指南，旨在让在学习西瓜书的过程中，再也没有难推的公式，学好机器学习。航路开辟者：谢文睿、秦州开源内容：https://githu…

编程日记2024/09/19 03:20:00

iar定义arm版本_IAR Systems发布 IAR Embedded Workbench for ARM新版本

IAR Systems发布IAR Embedded Workbench for ARM嵌入式开发平台最新版本V5.41。相比于之前的版本，新版本软件在支持Cortex-M0上，将代码大小和执行速度这两个重要性能都提高了13%。本文引用地址：http://www.eepw.com.cn/article/106054.htmNXP…

编程日记2024/09/19 03:10:00

UVA10110 Light, more light

链接地址。分析： 如果n能被a整除，那么一定存在一个b使得a*b n。开关经两次变化相当于没有变化。那么只要看a b的那种特殊情况就OK了。 #include <stdio.h> #include <math.h> #include <stdlib.h>int main(){unsigned n, k;while(s…

编程日记2024/09/19 03:00:00

js的回顾

jQuery的基本使用

JQuery详细介绍

js创建对象

jquery选择器

jQuery是什么

jQuery其他选择器

mouseover/mouseout事件跟mouseenter/mouseleave事件的区别

dom对象与jQuery对象之间的相互转换

鼠标事件的几种方法

相关文章：