- 博客(121)
- 资源 (11)
- 收藏
- 关注
RSS订阅原创 clean-webpack-plugin使用报错
TypeError: cleanWebpackPlugin is not a constructor Cannot read property 'emit' of undefined
2022-11-24 22:31:40
625
原创 基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码
基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码，scrollTop,animate
2022-03-10 21:28:04
2291
原创 你真的了解word-wrap和word-break的区别吗？
word-break:break-all和word-wrap:break-word的区别
2022-03-06 16:28:33
700
原创 如何用CSS让背景有透明度而内容不受影响
效果图如下所示：具体思路：因为设置完背景之后，再使用opacity属性设置透明度会影响其上方的内容，导致上方内容也会产生透明的效果。所以，需要将背景单独设置一个层，并和文字所在的层重叠且居于其下即可。注意：两个层的大小要保持一致。具体实现代码如下所示：<!DOCTYPE html><html><head> <title></title> <style type="text/css"> body {
2022-03-04 22:58:09
2305
转载 HTML5中的aria与role
这些都是HTML5针对html tag增加的属性，一般是为不方便的人士提供的功能，比如屏幕阅读器。role的作用是描述一个非标准的tag的实际作用。比如用div做button，那么设置div 的 role=“button”，辅助工具就可以认出这实际上是个button。aria的意思是Accessible Rich Internet Application，aria-*的作用就是描述这个tag在可视化的情境中的具体信息。比如：<div role="checkbox" aria-checked="c
2021-11-27 21:31:50
1285
原创 js操作dom
Jquery 动态增加option const fruitArray = [ { label: '苹果', value: 1 }, { label: '香蕉', value: 2 }, { label: '橘子',value: 3 }, { label: '梨',value: 4} ] // 等dom元素加载完再执行 $(document).ready(function () { f
2021-10-02 22:49:16
126
转载 调用layui.use中function的正确姿势
适用于1. obj.click()2. 行内onclick<html> <head> <link rel="stylesheet" href="layui/css/layui.css" media="all"> </head> <body> <a class="layui-btn" id="test" href="javascript:;">测试</a><br/><br/>
2021-09-28 21:38:40
1221
转载 CSS文字不换行，超出部分显示...
实现单行文本溢出部分显示 …width: 300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;多行文本实现溢出部分显示… width: 300px; /* 首行缩进2个字符 */ text-indent: 2em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-cl
2021-09-28 21:21:50
485
转载 了解 offsetWidth clientWidth scrollWidth 的区别
了解 offsetWidth clientWidth scrollWidth 的区别最近需要清除区分开元素的width，height及相应的坐标等，当前这篇用来区分offsetWidth clientWidth scrollWidth的区别各自的概念假设有一个元素，width有以下几个进行组合contentpadding-leftpadding-rightscrollbar 垂直的滚动条宽度（假设有，没有便为0）border-leftborder-rightclientWidt.
2021-09-28 21:16:00
279
原创 JS判断元素是否出现了省略号
js判断元素是否出现了省略号，并且鼠标悬浮时，显示全部内容<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://cdn.staticfile.org/jquery/1.10.2
2021-09-28 21:04:40
2724
转载 CSS为英文和中文字体分别设置不同的字体
font-family的调用方法:div { font-family:Arial,'Times New Roman','Microsoft YaHei',SimHei; font:bold 12px/0.75em Arial,'Times New Roman','Microsoft YaHei',SimHei; }依据font-family的原则,假如客户终端不认识前面的字体,就自己主动切换到另外一种字体,另外一种不认识就切换到第三种,以此类推.假如都不能识别就调用默认字体
2021-09-27 09:37:06
4366
转载 layui中封装使用echarts
日常”过坑“记录 只记录方法不说原理。。。 步骤： ECharts下载 引入echarts.js 注意：这里好像只能用echarts.js,其它的不行，英文后面配置的时候要改东西(ps:我也不太不清楚) 修改echarts.js 打开echarts.js，在文件大概开始处添加如下代码 window.layui && layui.define ? layui.define(function(exports){exports('e...
2021-09-26 21:54:55
425
转载 前端浏览器的两种缓存:协商缓存和强缓存
1.浏览器缓存机制浏览器缓存(Brower Caching)是浏览器在本地磁盘对用户最近请求过的文档进行存储，当访问者再次访问同一页面时，浏览器就可以直接从本地磁盘加载文档。浏览器缓存的优点有：减少了冗余的数据传输，节省了网费减少了服务器的负担，大大提升了网站的性能加快了客户端加载网页的速度浏览器缓存主要有两类：缓存协商和彻底缓存，也有称之为协商缓存和强缓存强缓存：不会向服务器发送请求，直接从缓存中读取资源，在chrome控制台的network选项中可以看到该请求返回200的状态码;.
2021-09-26 21:22:10
910
原创 jar包和war包区别及理解
jar包：是别人已经写好的一些类，然后对这些类进行打包。当你使用某些功能时就需要这些jar包的支持，需要导入jar包。war包：是一个可以直接运行的web模块，通常用于网站，打成包部署到容器中。借鉴之：https://blog.youkuaiyun.com/cjw12581/article/details/107463971...
2021-09-24 08:52:48
154
转载 idea快捷键
Ctrl 快捷键介绍Ctrl + F在当前文件进行文本查找 （必备）Ctrl + R在当前文件进行文本替换 （必备）Ctrl + Z撤销 （必备）Ctrl + Y删除光标所在行 或 删除选中的行 （必备）Ctrl + X剪切光标所在行 或 剪切选择内容Ctrl + C复制光标所在行 或 复制选择内容Ctrl + D复制光标所在行 或 复制选择内容，并把复制内容插入光标位置下面 （必备）Ctrl + W递进式选择代码块。可选中光标所在的单词或段落，连续按会在原有选中...
2021-09-07 17:51:47
601
原创 .btl 文件高亮配置：
在vscode中设置.btl文件代码高亮操作步骤：文件→首选项→settings.json打开在里面添加如下代码： "files.associations": { "*.btl": "html" }借鉴自：https://blog.youkuaiyun.com/Janent168/article/details/114876085
2021-09-07 17:49:44
474
原创 面试题总结
js部分js的基本数据类型Number、String、Boolean、Null、Undefined 数据存放在栈内存中扩展：引用数据类型Object、Array、Function 数据存放在堆内存中操作数组的方法，哪些会改变原数组？操作方法：引自：关于js中操作数组的一些方法不会修改原数组Array.join() // 返回一个字符串Array.reverse() // 返回逆序数组Array.sort() // 返回排序后的数组 如果数组包含undefined，会被排到
2021-08-30 21:31:35
125
转载 VUE使用BUS进行兄弟组件传值
1.新建bus.jsimport Vue from 'vue'export default new Vue2.在需要传值和接受值的vue文件中，各自引入bus.jsimport bus from '../../../utils/bus' // 在src目录的下面3.定义传值的方法，使用bus.$emit(‘methodName’,data)4.要接收值的组件里，使用bus.on(‘methodName’,val =>{ })5 具体示例如下所示index.vue<temp
2021-08-23 21:54:57
938
转载 微信小程序报错：Unhandled promise rejection TypeError: WebAssembly.instantiate(): Argument 0 must be a buffe
一 所报具体的错Unhandled promise rejection TypeError: WebAssembly.instantiate(): Argument 0 must be a buffer source or a WebAssembly.Module object二 解决选择这个版本即可：文章转载自：https://blog.youkuaiyun.com/weixin_42349568/article/details/119186573...
2021-08-23 11:46:01
2652
原创 微信小程序中修改vant组件的样式
例如：修改 van-dropdown-menu组件里面的样式.wxss文件中直接进行修改即可/* 修改框架中的样式 */.van-dropdown-menu{/* 添加 !important 是为了避免样式的优先级不如之前的*/ height: 30px !important;}参考自：https://youzan.github.io/vant-weapp/#/custom-style...
2021-08-23 10:49:20
3651
2
原创 大屏可视化
vue + echarts 制作大屏可视化源码地址:https://gitee.com/jianaili123/visualization.git布局思路:1. 使用em布局不使用rem的原因:如果当前可视化界面只是系统界面中的一个子界面,使用rem布局会影响到别的界面的样式,而使用em只是设置当前页面父元素的字体大小,不会影响到别的页面2. 采用相对布局(父元素) + 绝对布局(内容) 3. 分块进行布局展示,设置好每一部分的宽和高;...
2021-08-12 11:05:16
236
原创 Vue中引入使用scss变量报错：./node_modules/vue-style-loader!./node_modules/css-loader?
1.第一种情况：这是由于css解析的时候出了问题，解决方案为：https://blog.youkuaiyun.com/dt1991524/article/details/834132112. 第二种情况（自己遇到的）：样式文件的引入方式导致<style lang="scss" scoped>@import "../styles/index.scss"; // 这种引入正确// @import url(../styles/index.scss); // 这种方式引入报错</style&g.
2021-07-15 09:19:36
6640
原创 Echarts图表没数据的时候，用图片代替暂无数据(图片自适应)
暂无数据时在echarts图表中显示：代码如下： if (data === null || data.length === 0) { // 获取的数据源 const elementImg = require('@/assets/index/nodata.png') // 暂无数据图片路径 const main = document.getElementById(id) main.style.display = 'flex' main.st
2021-07-01 09:25:06
2690
3
转载 js前端缓存的几种方法
一、缓存的好处当页面渲染的数据过多时，为了减轻对内存的占用，对初次接收且会用到的数据进行本地缓存，是有着大好处的.受网速等各种因素的影响，当渲染数据过多时，若存在频繁的切换页面，用户体验效果不佳。二、常见的本地缓存1. 利用storage来对数据进行存储(sessionStorage、localStorage)a. sessionStorage临时的会话存储，只要当前的会话窗口未关闭，存储的信息就不会丢失，即便刷新了页面或者在编辑器中更改了代码，存储的会话信息也不会丢失。b. localS
2021-07-01 09:09:43
10293
转载 js四舍五入和计算
序言：我们都知道 0.36 * 15=5.4，但是在计算机中得到的结果却是： 0.36 * 15=5.3999999999999995 // 而非 5.4原因请查看该篇文章：https://juejin.cn/post/6844903794875039751一、toFixed和 Math.round四舍五入1. toFixed()方法toFixed() 方法可把 Number 四舍五入为指定小数位数的数字，但其四舍五入的规则与数学中的规则不同，使用的是银行家舍入规则,银行家舍入：所谓银行家舍入
2021-06-28 20:23:29
603
转载 Vue项目如何动态设置路由meta信息中的title属性值
https://www.cnblogs.com/blogNYGJ/p/14280494.html
2021-06-23 15:42:07
9230
2
原创 canvas相关知识点
使用的html标签为：<canvas id="canvas" width="200" height="100" style="border:1px solid #f00;"> 浏览器不支持 HTML5 canvas</canvas>注意：canvas的width和height的属性是不能带单位的，只能是纯数字，单位默认是px可以直接通过属性 width 和height设置宽高，也可以通过js获取到该标签来进行宽高的设置，如下所示：const canvas = do
2021-06-18 15:31:09
1341
原创 百度地图实时监听缩放级别
百度地图实时监听缩放级别map.addEventListener("zoomend", function(e){ let zoom= map.getZoom(); // 获取缩放级别// 其余操作});百度地图省市县乡镇街道对应ZOOM级别原文链接https://www.cnblogs.com/yz-blog/p/6484595.html百度地图api地址：https://mapopen-pub-jsapi.bj.bcebos.com/jsapi/reference/jsapi_webg
2021-06-17 09:51:36
3976
转载 Element UI 中 dialog 可拖拽
1.utils文件夹下创建dialog.js文件import Vue from 'vue'// v-dialogDrag: 弹窗拖拽Vue.directive('dialogDrag', { bind(el, binding, vnode, oldVnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dialog')
2021-06-12 16:33:56
349
转载 CSS中可以和不可以继承的属性
一、无继承性的属性1、display：规定元素应该生成的框的类型2、文本属性：vertical-align：垂直文本对齐text-decoration：规定添加到文本的装饰text-shadow：文本阴影效果white-space：空白符的处理unicode-bidi：设置文本的方向3、盒子模型的属性：width、height、margin 、margin-top、margin-right、margin-bottom、margin-left、border、border-style、...
2021-05-12 11:54:30
123
原创 css引入的三种方式，内联式、嵌入式和外联式
CSS主要是用于定义HTML内容在浏览器内的显示样式。内联式 <p style="font-size : 1.3rem;font-weight: 700;">嵌入式</p>嵌入式写在<head>标签内<style type="text/css"> .title { margin-top: 2%; text-align: left; font-size: 1.5rem; font-weight: 600;
2021-02-28 22:04:07
2297
前端面试题库大全，前端面试题库大全
2024-04-17
css初始化html页面
2019-05-06
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人