网站前端
SVG、JavaScript、CSS、HTML、各种框架。Web前端开发是从美工演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，Web 1.0时代，网站的主要内容都是静态的，用户使用网站的行为也以浏览为主。
各种各样的框架让人目不暇接，新技术层出不穷。让我们这些前端狗情何以堪。
目前web前端工程师的年薪待遇平均在10万以上，高级HTML前端工程师年薪达30—50万，很多企业对于与web前端相关的技术职位更是求贤若渴。
ts-loader.js doesn't exist
2023年08月13日
今天在使用 webpack 的时候，出现了如下错误：ts-loader.js doesn't exist出现问题的原因：没有安装 webpack 的 TypeScript 加载器。解决方案：安装 webpack 的 TypeScript 加载器，执行如下命令：npm i ts-loader问题解决。参考资料：1、npm - ts-loader其它相关推荐：1、tsconfig.json files...
tsconfig.json files 参数解释
2023年08月11日
最近看到项目的 tsconfig.json 文件，内容如下：{ "compilerOptions": { "allowSyntheticDefaultImports": true, "noImplicitAny": true, "module": "es6", "target": "es5", "allowJs": true }, "files": [ "src/_base.ts", ]}找了一下...
禁止别人调试自己的前端页面代码
2023年08月02日
为啥要禁止？由于前端页面会调用很多接口，有些接口会被别人爬虫分析，破解后获取数据为了 杜绝 这种情况，最简单的方法就是禁止人家调试自己的前端代码无限 debugger前端页面防止调试的方法主要是通过不断 debugger 来疯狂输出断点，因为 debugger 在控制台被打开的时候就会执行由于程序被 debugger 阻止，所以无法进行断点调试，所以网页的请求也是看不到的基础代码如下：/** *...
css media 查询屏幕大小划分
2023年07月26日
在使用 css 媒体查询的时候，屏幕大小划分是一个很头疼的问题，参考了其它项目对于屏幕大小的划分，方案如下：@media (min-width: 576px) {}@media (min-width: 768px) {}@media (min-width: 992px) {}@media (min-width: 1200px) {}@media (min-width: 1400px) {}@med...
JavaScript 冒泡理解
2023年07月26日
最近在项目上遇到一个问题：我监控页面上的一个按钮 click 事件，但是同时我也监控 document 的点击事件，点击按钮打开遮罩，同时点击页面空白部分（出发了 document 的单击事件），关闭遮罩。如果是这样的话，我们就会遇到一个问题：我们永远也打不开遮罩，因为我们点击按钮的时候，同时也触发了 document 的点击事件，也就是在打开遮罩的同时，几乎我们人眼无法察觉的速度，关闭遮罩。这...
浏览器开发者工具，查看元素 hover 样式
2023年07月26日
在web开发中，浏览器开发者工具是我们常用的调试工具。我们经常会有这样的需求，就是查看元素的时候需要查看它的hover样式。相信有很多小伙伴都遇到过这样的情形，始终选不中hover后的元素状态。其实在开发者工具中是有地方可以设置的。方法如下：1. 打开开发者工具，选中一个元素2. 在 Filter 栏中点击 :hov 按钮3. 点击 :hov 按钮后会显示一系列状态的复选框，我们要查看 hover...
JavaScript 三元运算符
2023年07月17日
JavaScript 三元运算符是一种简洁的语法，可用于替代 if/else 语句。 它由三个操作数组成：条件、真值和假值。 条件将被评估为 true 或 false。 如果条件为 true，则真值将被返回；如果条件为 false，则假值将被返回。三元运算符的语法如下：condition ? trueValue : falseValue例如，以下代码使用三元运算符来检查用户的年龄是否大于 18 岁...
JavaScript 实现倒计时效果
2023年07月10日
下面的代码使用 JavaScript 实现了一个倒计时的效果：<!DOCTYPE html><html><head> <title>10分钟倒计时</title></head><body> <h1 id="countdown">10:00</h1> <script> // 获取倒计时显示元素 const countdownElement = document.getElement...