weixin_53657413的博客

原创 js禁用f12和右击无效

如果你想要禁用用户在网页上使用F12键打开开发者工具或右击页面的功能，可以使用JavaScript来实现。但是，需要注意的是，这种方法并不能完全阻止高级用户或技术人员使用其他方法进行调试或检查页面。请注意，这些方法仅仅是通过JavaScript代码来阻止默认行为，并不能真正地禁用F12键和右击事件。因此，这只是一种表面层次的防护措施，而不是一种可靠的安全方法。值得注意的是，尝试禁用浏览器的内置功能可能会被视为对用户体验的侵犯，所以建议谨慎使用这些方法。

原创 gulp使用

随着前端诸如webpack，rollup，vite的发展，gulp感觉似乎好像被取代了。其实并没有，只不过它从台前退居到了幕后。我们仍然可以在很多项目中看到它的身影，比如elementplus、vant等。现在gulp更多的是做流程化的控制。比如我们要把一个大象放进冰箱里就需要 打开冰箱门->把大象放进冰箱->关上冰箱门，这就是一个简单的流程，使用gulp就可以规定这些流程，将这个流程自动化。所以我们可以使用它在项目开发过程中自动执行常见任务。

原创 如何查看wifi密码(windows)

【代码】如何查看wifi密码(windows)

原创 linux 安装 redis

原创 js 获取与设置cookie

js

原创 浏览器 中 element ui 表单组件 自动填充 用户名密码 或者 手机号密码问题

element ui

原创 axios 基本使用与学习

axios

原创 vue报错解决：Error in v-on handler (Promise/async): “[object object]“

axios, vue

原创 vue 之 props 属性

vue.props

原创 Node.js

1. 初识 Node.js1.1 什么是Node.jsNode.js@ is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js是一个基于Chrome V8弓|擎的JavaScript运行环境。 Node.js的官网地址: https://nodejs.org/zh-cn/1.2 Node.js 中的 JavaScript 运行环境注意：浏览器是JavaScript 的前端运行环境 Node

原创 Yarn 安装与使用教程

一、 官网指引英文官网：Yarn英文官网中文文档：Yarn中文文档二、 Yarn 介绍Yarn 是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具。 你可以通过它使用全世界开发者的代码，或者分享自己的代码。代码通过包（package）（或者称为模块（module））的方式来共享。 一个包里包含所有需要共享的代码，以及描述包信息的文件，称为package.json。它的优点是更快、更安全、更可靠。它的主要特性有离线模式

原创 mac npm全局安装包后 使用包命令显示 -bash: xxx: command not found 解决方法

PS：.npmrc是npm的配置文件，可以通过npm config list 命令查看执行以下命令配置环境变量~$ echo -e "export PATH=$(npm prefix -g)/bin:$PATH" >> ~/.npmrc && source ~/.npmrc以上命令执行成功后可以继续执行查看安装包的命令，问题得到解决...

原创 mac 阿里云管理控制台增加SSH公钥

如何查看相应的公钥？ 使用命令：cat ~/.ssh/id_rsa.pub如果出现以 ssh-rsa 开头的一长串字母，就把它全部复制，然后粘贴到刚才的公钥输入框中，然后点击“增加密钥”。如果命令行提示 No such file or directory，则表示自己的机器上还没有生成 SSH 公钥，此时在终端中输入：ssh-keygen然后一路 Enter，即可生成一个 SSH 公钥，它的存放位置是：~/.ssh/id_rsa.pub ，然后再回到上面的步骤继续即可。.

原创 GraphQL

学习Graphql

原创 初始化样式minireset.css

