![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
关于前端如html,css,js,vue的一些知识总结分享
Xie_bro777
前端开发一枚,来个后端大佬带带
展开
-
统计vue项目的总代码量(行数)
统计vue项目内src文件夹下的总代码量原创 2024-05-29 16:03:47 · 420 阅读 · 0 评论 -
JS设置浏览器缓存
JS设置浏览器缓存:···sessionStorage对象只会存储会话数据,意味着只要浏览器一关闭,数据就没了。···localStorage对象是客户端持久存储数据的机制。原创 2022-10-18 10:40:41 · 1648 阅读 · 0 评论 -
引导页 Vue中使用driver.js
引导页 Vue中使用driver.js原创 2022-09-28 21:27:01 · 489 阅读 · 1 评论 -
空值合并运算符(? ?)、可选链运算符(?.)
空值合并运算符(??)、可选链运算符(?.)原创 2022-09-21 20:40:28 · 516 阅读 · 0 评论 -
Vue中混入(mixin)的使用
混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。原创 2022-09-04 16:54:41 · 796 阅读 · 0 评论 -
vue中各种模式下css的穿透写法
vue中各种模式下css的穿透写法原创 2022-08-23 11:00:00 · 490 阅读 · 0 评论 -
JS中 new Date() 各方法的用法
JS中 new Date() 各方法的用法,包含入参简介,及各方法的用法,时间戳、国标时间、年月日转换原创 2022-08-21 16:17:59 · 19306 阅读 · 0 评论 -
js代码输出顺序
js代码输出顺序,涉及到: console.log(); async…await; setTimeout(); Promise().then()最近面试做到的一个题目,感觉很有意思,拿来分享一波!!!!完整代码附赠:<!DOCTYPE html><html lang="en"><原创 2020-11-18 10:24:27 · 1367 阅读 · 0 评论 -
JS中this指向的几种常见情况分析
JS中的this指向 应舍友的要求,写一篇关于javascript中this指向的问题。我自己理解也不太深入,有什么问题,请及时提出来,感谢! 在进行一番学习之后,this指向什么 这一问题主要由一下几种情况: 我这个人不搞原创 2020-08-19 19:17:26 · 953 阅读 · 1 评论 -
VS Code中如何自定义代码片段
VS Code中如何自定义代码片段 1.为了避免在学习vuejs的过程中重复写框架,所以我们先写好一个模版,如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-原创 2020-09-16 10:48:49 · 260 阅读 · 0 评论 -
js:调用一个方法,如何获取一个方法的运行结果?举例说明
调用一个方法,如果获取一个方法的运行结果?举例说明1) 通过返回值 //同步 function add(a,b){ let result = a + b; return result; } var result = add(1,2); console.log(result);2) 通过回调函数function add(a,b,handle){ // 异步 setTimeout(function(){ let resul原创 2020-08-18 19:04:02 · 2258 阅读 · 0 评论 -
JS之数组中的API(引用程序编程接口)库
JS之数组中的API(引用程序编程接口)库从两种角度来分析数组钟得API库:1、静态方法(构造函数方法) (1)Array.isArray(arr) 判断参数arr是否是数组> var n = [1,2,3]; //undefined> n //[ 1, 2, 3 ]> var m=1; //undefined> m //1> Array.isArray(n) //true> Array.isArray(m)原创 2020-08-17 10:10:33 · 299 阅读 · 0 评论 -
JS中的OPTIONS请求
JS中的OPTIONS请求之所以写这篇博文,是因为在运行js代码时出现OPTIONS请求,就去查了相关的资料。在MDN中对OPTIONS请求方法是这样定义的:用于获取目的资源所支持的通信选项。客户端可以对特定的 URL 使用 OPTIONS 方法,也可以对整站(通过将 URL 设置为“*”)使用该方法。语法:OPTIONS /index.html HTTP/1.1OPTIONS * HTTP/1.1-------------------再去看看HTTP协议中的相关说法!!!---------原创 2020-08-26 22:18:33 · 5382 阅读 · 0 评论 -
块级元素的垂直水平居中
块级元素水平垂直居中1、给父元素设置相对定位给子元素设置绝对定位给子元素设置left,right,top,bottom都为0px;给子元素设置margin:auto;2、给父元素设置绝对定位给子元素设置绝对定位给子元素设置top=calc(50% - 子元素高度的一半)left=calc(50% - 子元素宽度的一半)3、给父元素设置绝对定位给子元素设置绝对定位给子元素设置left、top为父元素的50%给子元素设置margin-top、margin-left为子元素宽高的一半4、原创 2020-08-03 20:29:21 · 251 阅读 · 1 评论 -
js中的ajax
js中的ajax一、简介百科词条: Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。 通过在后台与服务器进行少量数据交换,Ajax 可以原创 2020-08-31 17:25:07 · 499 阅读 · 0 评论 -
CSS中的外边距合并问题
外边距合并问题父子级父元素会随着子元素一起拥有外边距。a、给父元素添加一个overflow:hidden;b、把父元素设置为IE盒子,然后加paddingc、给父元素加borderd、给父元素或者是本身加上浮动floate、给父元素或者是本身加上绝对定位absolutef、给父元素或者是本身加上固定定位fixedg、给父元素或者是本身加上display:inline-block;html代码 <div class="outer"> <div class="inne原创 2020-08-04 20:18:06 · 180 阅读 · 0 评论 -
CSS中的定位布局position
CSS中的定位布局position 定位时,通常使用left,top,right,bottom4个属性来进行定义一、静态定位 static left,top,right,bottom设置时将不起作用,要使用margin-left,margin-top,margin-right,margin-bottomhtml代码如下: <div原创 2020-07-29 22:50:36 · 283 阅读 · 1 评论 -
自定义复选框 记住密码之类可以使用
自定义复选框 记住密码之类可以使用最终样式:html部分 <input type="checkbox" name="" id="autoLogin"> <label for="autoLogin"></label>css部分label { width: .875rem; height: .875rem; border: 1px solid #3A88F7; display: inline-block; border-radius:原创 2021-05-18 14:00:08 · 232 阅读 · 0 评论 -
echarts 带背景的二维3D柱状图
echarts 带背景的二维3D柱状图var abilityuse = document.getElementById("abilityuse_echarts")var abilityuse_echarts = echarts.init(abilityuse);var xData = ["04-08", "04-09", "04-10", "04-11", "04-12", "04-13", "04-14"]var line = ["375", "500", "900", "800", "610"原创 2021-05-14 14:19:08 · 1028 阅读 · 1 评论 -
Vue bug处理办法
1.yarn : 无法加载文件 E:\node\nodejs\node_global\yarn.ps1,因为在此系统上禁止运行脚本。> get-ExecutionPolicyRestricted>set-ExecutionPolicy remotesigned>get-ExecutionPolicyRemoteSigned> yarn -v1.22.11原创 2021-09-16 13:49:31 · 129 阅读 · 0 评论 -
JS中将数值转换为字符串的3种方法
JS中将一个值转换为字符串的3种方法1.value.toString()这种方法存在的问题是:它不能把null和undefined转换为字符串。var n = 100;var n_string = n + "";2."" + value这种方法是使用加法运算符配合一个空字符串,可以把任意值转换为字符串,这种方法的可读性很差;但相对String(value)来,还是有一些人更喜欢用这种转换方式.var string_value = String(number);3.String(value原创 2020-08-17 09:30:39 · 15541 阅读 · 0 评论 -
jquery点击事件失效原因和解决办法
jquery点击事件失效原因和解决办法在使用jQuery绑定点击事件的时候,有时候会遇到点击无效,这种情况大多出现在动态添加元素的时候例如:给demo里添加li元素给li绑定点击事件 $("#demo").append('<li>点我</li>'); 给li元素绑定点击事件// 示范一$("#demo li").click(function(){ alert($(this).html());});// 示范二$("#demo li").on('click转载 2021-01-25 17:21:17 · 1803 阅读 · 0 评论 -
highcharts 实现3D饼图
Highcharts 实现3D饼图HTML部分<div class="S133_left3_echarts" id="S133_left3_echarts"></div>CSS部分.S133_left3_echarts{ width: 500px; height: 500px;}JS部分function totalData(param) { var total = 0; for(let i in param){ total += par原创 2021-05-19 16:59:31 · 1896 阅读 · 0 评论 -
cookie设置、获取及删除,ipv4转ipv6,颜色转换,图片裁剪
JS中设置cookie,获取cookie,删除cookiesetCookie(),getCookie(),deleteCookie()三个方法在我的上一篇博客中有封装好的方法link原创 2021-04-29 15:33:30 · 233 阅读 · 0 评论 -
前端使用canvas图片压缩
前端使用canvas图片压缩将base64转换为文件 dataURLtoFile(dataurl, filename) { var arr = dataurl.split(','); var mime = arr[0].match(/:(.*?);/)[1] var bstr = atob(arr[1]); var n = bstr.length; var u8arr = new Uint8Array(n) while (n--) { u8arr[n原创 2021-05-06 16:53:03 · 434 阅读 · 0 评论 -
通过jquery来进行“批量操作”表格中内容
通过jquery来进行“批量操作”表格中内容作为一个职场小白,那就是遇到问题,多百度,多总结,多分享。今天,我遇到了这个小问题:点击按钮,拿到被选中项的id,以数组的形式返回出来。下面 上 例子:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sc原创 2020-12-17 19:39:29 · 407 阅读 · 0 评论 -
bootstrapValidator 校验表单提示错误信息及请求校验
bootstrapValidator 校验表单提示错误信息及请求校验清除表单校验需要放在关闭弹窗的方法中,如果放在初始化的时候,可能会失败清除校验的两种方法: 1. $('#xqfk_form').bootstrapValidator('resetForm', true); 2. $("#xqfk_form").data('bootstrapValidator').resetForm();表单置空的两种方法: 1. $('.xqfk_con input').val('') $('.xqf原创 2021-04-29 14:19:56 · 1572 阅读 · 0 评论 -
js中的slice、substr、substring
js中的slice与substrvar str = " 11xieYaoPeng is a employee gender man telephone 134xxxxxxxx address jiangsuProvince suzhouShi tel kunShanShi threeWaterShawTree "console.log(str.length) //126一、查找索引1.从前往后找,结果为所要查找字符串首次出现的位置,第二个参数为从该位置开始向后查询字符串,未找到,查询结果为-原创 2021-01-05 10:28:51 · 1885 阅读 · 1 评论 -
js脚本:筛选vue项目路由中的页面名称、页面唯一标识、页面路由
js脚本:筛选vue项目路由中的页面名称、页面唯一标识、页面路由 此脚本可以将VueRouter中所编写的项目中涉及的页面名称、页面唯一标识、页面路由过滤为三个对应的 .txt 文件 。目的:梳理项目中所包含的页面以下代码为路由文件:src/router/common/route.conf.jsexport default [ { path: '/404', name: 'notFoun原创 2021-12-02 17:23:21 · 635 阅读 · 0 评论 -
layui组件--选择时间文本框
layui组件–选择时间文本框通过使用layui框架,创建一个起始时间和终止时间都有的时间选择的组件。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <t原创 2021-02-08 13:30:03 · 1031 阅读 · 0 评论 -
前端 js -- 自定义方法 -- 处理日常问题
前端 js ---- 自定义方法 ---- 处理日常问题1、日期补0 2、删除数组指定的某个元素3、当前时间4、数组去重5、去除大括号6、去除双引号7、js设置 获取 删除 cookie8、时间戳转换 9、从小到大排序 10、判断json字符串 与 string 11、当鼠标离开导航栏 二级菜单消失12.定位到页面某一个元素的位置13.适配页面14.不足两位补015.获取两个日期内的所有日期原创 2021-02-08 13:39:09 · 393 阅读 · 2 评论 -
mock语法
mock语法 一. 数据模板组成:属性名 name|生成规则rule:属性值value'name|rule':value注:1.属性名与生成规则之前用竖线 | 分隔2.生成规则的含义 需要依赖属性值的类型才能确定3.属性值value中可以含有@占位符二. 生成规则1.'name|min-max': value2.'name|count': value3.'name|min-max.dmin-dmax': value4.'name|min-max.dcount': value5.原创 2021-12-19 17:51:53 · 1630 阅读 · 0 评论 -
Javascript中的原型链
adadsadadasd<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <原创 2020-08-18 21:25:27 · 560 阅读 · 0 评论 -
NVM(node version manager)node版本管理工具
root: C:\dev\nvmpath: C:\dev\nodejsarch: 64proxy: nonenode_mirror: http://npm.taobao.org/mirrors/node/npm_mirror: https://npm.taobao.org/mirrors/npm/https://www.cnblogs.com/FineDay/p/8724061.htmlhttps://www.cnblogs.com/xiaonian8/p/14092517.html原创 2021-11-08 10:56:38 · 1635 阅读 · 0 评论