笔记
文章平均质量分 62
龙眸
相信自己一定行。
展开
-
在项目中操作MySQL
1、在项目中操作数据库的步骤① 安装操作 MySQL 数据库的第三方模块(mysql)② 通过 mysql 模块连接到 MySQL 数据库③ 通过 mysql 模块执行 SQL 语句原创 2022-09-02 13:01:49 · 499 阅读 · 0 评论 -
黑马案例--实现 clock 时钟的web服务器
把文件的实际存放路径,作为每个资源的请求url地址。③将资源的请求url地址映射为文件的存放路径。②创建基本的web服务器。④读取文件内容并响应给客户端。步骤5优化资源的请求路径。⑤优化资源的请求路径。...原创 2022-07-31 20:02:24 · 456 阅读 · 0 评论 -
创建最基本的Web服务器(防止中文乱码)、根据不同的 url 响应不同的 html 内容
当调用res.end()方法,向客户端发送中文内容的时候,会出现乱码问题,此时,③为服务器绑定request事件,监听客户端的请求。在服务器的request事件处理函数中,如果。只要服务器接收到了客户端的请求,就会调用通过。如果想在事件处理函数中,访问与客户端相关的。为404Notfound。③判断用户请求的是否为。④判断用户请求的是否为。②创建web服务器实例。...原创 2022-07-31 17:44:05 · 201 阅读 · 0 评论 -
黑马案例--时钟案例拆分(利用node.js将内嵌标签改为外联标签)
②重复调用fs.writeFile()写入同一个文件,新写入的内容会覆盖之前的旧内容。①fs.writeFile()方法只能用来创建文件,不能用来创建路径。原创 2022-07-28 11:29:46 · 442 阅读 · 0 评论 -
HTTP协议(HTTP协议简介、HTTP请求消息、HTTP响应消息、HTTP请求方法)
通信协议是指通信的双方完成通信所必须遵守的规则和约束。通俗的理解通信双方采用约定好的格式来发送和接收信息,这种事先约定好的通信格式,就叫做通信协议。1.21.现实生活中的通信协议张三与李四采用写信的方式进行通信,在填写信封时,写信的双方需要遵守固定的规则。信封的填写规则就是一种通信协议。客户端与服务器之间要实现网页内容的传输,则通信的双方必须遵守网页内容的传输协议。网页内容又叫做超文本,因此网页内容的传输协议又叫做超文本传输协议,简称HTTP协议。客户端要以HTTP协议要求的格式把数据到。...原创 2022-07-19 14:24:47 · 479 阅读 · 0 评论 -
防抖和节流
防抖和节流的区别 ①防抖:如果事件被频率触发,防抖能保证只有最后一次触发生效;前面N多次的触发都会被忽略; ②节流:如果事件被频繁触发,节流能够减少事件触发的频率,因此,节流是有选择性地执行一部分事件;......原创 2022-07-18 20:36:19 · 875 阅读 · 0 评论 -
淘宝搜索案例
/获取用户输入的内容val()获取输入内容,trim()去除两端空格。//封装getSuggestlist函数,获取搜索建议列表。//指定请求的URL地址,其中q是用户输入的关键字。//如果关键词为空,则清空后隐藏搜索建议列表。//1.获取用户输入的内容,当做键k。//指定要发起的JSONP请求。//为输入框绑定keyup事件。//TODO获取搜索建议列表。//1.定义延时器的ID。//判断用户输入是否为空。//定义全局缓存对象。//定义防抖的函数。//成功的回调函数。...原创 2022-07-18 13:05:01 · 178 阅读 · 0 评论 -
同源策略和跨域
什么是同源策略、什么是跨域、如何实现跨域请求、JSONP的实现原理原创 2022-07-16 15:22:27 · 1460 阅读 · 0 评论 -
利用Axios实现网络数据请求
什么是axios?axios是专注于**网络数据请求**的库相比于原生的XMLHttpRequest对象,axios **简单 易用**相比于jQuery.ajax更加轻量化,只专注于网络数据的请求原创 2022-07-15 17:47:57 · 1354 阅读 · 0 评论 -
jquery实现文件上传及loading加载效果
1、定义UI结构2、验证是否选择了文件3、向formdata中追加文件4、使用jQuery的Ajax发起上传文件的请求1.ajaxStart(callback)Ajax请求开始时,执行ajaxstart函数,可以在ajaxstart的callback中显示loading效果,代码如下:2.ajaxStop(callback)Ajax请求结束时,执行ajaxstop函数,可以在ajaxstop的callback中隐藏loading效果,...原创 2022-07-10 17:26:01 · 1306 阅读 · 0 评论 -
XMLHttpRequest Level2新特性(设置HTTP请求(超时)时限、演示FormData对象的基本使用管理表单数据、使用formdata快速获取表单中的数据、利用XML上传文件)
XMLHttpRequest Level2新特性(设置HTTP请求(超时)时限、演示FormData对象的基本使用管理表单数据、使用formdata快速获取表单中的数据、利用XML上传文件)原创 2022-07-07 18:07:23 · 1139 阅读 · 1 评论 -
聊天机器人(Ajax实现聊天机器人接口的调用)
文章目录前言一、UI布局二、用户内容渲染到聊天窗口三、获取聊天机器人消息1.jquery中的ajax2.调用机器人接口四、将机器人的聊天内容转化为语音播放五、使用回车发送消息总结————————————————————————————————————————————————前言本文介绍如何用ajax调用聊天机器人接口,将信息显示到聊天框中,语音播放机器人消息。聊天框分为头部Header、中间聊天区域、底部Footer消息编辑三大部分。在聊天区域,每条信息都放到每个li中,机器人消息原创 2022-06-23 18:28:07 · 2236 阅读 · 2 评论 -
查询商品案例(利用数组新增方法操作数据)/重点
代码运行效果图案例说明注意:如果查询数组中唯一的元素, 用some方法更合适,因为它找到这个元素,就不在进行循环,效率更高在forEach 和 filter 里面的return true不会终止迭代在some里面遇到 return true 会终止迭代(遍历),迭代效率更高案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta原创 2022-05-18 20:55:14 · 79 阅读 · 0 评论 -
【面向对象tab栏切换】
案例说明案例分析实现添加功能实现删除功能案例实现代码style.css@font-face {font-family: "iconfont"; src: url('./iconfont/iconfont.eot?t=1553960438096'); /* IE9 */ src: url('./iconfont/iconfont.eot?t=1553960438096#iefix') format('embedded-opentype'), /* IE6-IE8 */ url原创 2022-05-14 22:05:06 · 134 阅读 · 4 评论 -
ToDoList—最简单的待办事项列表(经典案例)重点
案例说明案例分析案例实现代码在这里插入代码片代码运行结果插入结果图片原创 2022-05-13 20:56:23 · 3921 阅读 · 6 评论 -
jquery电梯导航(重点)
电梯导航案例分析案例实现代码$(function() { // 大于今日推荐 var toolTop = $(".recommend").offset().top; toggleTool(); //刷新时调用 // 避免刷新时电梯导航消失,我们封装一个函数 function toggleTool() { if ($(document).scrollTop() >= toolTop) { $(".fixedtool")原创 2022-05-10 18:01:29 · 391 阅读 · 2 评论 -
jQuery带有动画的返回顶部
案例分析案例实现代码核心区域$(function() { // 返回指定的位置 $(document).scrollTop(100); // 被卷去的头部scrollTop 被卷去的左侧 scrollLeft() // 获取到文档顶部的距离 var boxTop = $(".container").offset().top; $(window).scroll原创 2022-05-10 17:09:52 · 207 阅读 · 0 评论 -
购物车案例
案例分析实现全选代码$(function() { // 1. 全选 全不选功能模块 // 就是把全选按钮(checkall)的状态赋值给 三个小的按钮(j-checkbox)就可以了 // 事件可以使用change $(".checkall").change(function() { // console.log($(this).prop("checked")); $(".j-checkbox, .checkall").prop("che原创 2022-05-10 16:02:12 · 132 阅读 · 0 评论 -
手风琴效果(折叠卡片效果)
案例说明案例分析各方面分析案例实现代码<!doctype html><html><head> <meta charset="utf-8"> <title>手风琴案例</title> <style type="text/css"> * { margin: 0; padding: 0; }原创 2022-05-09 16:33:03 · 123 阅读 · 0 评论 -
淘宝服饰精品案例分析
案例分析案例实现代码<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; font-size: 12p原创 2022-05-08 16:53:25 · 170 阅读 · 0 评论 -
利用jQuery仿写下拉导航栏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do原创 2022-05-08 15:34:57 · 86 阅读 · 0 评论 -
【本地存储(记住用户名)】
案例分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l原创 2022-05-07 20:46:29 · 83 阅读 · 0 评论 -
解决移动端click延时问题( 移动端会有300ms的延时,原因是移动端屏幕双击会缩放。)
解决移动端点击click延时的三种解决方法原创 2022-05-07 10:52:18 · 757 阅读 · 0 评论 -
移动端轮播图
运行效果图先看效果案例说明案例分析案例实现代码移动端轮播图 js核心代码window.addEventListener('load', function() { // alert(1); // 获取元素 var focus = document.querySelector('.focus'); var ul = focus.children[0]; // 获得focus的宽度 var w = focus.offsetWidth;原创 2022-05-06 22:13:11 · 301 阅读 · 0 评论 -
移动端拖动元素
案例分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> &l原创 2022-05-06 16:33:19 · 175 阅读 · 0 评论 -
js网页特效动画(筋斗云案例)
案例说明案例分析案例实现代码demo.css* { margin: 0; padding: 0}ul { list-style: none;}body { background-color: black;}.c-nav { width: 900px; height: 42px; background: #fff url(images/rss.png) no-repeat right center; margin:原创 2022-05-06 11:31:19 · 2020 阅读 · 0 评论 -
js网页返回顶部动画特效
案例分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> &原创 2022-05-06 10:57:06 · 567 阅读 · 0 评论 -
网页轮播图
轮播图原创 2022-05-05 21:22:22 · 134 阅读 · 0 评论 -
引用animate.js动画函数(animate是自定义函数)
案例说明实现这样的一个效果注意利用好回调函数案例实现代码引用animate.jsfunction animate(obj, target, callback) { // console.log(callback); callback = function() {} 调用的时候 callback() // 先清除以前的定时器,只保留当前的一个定时器执行 clearInterval(obj.timer); obj.timer = setInterval(functio原创 2022-05-05 16:20:40 · 3571 阅读 · 0 评论 -
js缓动动画效果原理
注意步长值的取整原创 2022-05-05 15:34:04 · 142 阅读 · 0 评论 -
js实现动画原理(简单动画函数封装)(给不同对象添加不同的定时器)
动画原理 1. 获得盒子当前位置 2. 让盒子在当前位置加上1个移动距离 3. 利用定时器不断重复这个操作 4. 加一个结束定时器的条件 5. 注意此元素需要添加定位, 才能使用element.style.left原创 2022-05-04 17:17:56 · 96 阅读 · 0 评论 -
仿淘宝固定右侧侧边栏
案例说明案例分析各方面分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge原创 2022-05-04 16:46:28 · 174 阅读 · 0 评论 -
仿京东放大镜效果
案例分析案例实现代码<div class="preview_img"> <img src="upload/s3.png" alt=""> <div class="mask"></div> <div class="big"> <img src="upload/big.j原创 2022-05-04 12:00:41 · 73 阅读 · 0 评论 -
弹出框(模态框)拖拽效果
案例说明弹出框(模态框)拖拽效果案例分析案例实现代码<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .login-header { width: 100%; text-align: center;原创 2022-05-04 10:30:15 · 149 阅读 · 0 评论 -
获取鼠标在盒子内的坐标
1.我们在盒子内点击, 想要得到鼠标距离盒子左右的距离。2. 首先得到鼠标在页面中的坐标**( e.pageX, e.pageY)**3. 其次得到盒子在页面中的距离**(box.offsetLeft, box.offsetTop)**4. 用鼠标距离页面的坐标**减去**盒子在页面中的距离, 得到 鼠标在盒子内的坐标5. 如果想要移动一下鼠标,就要获取更新的坐标,使得鼠标移动的事件mousemove原创 2022-05-04 09:26:27 · 145 阅读 · 0 评论 -
获取URL参数数据,实现在不同页面数据相互传递
案例说明获取URL参数数据,实现在不同页面数据相互传递(利用URL里面的location.search参数)案例分析案例实现代码logain.html中的代码<form action="index.html"> 用户名: <input type="text" name="uname"> <input type="submit" value="提交"> </form>index中的代码<div>原创 2022-05-03 18:39:58 · 303 阅读 · 0 评论 -
5s后自动跳转页面
案例说明5s后自动跳转页面(注意第一次刷新时页面产生的空白)案例分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-widt原创 2022-05-03 17:16:01 · 3203 阅读 · 0 评论 -
js实现发送短信,点击按钮后60秒内不能再次点击,实现定时器效果
1.按钮点击之后,会禁用 disabled 为true 2.同时按钮里面的内容会变化, 注意 button 里面的内容通过 innerHTML修改 3. 里面秒数是有变化的,因此需要用到定时器 4.定义一个变量,在定时器里面,不断递减 5.如果变量为0 说明到了时间,我们需要停止定时器,并且复原按钮初始状态原创 2022-05-03 10:51:11 · 1666 阅读 · 0 评论 -
倒计时案例
案例说明倒计时案例分析案例实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"&g原创 2022-05-02 16:14:32 · 51 阅读 · 0 评论 -
模拟京东快递单号查询
1.快递单号输入内容时, 上面的大号字体盒子(con)显示(这里面的字号更大)2.表单检测用户输入: 给表单添加键盘事件3. 同时把快递单号里面的值(value)获取过来赋值给 con盒子(innerText)做为内容4.如果快递单号里面内容为空,则隐藏大号字体盒子(con)盒子原创 2022-05-02 09:09:47 · 332 阅读 · 1 评论