html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0;}h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal;}ul { list-style: none;..

原创 create-react-app 脚手架 中按需引入Antd 样式

参考Antd 3.26.191、导入Antdyarn add antd注：yarn 可以通过npm install -g yarn 安装， 可以通过yarn --version 查看yarn 版本2、导入react-app-rewired customize-crayarn add react-app-rewired customize-cra3、配置修改package.json "scripts": { "start": "react-app-r...

原创 A template was not provided. This is likely because you‘re using an outdated version of create-react

在使用create-react-app创建项目时,控制台爆出这个A template was not provided. This is likely because you're using an outdated version of create-react-app.Please note that global installs of create-react-app are no longer supported.解决方案：1、卸载老版本npm uninstall -g

原创 Visual Studio Code 用户代码片段javascript.json文件模板

{ "DOM API querySelector": { "prefix": "dqs", "body": [ "document.querySelector('$0')" ], "description": "HTML5 DOM querySelector" }, "DOM API getElementById": { "prefix": "dgi", "body": [ "document.getElementById('$0')" ], "descr.

原创 React开发者工具 React Developer Tools 的下载

1、创建或选择一个用来放插件的目录，使用git命令如下git clone -b v3 https://github.com/facebook/react-devtools注：如果克隆失败，可将上面命令中的 https 换为 git2、进入克隆到本地的文件并打开终端，输入命令cnpm install3、成功后再次输入npm run build:extension:chrome4、进入到谷歌扩展程序中，加载下载好的插件步骤：更多工作-> 扩展程序->

原创 mac 降node版本

安装node版本管理模块sudo npm install n -g注：以下根据个人情况使用安装稳定版本sudo n stable安装最新版本sudo n latest版本降级/升级sudo n 版本号例如sudo n 12.18.1

原创 flex布局常用属性

flex布局父项常见属性flex-direction: 设置主轴的方向 justify-content: 设置主轴上的子元素排列方式 flex-wrap: 设置子元素是否换行 align-content: 设置侧轴的子元素的排列方式（多行） align-items:设置侧轴上的子元素排列方式（单行） flex-flow:复合属性，相当于同时设置了flex-direction 和 flex-wrapflex-direction：设置主轴的方向1）主轴与侧轴在flex布局中,是分为主

原创 AJAX

AJAX概述传统的web交互是用户触发一个http请求服务器，然后服务器收到之后，在做出响应到用户，并且返回一个新的页面，每当服务器处理客户端提交的请求时，客户都只能空闲等待，并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据，都要返回一个完整的HTML页，而用户每次都要浪费时间和带宽去重新读取整个页面。这个做法浪费了许多带宽，由于每次应用的交互都需要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间，这导致了用户界面的响应比本地应用慢得多。AJAX 的出现,刚好解决了传统方法的缺

原创 javascript实现对游览器的判断

var ua = navigator.userAgent;if (/firefox/i.test(ua)) { alert("你是火狐浏览器");} else if (/chrome/i.test(ua)) { alert("你是谷歌浏览器");} else if (/msie/i.test(ua)) { alert("你是IE5-IE10浏览器");} else if ("ActiveXObject" in window) { alert("你是IE11浏览器").

原创 事件绑定

我们以前绑定事件代码只能一个事件绑定一个函数，那我们要是想一个事件对应多个函数，并且不存在兼容性的问题该如何解决呢？接下来，我会直接提供两个已经编写好的事件绑定和事件解绑的兼容性代码，如下：/*为元素绑定事件兼容性代码*/function addEventListener(element, type, fn) { if(element.addEventListener) { element.addEventListener(type, fn, false); } else if(elem

原创 阻止a标签的默认跳转事件

// 阻止浏览器的默认行为 function stopDefault(event) { if (event && event.preventDefault) { // 阻止默认浏览器动作(W3C) event.preventDefault(); } else { // IE中阻止函数器默认动作的方式 window.event.returnValue = f.

原创 兼容性取消冒泡方法

function stopBubble(event) { // 如果提供了事件对象，则这是一个非IE浏览器 if (event && event.stopPropagation) { // 因此它支持W3C的stopPropagation()方法 event.stopPropagation(); } else { // 否则，我们需要使用IE的方式来取消事件冒泡 ..

原创 Keycode对照表

字母和数字键的键码值(keyCode) 按键 键码 按键 键码 按键 键码 按键 键码 A 65 J 74 S 83 1 49 B 66 K 75 T 84 2 50 C 67 L 76 U 85 3 51 D 68 M 77 V 86 4 52 E 69 N

原创 兼容性查找父子HTML元素自定义方法

兼容性方法：/*获取任意一个父级元素的第一个子元素*/function getfirstElementChild(element) { if(element.firstElementChild) { return element.firstElementChild; } else { var node = element.firstChild; while(node && node.nodeType != 1) { node = node.nextSibling

原创 动态判断、添加、删除、切换样式，支持IE5-IE11，谷歌浏览器、火狐浏览器

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title> <style> .b1 { width: 100px; height: 100px; background-color: red; } .b2.

原创 编写一段兼容性代码，用来获取与设置任意标签的文本内容

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title></head><body><a href="https://www.baidu.com" id="a">打开百度，你就知道！</a><!-- 在这里写JavaScript代码，因为JavaScript是由上到下执行的 --.

原创 HTML读取元素节点样式表里的样式

IE 游览器是通过 元素.currentStyle.样式名 来获取元素的当前显示的样式，其它的浏览器都不支持 在其它浏览器中可以使用getComputedStyle()这个方法来获取元素当前的样式，这个方法是window的方法，可以直接使用，但是需要两个参数： 第一个参数：要获取样式的元素 第二个参数：可以传递一个伪元素，一般都传null该方法会返回一个对象，对象中封装了当前元素对应的样式，可以通过 对象.样式名 来读取样式，如果获取的样式没有设置，则会获取到真实的值，而不是默认值，比如：没

原创 内存分区

任何编程语言的内存分区几乎都是一样的 内存是存储数据的，不同类型的数据要存储在不同的区域，即分类存放，不同的区域作用和功能也不一样 以下为内存的分区图。内存分为四个区域：栈区（堆栈），堆区，全局静态区，只读区（常量区和代码区）。​​​1、栈区 1）存放的数据：局部变量，形参，被调用函数的地址（这个可以不用管）等等。 2）特点： 读取速度快，存储和释放的思路是按照数据结构中的栈进行的...

原创 Webstorm自动保存功能设置

原创 前后端学习网站

1、VUE学习地址：https://cn.vuejs.org/2、Thinkphp学习地址：http://www.thinkphp.cn/3、JavaScript MDN学习地址：https://developer.mozilla.org/zh-CN/4、jQuery学习地址：https://jquery.com/5、jQuery之家学习地址：http://www.htmleaf.com/6、Bootstrap学习地址：https://v3.bootcss.com/7、基于jQuery的全屏滚动

原创 自定义Controller返回的结果类

首先先导入类所需有的包 <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <optional>true</optional> </dependency> <!-- htt

原创 uni-app

uni-app是什么？uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。 DCloud公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70+微信/qq群。阿里小程序工具官方内置uni-app（详见），腾讯课堂官方为uni-app录制培训课程（详见），开发者可以放心选择。 uni-app在手

原创 Redis 狂神说java总结

...

原创 SpringBoot整合redisTemplate

​// 自定义RedisTemplate// 这是RedisTemplate的一个模板@Bean@SuppressWarnings("all")public RedisTemplate<String, Object> redisTemplate(RedisConnectionFactory redisConnectionFactory) throws UnknownHostException { // 为了开发方便，可以直接使用<String, Object>.

原创 @qualifier注解

@Qualifier限定哪个bean应该被自动注入。当Spring无法判断出哪个bean应该被注入时，@Qualifier注解有助于消除歧义bean的自动注入。参见下面的例子, public class Staff{ @Autowired private user user; }我们有两个bean定义为Person类的实例。<beanid="staff"class="com.test.Staff"/> <be

原创 浅谈Spring之@Nullable、@NonNull注解

@NonNull可以标注在方法、字段、参数之上，表示对应的值不可以为空 @Nullable注解可以标注在方法、字段、参数之上，表示对应的值可以为空以上两个注解在程序运行的过程中不会起任何作用，只会在IDE、编译器、FindBugs检查、生成文档的时候有做提示；我使用的IDE是STS，不会做自动的检查，只有安装了FindBugs插件并运行后会做对应的提示，...