无良小老板-CSDN博客

原创 Node.js创建一个简单的WebSocket接口，Vue中连接接口，实现通信交互

WebSocket 是一种在 TCP 连接上进行全双工通信的 API 技术。相比于传统的 HTTP 类型 API，WebSocket 类型接口有着更低的延迟和更高的效率，它适用于需要长时间保持连接并实时传输数据的场景，例如在线游戏、实时聊天等服务。

2023-12-14 12:02:31 1042

原创 Vue 中简易封装网络请求（Axios），包含请求拦截器和响应拦截器

Axios 是一个基于 promise 的网络请求库，可以用于浏览器和 node.jsAxios官方中文文档。

2023-11-21 16:26:37 908

原创 Vue中使用Web Serial API连接串口，实现通信交互

Web Serial API 是一项 Web 技术，用于在浏览器中访问串行端口设备（如 Arduino、传感器等）并与之通信。它提供了一组 JavaScript 接口，使得 Web 应用程序可以通过 USB 串行端口连接到硬件设备，并进行数据发送和接收操作。

2023-10-24 10:29:01 7133 16

原创 CSS设置超出范围滚动条和滚动条样式

当块级内容区域超出块级元素范围的时候，就会以滚动条的形式展示，你可以滚动里面的内容，里面的内容不会超出块级区域范围。

2023-10-23 10:29:37 2041

原创基于Vue3在线商城（Vue3+VueCLI+VueRouter+vuex+axios+Bootstrap）

基于Vue3在线商城（Vue3+VueCLI+VueRouter+vuex+axios+Bootstrap）点击系统页面“我的购物车”、“我的订单”、“加入购物车”功能按钮。5、点击结算按钮后，会移除购物车内所选的商品，留下未勾选的商品。上学期期末的实训项目，现在都快开学了，现在才将其分享出来，2、对某类商品进行数量增减进行操作，小计价格随之变化。的Mock Servers进行部署API。虽然和之前的那个javaweb商城好些了，1、对商品收货人的姓名、地址进行修改。4、计算勾选商品的数量，总价。.....

2022-08-31 09:33:01 10450 20

原创使用响应式布局设计页面——滑动菜单

使用响应式布局设计页面——滑动菜单效果展示1)宽度大于800px时，图片周围有一圈阴影。鼠标移入时阴影由大变小最后为图上所示的样子，且每个菜单项的高度发生变化;2)宽度为520px到799px之间，鼠标移入每个菜单的时候透明度增加；3)宽度为520px到799px之间，鼠标移入每个菜单的时候透明度增加；<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8">

2022-05-15 15:04:16 1603 4

原创 CSS控制文本内容一行或多行超出部分显示省略号

CSS控制文本内容一行或多行超出部分显示省略号效果展示在写前端页面时，通常会遇到文字超出后显示省略号单行文本超出显示省略号多行文本超出显示省略号

2022-05-04 22:18:43 2237

原创使用CSS3动画制作导航菜单

使用CSS3动画制作导航菜单1、使用定位属性把图片“赚”和“花”设置到相对应的位置上2、使用animation属性给中间的“赚”和“花”图片设置动画，动画效果为鼠标移入“赚”图片的时候变为“赚积分”，并且是从左到右缓慢展开的效果3、使用transition属性给右边的“论”图片设置动画，效果为鼠标移入旋转360°效果展示代码展示<!DOCTYPE html><html> <head> <meta charset="utf-8">

2022-05-04 16:15:12 1908

原创 Vue使用双向绑定实现用户注册页面

使用双向绑定实现用户注册页面效果图展示代码展示<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="https://unpkg.com/vue@next"></script> <style type="text/css"> #app{ height:

2022-04-28 10:45:34 583

原创 HTML5 使用canvas实现画板功能(画笔颜色切换、粗细调整、清除图像)

标签定义图形，比如图表和其他图像，您必须使用脚本来绘制图形。在画布上（Canvas）画一个红色矩形，渐变矩形，彩色矩形，和一些彩色的文字。HTML5 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成. 标签只是图形容器，您必须使用脚本来绘制图形。实现画笔颜色切换画笔粗细调整清除图像绘制矩形绘制圆形创建一个画布（Canvas）<canvas id="canvas" width="900" height=500" style="border: 2px #5.

2022-03-30 08:30:34 6628

原创使用计算属性实现购物车功能效果（商品数量增减、单选多选计算金额和总价，）

