html
文章平均质量分 50
养只猫
这个作者很懒,什么都没留下…
展开
-
markdown样式覆盖的解决方案
markdown,css,样式覆盖,reset.css原创 2023-08-23 23:01:15 · 324 阅读 · 1 评论 -
web worker API开启浏览器js多进程
面试使人进步!!!在大厂佬们的碾压下接触到了目前工作中没有遇到的新api和新思路以及解决方案。今天就来说说这个新的api web Worker。以下是MDN原话指的是一种可由脚本创建的后台任务,任务执行中可以向其创建者收发信息。要创建一个 Worker,只须调用Worker(URL)构造函数,函数参数 `URL` 为指定的脚本。Worker也可以创建新的 Worker,当然,所有 Worker 必须与其创建者同源。很明显了就是让我们可以开启一个新的进程来处理js。js是采用的是单线程...原创 2021-09-17 22:16:13 · 721 阅读 · 0 评论 -
两种websocket实现的方案(html+node,vue+node)
自定的学习计划中终于到了websocket这一块了,其实很早就像搞这一块但是之前堆积了一堆其他更重要的东西。以前对于即时聊天的实现思路就是轮询后端的接口,这样的方式是一种“假即时聊天”,websocket才是最佳的方式。前端出身的我自然是用node作为服务端。那么我们开始吧!!!方案一(html+node)这种方式适用于原生的js+html项目。客户端直接使用原生的WebSocket对象这...原创 2019-10-23 16:56:47 · 1163 阅读 · 0 评论 -
vue-cli3.0设置页面icon图标
最近做的一个项目中在用vue-cli3.0创建项目的时候不小心选择了pwa这一个插件,碰到了不能设置网页图标的问题。在最新的vue-cli3.0直接在index.html中设置icon是不行的,需要在vue.config.js中设置一个pwa属性。pwa: { iconPaths: { favicon32: './plug_jchLogo.png', fav...原创 2019-05-25 11:20:00 · 10981 阅读 · 6 评论 -
字符串在html中的页面中的换行
最近的项目中碰到了多次在一段字符串中换行的操作正常我们将一段字符串放到html文档中的时候,如果想要在字符串的某处进行换行怎么办呢?一般我们会想到用\n来进行换行,在console.log中是可以起到换行的效果,但是html并不能很好的识别解决办法:在要渲染字符串的标签中加入white-space: pre这个样式,这样这个标签就能支持\n换行了。开发中的小技巧知识点有点零碎但是因为做...原创 2019-06-21 22:17:32 · 6282 阅读 · 0 评论 -
js将element的table表导出为excel
直接上代码<el-table :data="item.data" cell-class-name="itemTd" row-class-name="itemRow" ...原创 2019-06-22 15:08:18 · 587 阅读 · 2 评论 -
获取input选择文件的本地地址
转至:http://www.bcty365.com/content-69-6242-1.html感谢大神!!!之前在做图片或者图片上传的时候都要先将图片或视频上传之后拿到文件的网络地址才能在标签上显示。现在可以通过window的createObjectURL这个api拿到本地地址//拿到input选择文件的本地地址 getFileURL(file) { ...转载 2019-07-10 16:32:44 · 9467 阅读 · 1 评论 -
js监听div标签上面的自定义属性
好久没写博客了,可能是近期遇到了瓶颈没有什么东西可以写了,而且最近在换工作也没什么时间。现在工作换好了,于是更多的可能会慢慢的向原生js方向去。直接上代码吧<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewpo...原创 2019-08-17 15:59:36 · 1373 阅读 · 0 评论 -
vue模拟h5外卖点餐双联列表
自己用vue手撸的一个h5外卖点餐双联列表#2019.10.28修改:当滚动右边列表时,左边列表的激活项超出列表可是范围的时候左边列表滚动到相应的激活项位置<template> <div class="goodsListNav"> <div id="left" class="left"> <span cla...原创 2019-09-24 21:40:28 · 1048 阅读 · 2 评论 -
js的图片懒加载
当网页中的图片文件过多的时候,页面加载的速度会变慢于是去学了了一下图片懒加载的方法。html中的img标签将图片的路径放到data中,然后src属性为空。<img src="" data-src="images/bank1.jpg" alt="Clients Logo">jsquerySelectorAll选中页面中所有的图片元素getTop是元素离页面顶部的距离lazy...原创 2019-03-04 10:08:09 · 146 阅读 · 0 评论 -
vue自定义指令中的移动端和pc端div的拖拽行为
vue自定义指令是个非常有意思的存在,是一个非常便利的功能。今天突然想做一下拖拽div的功能,本来想直接写到.vue文件中然后想到其实拖拽是针对某个div,于是就想到自定义指令。vuetemplate中<div style="width: 100px;height: 100px;background: black;position: fixed;top: 200px;left:...原创 2019-03-08 14:25:26 · 1980 阅读 · 3 评论 -
css3动画小总结
对于css3不得不提的就是css3的动画了大致分为3大块transform(变化),transition(过度),animate(动画)transform变化主要是位置的移动translate(向右移动距离,像下移动距离),scale缩放,rotate旋转顺时针2d变化如下:transform: translate(100px,100px) scale(0.8) rotate...原创 2018-12-13 15:37:40 · 272 阅读 · 0 评论 -
每日一条js之宽高
在前端逻辑中无论是操作数据的vue框架或者原生的dom操作都会用到获取元素、窗口等的宽高在这里直接上图吧,用写的感觉比较拖沓转载 2018-09-17 22:50:31 · 126 阅读 · 0 评论 -
flex布局的一些图片拉伸问题
在flex中图片会被默认高度拉满scaleContent="true" 允许拉伸maintainAspectRatio="false"允许改变图片的高宽比flex-shrink: 0元素不被压缩原创 2018-10-12 16:47:42 · 3739 阅读 · 0 评论 -
vue之豆瓣电影(一)
前言学习vue也有一段时间了,一些常用的指令,路由、vuex、生命周期也了解的差不多了。公司目前没有vue的项目为了得到进一步的突破,决定利用空闲的时间写一个关于电影单页面应用。由于没有后端因此选择了豆瓣的接口,项目很简单但是代码的过程中使用到尽可能多的vue相关的知识。项目中用到了vue2.0、mint-ui、webpack、vue-cli、vue-router、vuex、axios、s...原创 2018-10-08 21:49:54 · 1068 阅读 · 1 评论 -
input标签修改默认样式
html<input type="checkbox" name="input" id="input"><label for="input" class="select"></label>style.select:after{ border-radius: 15px; height: 26px;原创 2018-10-18 20:27:48 · 1486 阅读 · 0 评论 -
css实现左侧定宽盒子右边不定宽盒子占满
方法一、浮动左:float:left;width: 200px;右:margin-left: 200px;方法二、flex布局父:display: flex;左:width: 200px;右:flex: 1;方法三、position定位父:position: relative;左:width: 200px;display...原创 2018-10-18 20:41:58 · 1151 阅读 · 1 评论 -
css实现瀑布流布局
css主要是父元素设置column-count: 4;column-gap: 10px;若出现小盒子边线覆盖就在小盒子的样式上加上overflow: auto;.main{ width: 90%; margin: 10px auto; column-count: 4; column-gap: 10px; ...原创 2018-10-18 21:02:50 · 114 阅读 · 0 评论 -
html标签中的id不能用纯数字
今天碰到了一个坑,在用v-for做数据循环的时候吧每一条数据的id直接赋值到对应的标签上,应为是封装了组件在有些页面引用是没问题的,但是有些页面引用的时候js却报错了,一番排查之后发现是标签使用了纯数字,于是在数字前面加上了一个字母就好了。也只能说自己自学的基础不够扎实,html标签中的id不能用纯数字,不然会发生不可估计的错误。变量不能是纯数字,必须是字母、下划线、$开头的,编译器对纯数...原创 2018-11-08 20:24:33 · 5112 阅读 · 2 评论 -
scss的常规用法
公司的项目做了有一段时间了,由于之前对scss的了解比较少项目中用到的scss相关的东西只有scss的嵌套如下.body{ width: 200px; .item{ width: 100px; }}现在项目做了有一段时间了,决定好好的研究一下scss这个css预处理器。项目用的是vue框架。scss安装(npm)npm install --save-de...原创 2018-11-16 10:54:05 · 1001 阅读 · 1 评论 -
分享一个rem的网页布局写法
最近写网站布局的时候碰到了一个比较头疼的客户,然后这个网站也是接别人的尾一些要求都不清楚。网站写完后客户验货的时候电脑屏幕不一样大我的电脑上显示是正常的,到了客户电脑上就变样了,这样子对于后期和客户的沟通调整产生了很大的问题。经过这个网站的洗礼,决定找一个解决的办法,这里借鉴了某大神的做法就是用rem进行html编写。以rem为单位进行屏幕大小的动态调整,最终的结果无论在什么屏幕下显示的比例都是一...转载 2018-05-22 15:40:00 · 1169 阅读 · 0 评论