- 博客(18)
- 收藏
- 关注
RSS订阅原创 外边距折叠问题
我们其实想要的是，这个margin-top为20px，只留在t2中，而不跟外部折叠。t3容器的margin-top为20px，居然跟外部的10px折叠了，取大值就是20px。可以看到，上下两个margin都是10px，按理叠加应该是20px，但实际是10px。1、对容器使用overflow:auto(非visible即可)。2、在两个外边距之间加上边框border、或内边距padding。这种情况还好，但多个容器会存在多外边距折叠的问题。折叠外边距的大小，等于相邻边距中的最大值。3、浮动元素、内联块。
2023-07-27 09:31:50
76
原创 搭建最简单的vue脚手架
我们知道，底层运行的其实都是html、css和js文件，浏览器是不识别.vue文件的。先不考虑es6和css问题，我们试一下目前这些工具，是否可以解析vue。先创建三个文件：index.html、main.js和App.vue。要解析.vue文件，必须通过插件，将其打包为浏览器可识别的js文件。App.vue就是个首页，随便写点东西，看看是否能解析出来。main.js是入口文件，这里需要做初始化vue的操作。index.html是模板，需要指定vue的容器。###解析.vue文件。
2023-07-14 16:58:08
89
原创 package.json的两个字段-main和files
files里面指定哪些文件，安装时就出现哪些，不指定的，就隐藏了。系统会默认寻找main入口，显然，我们需要指定其打包目录lib作为入口，而当不指定main 字段时，默认值是模块根目录下面的 index.js。还是看一下element-ui的，这个版本基本把源代码都公开出来了，但后面的plus版本就隐藏了很多东西。如果存在.gitignore 文件，而缺少.npmignore，则将改用.gitignore 的内容。描述了将软件包作为依赖项安装时要包括的条目，默认值为[“*”]，这意味着它将包括所有文件。
2023-07-13 17:06:19
839
原创 mapbox-对数据筛选后渲染
有一堆杂七杂八的点线面数据，我们希望，点用红色的，面用黄色的，怎么办呢？addLayer提供了filter选项，可以对source数据进行筛选。
2023-05-18 10:58:53
245
原创 node实现图片鉴黄
nsfwjs是一款强大的开源鉴黄的框架，不过搭建过程比较繁琐，今天花了一些时间试错，最后终于成功跑起来。将过程整理了下来，避免后来者踩坑。我们结合express搭建鉴黄服务。1、搭建expressnpm install -g expressnpm install express-generator -gexpress identifyimg2、安装windows-build-tools在windows下，nsfwjs安装需要一些C++库和python版本的支持。我们需要用管理员身份打开c
2022-03-08 17:44:29
502
原创 如何数组劫持
对象的劫持比较容易：let obj = {};let _value = '';let res = Reflect.defineProperty(obj, 'name', { get() { console.log('触发get'); return _value; }, set(v) { console.log('劫持set'); _value = v; }})obj.name = '李四';//
2021-09-02 16:00:20
205
原创 angular使用iframe的src无效
angular使用iframe比较诡异，直接用src标签是无效的。//html<iframe [src]="getUrl(detailData.id)" frameborder="0" width="100%" height="620px"></iframe>//jsimport {DomSanitizer} from "@angular/platform-browser";getUrl(id){ return this.sanitizer.bypassSecuri
2021-07-21 15:32:45
517
原创 git冲突解决方案
我们在使用git的时候，经常会遇到冲突的情况，那应该如何解决冲突呢？首先看一下git的原理图。从这张图可以很清楚的看到本地分支和远程分支的区别，当我们进行commit操作的时候，事实上只是提交到本地的git分支上；而只有进行了push后，才是提交到远程的git分支上。下面以index.html文件为例，如果你跟同事张三都修改了这个文件，就有如下两种场景。场景1你在本地修改了index.html，但还没commit，这时张三喊你更新代码。此时你pull的话，代码无法更新下来，会有如下提示：er
2021-03-08 09:47:02
1403
1
原创 来一条node爬虫
用node写个爬虫真的肥肠煎蛋，今天就来玩一下。物料首先准备物料。cnpm i axioscnpm i cheerio我们需要准备两个第三方包，一个是axios，用来发送请求的，当然request包也行，看个人喜好了；另一个是cheerio，这货是用来解析dom的，跟jquery的用法一样一样的。爬虫的实现思路也就是说，我们通过axios请求过来的html的标签数据，然后用cheerio包来提取我们需要的内容，紧接着我们可以用fs包的流来读取数据，然后写入我们的磁盘，这就是一个完整的爬虫需要
2020-12-21 18:32:17
86
原创 node如何连接mysql？
mysql是一种关系型数据库，实际使用场景比较广泛。如何用node连接mysql呢?1、安装mysql。大家可以在oracle官网去下载mysql软件，如果是windows系统，最简便的办法是下一个appserv，这是一个php的集成包，里面集成了mysql，一键安装即可，省却一大堆不必要的麻烦。2、安装node支持mysql的模块。npm install mysql -S3、建立连...
2020-04-27 11:00:04
1241
原创 Map和Object的区别
es6提供了一个Map类，这是新增的一个数据结构，用起来有点像Object，这二者到底有什么区别呢？Object本质上是哈希结构的键值对的集合，它只能用字符串、数字或者Symbol等简单数据类型当作键，这就带来了很大的限制。比如以下这个例子，我想将dom节点作为键，但是由于对象只接受字符串作为键名，所以键被自动转为字符串[object HTMLDivElement]，这显然不是我们想要的。&...
2020-04-27 10:49:06
1845
1
原创 细说WeakMap
先看一段简单的代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>二维数组持有dom</title></head><body><div> <input typ...
2020-04-26 21:48:55
232
原创 左连接、右连接、内连接的区别
面试的时候问到这个知识点，一时没想起来，今天总结一下。比如有A和B两张表，分别代表姓名和职业。A表：id name 1 张三 2 李四 3 王五B表：id fid work 1 2 厨师 2 6 会计现在我们需要查询每个人的职业。左连接左连接就是以左...
2020-04-26 21:42:58
671
原创 本地缓存与协商缓存
浏览器缓存分为三种情况：1、200 from cache本地缓存，浏览器直接从本地缓存的内容获取响应，根本没向服务器发送请求。2、304 not modified协商缓存，浏览器在本地没有命中的情况下，在请求头中发送一定的校验数据给服务端，如果服务端数据没有改变，返回304，告诉浏览器从本地缓存响应即可。304返回的只是一些基本的响应头信息，数据量比较小，没有响应实体部分。3、200 ...
2020-04-26 21:39:41
257
原创 箭头函数的坑
es6里面的箭头函数很好用，不过也有些坑，如果你觉得它完全取代了function关键字，那就是大错特错了。构造函数箭头函数无法跟function一样使用new：var Foo = ()=>{ console.log(this)}var Foo2 = function(){ console.log(this)}console.log(Foo.prototype)/...
2020-04-26 21:37:05
997
原创 块级作用域的坑
先来看一段代码：let color = 'green'let obj = { color: 'yellow', getColor: () => { console.log(this)//指向了window console.log(this.color) },}obj.getColor()//undefined我们知道，箭...
2020-04-26 21:32:22
301
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人