使用计算属性实现购物车效果（商品数量增减、单选多选计算金额和总价，）涉及知识：Vue 基本指令Vue 计算属性使用 Vue 的基础语法知识，包括插值表达式与数据绑定、常用指令、计算属性等实现购物车的数据展示效果。效果图展示代码实现使用v-for循环，实现展示购物车效果<!DOCTYPE html><html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name

2022-03-23 22:26:13 2629 1

原创使用Vue指令实现数据展示，小米商城商品展示

使用Vue指令实现数据展示，小米商城商品展示涉及知识：(1)插值绑定(2)实例创建(3)常用指令效果展示代码代码gitee下载：https://gitee.com/yuhaowen/vfor_phone.gitHTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>实验 2 使用 Vue 指令实现数据展示 </title> &l

2022-03-22 21:32:31 2917

原创 WebStorm2021.3将项目绑定Git上传到（gitee）码云以及pages服务部署

WebStorm2021.3将项目绑定Git上传到（gitee）码云以及pages服务部署想将本地的项目推送到远程仓库，需要提前安装Git系统Git下载、安装教程及环境配置（超详细步骤讲解，手把手指导）一、在WebStorm安装插件Git和Gitee(码云)在插件商店中搜索，并且安装插件Git和Gitee(码云)登录自己的gitee账号二、为当前项目创建本地仓库选择本地仓库地址为项目的所在地址即可项目中标注为红色的文件名为没有add过的，add后为绿色，白色表示已经c

2022-03-20 15:25:21 3636 1

原创使用Vue指令实现下拉菜单效果

使用Vue指令实现下拉菜单效果模仿重庆红岩历史革命博物馆官网的导航栏内容和效果，使用Vue实现。官网地址如下：https://www.hongyan.info/官网效果效果图片展示代码展示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"&

2022-03-19 08:50:34 7389 2

原创 Vue学习笔记（二）[模板语法之内置指令，自定义指令]

Vue学习笔记（二）[模板语法之内置指令、自定义指令]往期回顾Vue学习笔记（一）[模板语法、数据绑定、MVVM模型]内置指令v-show带有 v-show 的元素始终会被渲染并保留在 DOM 中。v-show 只是简单地切换元素的 display CSS property。注意，v-show 不支持 <template> 元素，也不支持 v-else。<div id="app"> <!-- <div v-show="isShow">你好

2022-03-18 17:08:31 461

原创 HTML5+JS实现简易的音乐播放器

HTML5+JS实现简易的音乐播放器播放器实现的功能播放/暂停音乐切换歌曲，上/下一首歌音量最大或静音音乐播放时间实时变化进度条拖拽歌曲图片切换播放器效果展示代码展示html<div class="musicBox" id="musicBox"> <audio src="music/赵季平-门楼.mp3" id="music"> 当前浏览器不支持audio </audio> <div class="leftContro

2022-03-17 15:10:03 2379

原创 HTML5媒体元素（audio与video）及其常用属性详解

HTML5媒体元素（audio与video）及其常用属性详解HTML 音频(Audio)元素HTML5 元素是一个 HTML5 元素，在 HTML 4 中是非法的，但在所有浏览器中都有效。The element works in all modern browsers.互联网上的音频直到现在，仍然不存在一项旨在网页上播放音频的标准。今天，大多数音频是通过插件（比如 Flash）来播放的。然而，并非所有浏览器都拥有同样的插件。HTML5 规定了在网页上嵌入音频元素的标准，即使用<aud

2022-03-16 15:29:44 6402

原创 HTML5用户注册表单，包含正则表达式验证

HTML5用户注册表单，包含正则表达式验证

2022-03-15 12:59:47 1572 1

原创 Git下载、安装教程及环境配置（超详细步骤讲解，手把手指导）

Git是一款免费、开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。Git是一个开源的分布式版本控制系统，用以有效、高速的处理从很小到非常大的项目版本管理。

2022-03-13 08:14:55 1779

原创正则表达式的概念+常用表达式汇总

正则表达式的概念正则表达式，又称规则表达式。（英语：Regular Expression，在代码中常简写为regex、regexp或RE），计算机科学的一个概念。正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。许多程序设计语言都支持利用正则表达式进行字符串操作。例如，在Perl中就内建了一个功能强大的正则表达式引擎。正则表达式这个概念最初是由Unix中的工具软件（例如sed和grep）普及开的。正则表达式通常缩写成“regex”，单数有regexp、regex，复数有regexps、reg

2022-03-11 23:32:21 2817

原创 Vue学习笔记（一）[模板语法、数据绑定、MVVM模型]

