- 博客(21)
- 收藏
- 关注
RSS订阅原创 JS的实例方法和静态方法
今天看到一道面试题，题目是这样的：问如下输出是什么？ class Fun () { static changeColor (newColor) { this.color = newColor } constructor ({newColor: 'blue'}) { this.color = newColor } } const stm = new Fun({newColor: 'yellow'}) stm.changeColor('red') 首先我们来理解一下静态
2020-07-09 23:57:30
447
原创 vue项目打包后，部署在服务器上出现404解决办法
今天把自己的vue-cli3项目打包后，在自己搭的阿里云服务器上测试时，出现页面空白，提示404，网上查了一下发现静态资源加载的问题，也就是路径出现问题。我是把打包好的dist文件放在了nginx服务器的html文件夹下面，dist目录下有打包好的css、js、和img文件。网上很多说是将vue.config.js里面的publicPath修改为“./”，但是我试了一下，还是不行，只显示了一个组件。然后我发现主页地址不对，按照我的配置，项目主页地址应该是http://服务器地址/dist/home，现在
2020-07-04 00:18:02
7043
原创 深入理解css中z-index属性
今天看到一个面试题，当position和z-index属性同时设置时，到底哪个在上哪个在下呢？首先声明：z-index只能在position属性值为relative、absolute或fixed的元素上有效。基本原理是：z-index的值可以控制定位元素在垂直于显示屏幕方向（z轴）上的堆叠顺序(stack order)，值大的元素发生重叠时会在值小的元素上面。案例一假设son1和son2是father的子元素，代码和效果图如下：<!DOCTYPE html><html lang
2020-05-25 02:32:15
1563
1
转载 TypeError 之 Cannot convert undefined or null to object
分享一个今天遇到的一个bug ， 希望对你也有用。1、Object.keys()中传错了参数2、由于undefined和null无法转成对象，所以如果它们做为Object.assign()的参数（只有一个参数），也会报错...
2020-05-02 22:22:35
4961
转载 Vue-router 报NavigationDuplicated的可能解决方案
今天在做tabbar的时候，遇到一个问题，页面虽然能够成功跳转，但是控制台报了一个Uncaught (in promise)的错误，多次点击时报错[NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated"}]。查了资料，发现原因是在于Vue-router在3.1之后把$router.push(...
2020-04-16 21:27:43
290
原创 删除Mac启动台删不掉的图标
1、 打开访达，点击最顶部菜单栏的“前往”-“前往文件夹”；或者在访达图标右击，选择“前往文件夹”，然后输入“/private/var/folders”。然后在该文件夹位置搜索文件：com.apple.dock.launchpad，搜索范围选择“folders”。2、 接着进入“com.apple.dock.launchpad” 文件夹里，可以看到 “db”。3、 最后在这个位置打开 “终端...
2020-04-13 00:28:29
12882
转载 HTML5 history api
History 接口允许操作浏览器的曾经在标签页或者框架里访问的会话历史记录。属性History.length 返回一个整数，该整数表示会话历史中元素的数目，包括当前加载的页。例如，在一个新的选项卡加载的一个页面中，这个属性返回1。History.state 返回一个表示历史堆栈顶部的状态的值。这是一种可以不必等待popstate 事件而查看状态而的方式。方法History....
2020-04-11 00:56:55
184
转载 JS数组reduce()方法详解及高级技巧
1、语法arr.reduce(callback,[initialValue])reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。callback （执行数组中每个值的函数，包含四个参数） 1、previousValue （上一次调用回调返回...
2020-04-03 17:38:36
237
原创 vue元素复用
如果在输入框有输入内容的情况下，切换了登陆方式，我们会发现输入框依然显示之前的输入内容。按道理，我们已经切换到另一个input元素中了，问什么会出现这个问题呢？<body> <div id="app"> <span v-if="byUsername"> <label for="username">用户...
2020-04-03 01:26:14
442
原创 Ajax封装
Ajax（Asynchronous JavaScript and XML，即异步JavaScript和XML）是一种运用JavaScript和可扩展标记语言（XML）在浏览器和服务器之间进行异步传输数据的技术。简单的说，Ajax 是一种在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的艺术。使用Ajax不会重新加载网页，就可以与服务器交换数据。使用Ajax可以分为以下几步：1.创建...
2020-03-22 23:38:54
106
原创 手风琴导航栏
效果图：代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...
2020-02-03 22:13:07
412
原创 清除inline-block间隙的方法
inline-block 即内联块,在CSS的元素分类中可以分成三种：行内元素或者内联元素、块级元素、以及内联块元素。内联块元素具有了内联元素以及块级元素的特性：（1）元素之间可以水平排列 （2）可以当做一个块级元素来设置各种的属性，例如：width、height、padding等。当需要在”inline”元素上控制margin和padding时，inline-block属性值变得非常有用，有...
2020-02-03 17:49:19
195
原创 tab栏切换案例
tab栏切换分析：1 给tab-list里面的所有小li添加自定义属性，属性值从0开始编号。2 当我们点击tab-list里面的某个小li，让tab-con里面对应序号的内容显示，其余隐藏。代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &l...
2020-02-02 22:06:01
787
原创 微信滑动门
微信导航栏，有凸起和凹下去的感觉，最大的问题是里面的字数不一样多。为了使各种特殊形状的背景能够自适应元素中文本内容的多少，出现了CSS滑动门技术。其核心技术就是利用CSS精灵（主要是背景位置）和盒子padding撑开宽度, 以便能适应不同字数的导航栏。一般的经典布局都是这样的：<li> <a href="#"> <span>导航栏内容<...
2020-01-16 00:32:54
284
原创 记录京东广告两种方法
第一种鼠标放到广告条上，显示一张大的广告图片广告条在左侧分类大盒子里，再定位到左边动画效果：过渡（一开始大图片宽度设置为0，鼠标放上去大图片宽度恢复）<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jd</title> ...
2020-01-13 23:03:13
179
原创 CSS定位和元素模式转换
定位模式自动定位static自动定位（默认定位方式）唯一的用处就是用来取消定位。相对定位relative相对定位，相对元素本身的位置进行定位，相对定位不脱离标准流，移动时以自己左上角为基点来移动的。绝对定位absolute绝对定位，相对于它上一个已经定位的祖先元素进行定位，如果所有祖先元素都没有定位就以当前屏幕进行定位。如果子元素想在父元素上定位而父元素不想挪动位置，那么就为父元素设置...
2020-01-10 00:40:23
280
原创 position（relative）和div的重叠或者遮挡问题
今天遇到一件怪事情，那就是position的属性和div的遮挡关系，密切联系。首先说明问题出现的地方：nav是fixed，但是box还是把nav给遮住了，这是为什么呢？首先来看代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>DE...
2020-01-03 13:35:34
4791
原创 清除浮动
什么是浮动？元素的浮动是指设置了浮动属性的元素会脱离标准标准流的控制，移动到其父元素中指定位置的过程。在CSS中，通过float属性来定义浮动，其基本语法格式如下：选择器{float:属性值;}属性值描述left元素向左浮动right元素向右浮动none元素不浮动（默认值）清除浮动的本质清除浮动主要为了解决父级元素因为子级浮动引起内部高度为0...
2020-01-02 23:04:53
112
原创 margin重叠问题
假设父div里面有一个子div，给子div添加margin: 100px <meta charset="UTF-8"> <title>margin</title> <style> .father { width: 300px; height: 300px; background-color: blue; .son {...
2020-01-02 15:52:26
355
1
原创 CSS 常用中文字体 Unicode 编码表
在 CSS 中设置字体名称，直接写中文是可以的。但是在文件编码（GB2312、UTF-8 等）不匹配时会产生乱码的错误。为此，在 CSS 直接使用 Unicode 编码来写字体名称可以避免这些错误。使用 Unicode 写中文字体名称，浏览器是可以正确的解析的。例如：font-family: "\5FAE\8F6F\96C5\9ED1" //表示设置字体为“微软雅黑”。字体名称...
2019-12-25 21:47:22
768
原创 HTML5特殊字符
注意：使用时全部在html源码后面加分号 ;符号html源码描述  空格<<小于>$gt大于《«前书名号》»后书名号&&和号""引号®®已注册©&...
2019-12-24 11:16:45
263
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人