- 博客(217)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 css 权重
权重：- *通配符的权重为0- 标签/伪元素的权重为1- class/属性/伪类的权重值为10- id 的权重值是100，- 内联样式的权重值是1000- !import的权重为正无穷
2022-11-20 20:35:45
446
1
原创 CSS 实现左侧溢出
使用 CSS 的 direction 属性：<!DOCTYPE html><html><head><meta charset="utf-8"><title>文档标题</title></head><body> <h1>我的第一个HTML页面我的第一个HTML页面</h1></body></html>h1{ width: 600px; b
2022-03-24 10:37:59
1210
原创 webpack 3.0 不使用 I18nPlugin 实现国际化以及css自动刷新的完整项目
项目结构优点：项目开发环境比较友好，可以实现自动刷新生产与开发相分离不使用 I18nPlugin 实现了国际化支持解决了 css 不自动刷新的问题开发时，可以指定 chrome 等自己想要的浏览器打开开发时，可以指定自动打开的页面mvc 三层架构实现了事件监听jquery 等外部工具的引用目前实现的是单页面应用，但可以实现多页面的使用了 hash拷贝 xml 文件项目结构不足：resource 并不是JSON形式结构，而是 js 形式主要适用于小型项目项目主要结构如下
2021-03-30 18:06:26
364
原创 webpack 3.0 使用 I18nPlugin 实现国际化以及css自动刷新的完整项目
**项目结构优点：项目开发环境比较友好，可以实现自动刷新，除开resource中的json文件之外生产与开发相分离I18nPlugin 实现了国际化支持解决了 css 不自动刷新的问题开发时，可以指定 chrome 等自己想要的浏览器打开开发时，可以指定自动打开的页面mvc 三层架构实现了事件监听jquery 等外部工具的引用目前实现的是单页面应用，但可以实现多页面的使用了 hash拷贝 xml 文件项目结构不足：resource 中的 json 文件不能自动刷新页面主要
2021-03-30 14:27:03
417
1
原创 css 实现table形式的网格
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>实现table形式的网格</title> <style> ul,li { list-style: none; margin: 0; padding: 0 }
2020-12-02 23:23:15
1196
原创 页面 logo书写
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Logo</title> <style> /* logo 最好不要使用img，而是使用background-img 因为img未加载完成或失败时，有失败的默认样式显示 css未加载成功或完成时，显示
2020-12-02 22:59:06
165
原创 CSS 实现 轮播图的导航点
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>轮播图的导航点</title></head><style> .banner { position: relative; } .dots { background-color: gray;
2020-12-02 21:49:18
956
原创 CSS3 Background
/*实现背景图片不滚动*/html { height: 100%; background-color: green; background-image: url(./img/bg.png); background-size: 100% 100%; //不缩放 background-attachment: ficed; //固定背景不滚动 //scroll: 滚动}c/*背景图片占满区域*/.header { display: block; width: 100%; he
2020-12-02 21:46:15
112
原创 npm info
查看依赖包的相关信息，比如所有版本。npm info gulpC:\Users\34973>npm info [email protected] | MIT | deps: 4 | versions: 66The streaming build system.https://gulpjs.combin: gulpdist.tarball: https://registry.npm.taobao.org/gulp/download/gulp-4.0.2.tgz.shasum: 5436
2020-11-21 16:47:51
1433
原创 Express Socket(基于H5的WebSocket和NodeJS的ws)
Server端的代码// nodejs的ws//https://github.com/websockets/ws#broadcast-exampleconst WebSocket = require("ws");let wss = new WebSocket.Server({port: 8888}, function(){ console.log("socket server start.");});wss.on("connection", ws => { ws.on("m
2020-11-14 13:09:21
382
原创 Express socket(基于socket.io.js)
Express Socket基于 socket.io.jsServer端代码：//https://github.com/socketio/socket.io//与express结合//注意跨域问题const express = require("express"), app = express(), server = require("http").createServer(app), io = require("socket.io")(server), path
2020-11-14 13:05:52
1107
原创 Express JWT(JSON Web Token)
NodeJS ExpressJSON Web Token/*总体思路是：1.login 成功之后，先获取一个token，然后保存起来，可以是 cookie，也可以是项目中的某个变更//client:const jwt = require("./jwt/jtw");$.post(url, data, function() { let us = $("#us"); const token = jwt.getAccessToken({us: us});});2.后面每次请求，都需
2020-11-14 13:00:14
242
原创 BFC 解决 Float 乱跑
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>BFC解决Float乱跑</title></head><style> .out { min-height: 20px; border: 2px solid red; overflow: hidden;
2020-11-14 12:41:52
137
原创 JS 创建一个空函数
Function.proptotype 返回一个没有任何操作的空函数。所以我们在需要一个函数默认值的地方可以使用，可以省去在线函数表达式的创建过程。
2020-09-30 08:52:41
3324
原创 NodeJS 使用 nodemailer 发送邮件
const qqAuthCode = "xxxxxx", //邮件端生成的认证码，而不是 QQ 密码 nodeMailer = require("nodemailer"), http = require("http");let transporter = nodeMailer.createTransport({ host: "smtp.qq.com", port: 465, secure: true, auth: { user: "qq号码
2020-08-02 11:33:43
233
原创 NVM(Node Version Manager) Node版本管理器
NVM安装：可以在 GitHub上面下载，如果是window的：NVM Windows 版本下载设置环境变量：在 path 中添加 NVM 的安装路径，比如：F:\abc\program files\nvmnvm常用命令：nvm install ## 安装指定版本，可模糊安装，如：安装v4.4.0，既可nvm install v4.4.0，又可nvm install 4.4nvm uninstall ## 删除已安装的指定版本，语法与install类似nvm use ## 切换
2020-06-27 08:17:20
209
原创 nrm(Node Registry Manager) npm的源管理器
nrm 是一个 npm 源管理器，允许你快速地在 npm源间切换。之前，使用手动的方式来更新npm的源，比如 ：//查看当前npm源npm get registry//返回类似如下结果：https://registry.npm.taobao.org///设置|更新npm源npm set registry=XXXX///查看当前 npm 的配置npm config list使用 nrm 可以更好的管理 npm 源。nrm安装 npm install -g nrm常用命令：
2020-06-27 00:16:58
264
转载 HTML5多线程之--Worker 线程完成轮询
有时，浏览器需要轮询服务器状态，以便第一时间得知状态改变。这个工作可以放在 Worker 里面。function createWorker(f) { var blob = new Blob(['(' + f.toString() +')()']); var url = window.URL.createObjectURL(blob); var worker = new Worker(url); return worker;}var pollingWorker = createWork
2020-06-24 11:53:24
833
原创 HTML5多线程之--同页面的 Web Worker
通常情况下，Worker 载入的是一个单独的 JavaScript 脚本文件，但是也可以载入与主线程在同一个网页的代码。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>同页面的 Web Worker</title></head><body> <script type="app/worker" id=
2020-06-24 11:50:11
383
转载 HTML5多线程之--Worker
JavaScript 语言采用的是单线程模型，也就是说，所有任务只能在一个线程上完成，一次只能做一件事。前面的任务没做完，后面的任务只能等着。随着电脑计算能力的增强，尤其是多核 CPU 的出现，单线程带来很大的不便，无法充分发挥计算机的计算能力。Web Worker 的作用，就是为 JavaScript 创造多线程环境，允许主线程创建 Worker 线程，将一些任务分配给后者运行。在主线程运行的同时，Worker 线程在后台运行，两者互不干扰。等到 Worker 线程完成计算任务，再把结果返回给主线程。这
2020-06-24 11:35:19
442
原创 HTML5多线程之-- SharedWorker
使用如下这种URL的方式创建的 worker 称为专用 Worker(Dedicate Worker)。new worker("url");而共享Workers（SharedWorker）的目的，是希望通过防止重复专用 Worker 来降低系统的资源使用。有点类似于抽取共通方法的思想。SharedWorker 接口代表一种特定类型的 worker，可以从几个浏览上下文中访问，例如几个窗口1、iframe 或其他 worker。它们实现一个不同于普通 worker 的接口，具有不同的全局作用域, S
2020-06-24 10:51:24
940
原创 有符号数和无符号数在计算机中怎么区分？
确如题主所说，计算机中存储的任何数据都是二进制形式，单看数据是无法认定其格式和内容的。计算机要用二进制编码来表达数值的符号，最直观的方法就是符号位。但为了保证基本算术运算在正负数上的一致性，x86计算机对负数采用了特殊的编码方式，即补码。为什么补码这么巧妙实现了正负数的加减运算？参见维基百科：补码-1的二进制表示下面结合题主提到的寄存器状态举个例子。为简化起见，我们8位二进制数来讲。先看8位二进制与无符号数和有符号数的对应二进制无符号 有符号00000000 0 000000001 1 1
2020-06-01 08:18:37
4360
原创 IP地址
掩码的概念作用：就是用来区分网络位和主机位表示形式：和IP是一样的注意点：掩码必须是连续全为1或者连续全为0的形式构成学会网工入门的第一道门槛—IP地址入门篇255.0.0.0 可以简写为/8 表示的含义就是前面有8个1255.255.0.0 可以简写为/16 表示的含义就是前面有16个1255.255.255.0 可以简写为/24 表示的含义就是前面有24个1255.255....
2020-05-03 21:50:05
710
原创 ARP 地址解析协议
网络设备有数据要发送给另一台网络设备时，必须要知道对方的网络层地址（即IP地址）。IP地址由网络层来提供，但是仅有IP地址是不够的，IP数据报文必须封装成帧才能通过数据链路进行发送。数据帧必须要包含目的MAC地址，因此发送端还必须获取到目的MAC地址ARP作用：已知对方ip地址，来获取对方的mac地址因为主机在发送数据之前，会进行封装 发现封装到二层的时候 DMAC地址这一块我获取不了 我主机...
2020-05-03 20:37:47
321
原创 使用迭代器实现中间件
MiddleAware.jsexport default functions => { function * generator(arr) { for (let item of arr) { yield item; } } const it = generator(functions); const...
2020-05-02 10:47:16
177
原创 使用 ES6 简单实现一个promise
Git源码：https://github.com/slhuang520/study/tree/master/web/es6/test/src/promise整体结构图如下：MyPromise .js// require("babel-register"); //自动编译// import "core-js"; //引入 polyfill// import "regenerator-r...
2020-05-02 10:41:11
579
原创 Error: Cannot find module 'MyPromise.js'
出现如下错误：internal/modules/cjs/loader.js:583 throw err; ^Error: Cannot find module 'MyPromise.js' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15) at Functio...
2020-04-25 22:01:55
670
原创 ECMAScript 的发展史简介
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>ECMAScript 的发展史简介</title></head><body><pre>HTML:从1991 ~ 1997，IE...
2020-04-19 20:14:53
443
原创 JS实现窗口拖拽
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>拖拽</title> <style> .draggable{ width: 300px; ...
2020-04-09 23:41:41
296
原创 CSS伪元素:after|::after实现提示效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>window.getComputedStyle</title> <style> div { width: 300...
2020-04-05 22:55:48
750
原创 Dom事件模型
Dom事件模型，是W3C Dom事件规范的一种。主要有：DOM0 级事件处理程序 | DOM基本事件模型DOM2 级事件处理程序IE独有的事件模型DOM3 级带伤处理程序DOM0是Dom事件定义的原始阶段，也是最混乱的，但兼容性也是最高的。DOM0就是on的方式绑定事件，包括：HTML 中 on<button type="button" onclick="test...
2020-03-30 23:23:38
316
原创 window.getComputedStyle 获取伪元素的style
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>window.getComputedStyle</title> <style> div { width: 300...
2020-03-30 22:10:29
386
转载 CSS BFC 和 IFC
文章转自：什么是BFC？看这一篇就够了BFC 定义BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。Box：css布局的基本单位Box 是 CSS 布局的对象和基本单位， 直观点来说，就是一个页面是由很...
2020-03-29 22:45:59
164
原创 JS Error 类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JS 错误信息类型</title></head><body> <fieldset> <legend&g...
2020-03-29 21:09:55
785
转载 JavaScript补齐指定位数
一、通常解决方案function dataLeftCompleting(value){ return parseInt(value) < 10 ? "0" + value : value;}// 测试var originValue = "2016-8-3", originDate = new Date(originValue);var formatValue = o...
2020-03-29 21:06:51
249
原创 JS中的类数组加上splice属性的区别以及一些注意点
类数组中：如果没有 splice 打印出来的是一个对象形式的结果 var obj = { "2": 3, "3": 4, length: 2, }; console.log(obj);//{2: 3, 3: 4, length: 2}如果加了 splice，打印出来，就是一个数组形式的结果 var obj =...
2020-03-19 21:55:24
494
TortoiseSVN-1.11.0.28416-x64-svn-1.11.0
2018-11-03
FontPack1500720033_XtdAlf_Lang_DC.msi
2017-10-19
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人