- 博客(11)
- 收藏
- 关注
RSS订阅原创 简单认识 防抖与节流
防抖防抖策略： 是当事件被触发后，延迟 n 秒后再执行 回调，如果在这 n 秒内 事件又被触发，则会 重新计时防抖的常用场景： 用户在输入框中连续输入一串字符时，可以通过 防抖策略，只在输入完后，才执行查询的请求，这样可以有效减少请求此时，节约请求资源// 定义 计时器 变量var timer = null// 定义 防抖 的函数function debounce(key) { timer = setTimeout(function() { /* 执行代码片段 */ },500)
2022-05-12 10:27:49
169
原创 仿 淘宝搜索栏，实现 用户输入搜索关键字时可以显示 搜索提示 的效果 Ajax
要实现的 UI 功能依赖文件：jQuery https://jquery.com/art-template 模板引擎 https://aui.github.io/art-template/实现步骤：获取用户输入的 搜索关键字封装函数，用于发送 Ajax 请求利用 模板引擎 渲染 UI 结构获取用户输入的 搜索关键字// 监听文本框的 keyup 事件 $('#ipt').on('keyup', function() { // 获取用户输入的内容 var key =
2022-05-12 09:45:04
995
原创 原生 Ajax - FormData 对象 实现文件上传即时预览
利用 XMLHttpRequest Level2 的新特性，不仅可以发送文本信息，还可以上传文件实现步骤：定义 UI 结构向 FormData 对象 中追加文件使用 xhr 发起 上传文件 的请求定义 UI 结构<!-- 引入 bootstrap3 样式文件 --><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
2022-05-10 21:14:25
273
原创 JavaScript 原生 封装 Ajax 函数
要实现的效果<!-- 导入自定义的 ajax() 文件 --><script src="./ajax.js"></script><script> // 调用自定义的 ajax()，发起数据请求 ajax({ method: '请求类型', url: '请求地址', data: { /* 请求参数对象 */ }, success(res) { // 数据请求成功后的回调函
2022-05-10 15:08:45
148
原创 实现简易的模板引擎
实现步骤：定义 模板结构预调用 模板引擎封装 template 函数导入并使用自定义的模板引擎<!-- 定义模板结构 --><script id="tpl-user" type="text/html"> <div>姓名： {{name}}</div> <div>年龄： {{age}}</div> <div>性别： {{gender}}</div> <div&g
2022-05-10 11:09:53
175
原创 Ajax - art-template 实现 新闻列表
Ajax 发送请求，通过 常用 模板引擎 art-template 实现 新闻列表 页面html 布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=dev
2022-05-09 20:22:41
106
原创 认识 模板引擎 art-template
常用模板引擎 art-template作用： 使用 模板引擎 提供的模板语法，可以将 数据 和 HTML 拼接起来安装npm install art-template --saveart-template 模板引擎的官网地址： https://aui.github.io/art-template/zh-cn/index.html标准语法art-template 提供了 {{}} 这种语法格式，在 {{}} 内可以进行 变量输出 或 循环数组 等操作，这种语法在 art-template 中被称
2022-05-09 18:36:24
509
原创 Ajax 评论列表
html 布局<!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"> <tit
2022-05-09 14:39:44
181
原创 Ajax 聊天机器人
链接文件导入：normalize.css + main.css(自定义样式)jquery.js + jquery-ui.js + jquery.mousewheel.js（鼠标滚轮滑动）scroll.js (侧边滚动条)(为了实现发送消息 滚动条滑到最下即初始化滚动条，需要调用 resetui（）html 布局<div class="wrap"> <!-- 头部 Header 区域 --> <div class="header">
2022-05-09 12:10:14
200
原创 jQuery
文章目录1. jQuery 概述1.1 JavaScript 库1.2 jQuery 优点2. jQuery 的基本使用2.1 jQuery 的 入口函数2.2 jQuery 的 顶级对象 $2.3 jQuery 对象 和 DOM 对象2.4 jQuery 对象 和 DOM 对象 的 相互转换2.4.1 DOM 对象 转换为 jQuery 对象： $(DOM对象)2.4.2 jQuery 对象 转换为 DOM 对象 (两种方式)3. jQuery 常用 API3.1 jQuery 选择器3.1.1
2022-03-03 09:24:50
1296
原创 Docker
文章目录1. Docker 安装方式1.1 script 脚本安装1.2 yum 源 安装1.3 rpm 安装包2. 实际安装 Docker2.1 使用 rpm 安装包进行 Docker 安装的系统配置2.2 根据官方文档正常安装 docker2.3 卸载 docker3. Docker 加速配置 (RPM 安装包 用)3.1 阿里云镜像加速器4. 底层原理5. docker 常用命令5.1 基础命令5.2 镜像命令(1) docker images 查看本地主机上的所有镜像(2) docker sear
2022-02-25 11:28:42
4081
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人