Vue学习总结（一）Vue介绍Vue.js（/vjuː/，或简称为Vue）渐进式JavaScript 框架是一个用于创建用户界面的开源Model–view–viewmodel前端JavaScript框架，也是一个创建单页应用的Web应用框架。Vue官网：https://v3.cn.vuejs.org/搭建Vue开发环境安装Vue.js 设计的初衷就包括可以被渐进式地采用。这意味着它可以根据需求以多种方式集成到一个项目中。将 Vue.js 添加到项目中主要有四种方式：1.在页面上以 CDN

2022-03-06 17:10:56 496

原创 IDEA 2021.3创建java web项目（最新版，很详细，手把手创建）

因为自身学习的时候第一次使用**IDEA**，初次创建javaweb项目的时候，发现现在很多的教程都已经是过去式的了，版本很老了，有些创建项目的方式已经不适用于现在，所以我收集整理一下，总结出一套完善详细的解决方式。我使用的版本是：IDEA 2021.3

2022-02-08 16:43:59 52344 14

原创 jQuery实现电梯导航功能案例

jQuery实现电梯导航功能案例在页面中，一般都会有一个侧边导航栏，点击选项页面会跳转到对应的区域；或者滑动鼠标页面到到一个分类的区域侧边导航栏的选项也会变。隐藏导航，移动一定区域后，显示导航通过点击导航跳转到相应区域一键返回页面顶部<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>电梯导航案例</title> <link r

2022-02-02 23:37:35 3868

原创前端HTML页面JS禁止页面右击、禁止打开F12、禁止复制和剪切、禁止打开开发者工具

前端HTML页面JS禁止页面右击、禁止打开F12、禁止复制和剪切、禁止打开开发者工具<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script src="js/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script> &l

2022-02-01 22:57:00 1696

原创 jQuery实现王者荣耀手风琴效果

jQuery实现王者荣耀手风琴效果<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>手风琴</title> <link rel="stylesheet" type="text/css" href="css/public.css"/> <link rel="stylesheet" type="text/css" href="

2022-01-27 21:54:56 1185

原创 jQuery实现模拟微博发布框

jQuery实现模拟微博发布框刚开始界面1、输入内容，点击发布按钮，添加到下面。2、输入内容，按下回车键，同样可以添加内容3、点击删除，删除该条信息。效果展示所有代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>模拟微博发布</title> <link rel="stylesheet" type="text/css" href=

2022-01-26 19:07:46 1518 1

原创用jQuery实现下拉菜单效果

用jQuery实现下拉菜单效果

2022-01-22 12:17:39 2519

原创 ECharts实现数据可视化超详细基础入门教程

ECharts实现数据可视化基础入门教程ECharts介绍ECharts官网：https://echarts.apache.org/zh/index.htmlECharts是一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。ECharts最初由百度团队开源，并于2018年初捐赠给Apache基金会，成为ASF孵化级项目。ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（

2022-01-16 21:01:43 3347

原创 AJAX使用淘宝API查询手机归属地和运营商信息

AJAX使用淘宝API查询手机归属地和运营商信息使用给的api地址查询自己的手机号码所在地地址： https://www.baifubao.com/callback?cmd=1059&phone=你的手机号最后需要输出：我的手机号：1xxxxxxxxxxxx，运营商：（移动|联通|电信），归属地：xx运营商不是自己写的，也是从接口拿到的代码运行效果展示API地址：https://www.baifubao.com/callback?cmd=1059&phone=你的手机号代码展

2022-01-14 12:16:50 1258 1

原创使用jquery ajax 实现用户的用户名注册验证，如果该用户已存在则提示该用户已存在

使用jquery ajax 实现用户的用户名注册验证，如果该用户已存在则提示该用户已存在jQuery AJAX 基本使用方法接口使用 http://180.76.117.80:8080/AjaxSever/JSONServlet，用ajax实现获取该接口内容的功能，并借此判断用户名是否唯一性，ajax验证在用户名输入框失去焦点以后触发，实现效果展示用户名被占用用户名为空注册成功控制台返回输出代码如下<!DOCTYPE html><html> &lt

2022-01-13 18:01:14 1898 3

原创通过jQuery Validate插件的基本使用，完成用户表单注册验证的设计与实现

通过jQuery Validate插件的基本使用，完成用户表单注册验证的设计与实现jQuery Validate 插件为表单提供了强大的验证功能，让客户端表单验证变得更简单，同时提供了大量的定制选项，满足应用程序各种需求。该插件捆绑了一套有用的验证方法，包括 URL 和电子邮件验证，同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息，且已翻译成其他 37 种语言。jQuery Validate 官网表单验证插件：jQuery Validate 中文API验证码插件

2022-01-12 19:04:30 1529

TA关注的人

yuhaowen的博客