柔光

原创 vue学习（一）

vue、webpack学习

原创 替换如下 ＜p style=“line-height: 150%； text-indent: 2em； mso-char-indent-count: 2.0“＞ 标签中如果样式不包含text-inde

var reg = /\<p[^\>]*(\s+style=\"([^\"]*)\")[^\>]*\>/g; newHtml = newHtml.replace(reg,function($1,$2,$3){ if($2.indexOf("text-indent") == -1){ return $1.replace($2,""); }else{ return $1.replace($3,"text-

原创 JavaScript正则表达式给html字符串的img标签增加style样式

平时我们使用正则表达式更多的是提取、过滤等，比如提取html字符串中的图片呀等等，而最近遇到的一个问题是要给html字符串中的img标签增加style样式，就想到了使用正则表达式，主要是对正则表达式的使用。我们知道html字符串中的图片img标签，有的是有style的，有的是没有的，比如：<div style="background-color:green;width:500px;"><p>are you ok?</p><img style="border

原创 项目中问题处理

原创 wangEditor 粘贴过来的文本处理 正则提取a标签的href 正则去除所有标签

// 配置粘贴文本的内容处理 editor.config.pasteTextHandle = function(newHtml) { const reg = /(<\/?a.*?>)/ const aa = newHtml.match(reg)[0] console.log('aa', aa) const re = /((\w+):\/\/)?([\w.]+[.]{1})[\w]+/ const bb = aa.match(r.

原创 正则匹配 js

/(<\/?a.*?>)/ a标签/<a\b.*?</a>/ 表式以“<a ”(有空格) 开始 以“</a>”结尾的标签/^((https|http):\/\/)?[^\s]+[.]{1,1}[^\s]+/ 网址/((\w+):\/\/)?([\w.]+[.]{1})[\w]+/ 匹配a标签中的href="XXXX"的网址let str = '<a href456="http://www.coms.derdf.cds345345f" >

原创 json key值的命名使用，json的循环和取值

如果key值是关键字、保留字或者带有连字符，就加引号，如果不是可加可不加

原创 vue 动态样式 ，style，class

class 动态样式，可以跟变量，数组，json如果跟json后面是“类名”：boolean，如果是真值就添加这个类名，假值就不添加。style 动态style 后面跟的是json,也可以是变量<div id="app"> <h2 :style="red">春江花月夜</h2> //red是一个json对象，里面写着css的样式值 <button @click=change>修改样式</button.

原创 echarts图表自适应

拖动窗口时，echarts图标自适应窗口大小window.onresize = () => { const chartPie = document.getElementById('chartPie') chartPie.style.width = '20vw' this.chartPie.resize() const a = document.getElementById('main') a.style.width = '28vw' this.chartColumnar..

原创 uni-app中使用jsencrypt

1.在工具栏的”视图“下打开终端或者ctrl+`2.安装jsencrypt ,安装的东西都会在node_module下npm i jsencrypt3.在需要加密的文档中引入import JSEncrypt from '../../node_modules/jsencrypt/bin/jsencrypt.js'4.js部分var encrypt = new JSEncrypt(); let publicKye = `-----BEGIN PUBLIC KEY-----MIGfMA0GC

原创 动态合并单元格 elementUI table表格动态合并

效果图如下在动态处理从后端拿回来的数据的时候，是需要从数据中找到一个唯一的“标识”去判断是否是相同种类的数据。然后根据这个“标识”去做逻辑判断。3.代码：//合并单元格 二维数组-> 根据“标识”去遍历数据data() {return { spanArr: [], //遍历数据时，根据相同的标识去存储记录 pos: 0 // 二维数组的索引 }}// methods中定义方法getSpanArr(data) {let that = this//页面展示的数

原创 uni-app知识点2

一、路由跳转的时候传值//在起始页面跳转到test.vue页面并传递参数uni.navigateTo({ url: 'test?id=1&name=uniapp'});// 在test.vue页面接受参数export default { onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数 console.log(option.id); //打印出上个页面传递的参数。 con

原创 uni-app知识点1

登录页面**登录页面涉及到的知识点：1、点击获取验证码（base64使用）2、提示信息（uview基于uni-app的UI框架）3、点击登录后加密解密4、本地存储，取值删除uni.setStorageSync，uni.getStorageSync，uni.removeStorageSync5、发送请求**一、base64的使用base64编码介绍 | Base64 EncodeBase64是网络上最常见的用于传输8Bit字节代码的编码方式之一，Base64编码可用于在HTTP环境下传递较

原创 初识vue

官网：https://cn.vuejs.org/ 属性 ---- 变量 ---- 模型 方法 ---- 函数1.介绍1.渐进式 JavaScript 框架：主张最少。2.优点：易用 灵活 高效 指令系统 SPA(单页面应用) MVVM多页面应用：1个url 对应一个html页面，多个url对应多个html单页面应用：多个url对应1个html页面3.兼容：Vue不支持IE8 及...

原创 cursor的所有样式 展示

cursor可以为按钮或者某些区域强制定义一种鼠标移上去的鼠标光标形状。定义和用法cursor 属性规定要显示的光标的类型（形状）。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状（不过 CSS2.1 没有定义由哪个边界确定这个范围）。可能的值url 需使用的自定义光标的 URL。注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。default 默认光标（通常是一个箭头）auto 默认。浏览器设置的光标。crosshair 光标呈现为十字线。

原创 如果文字超出展示的范围，让其用省略号展示并隐藏多余的内容

text-overflow: ellipsis;overflow: hidden

原创 gitee 码云 提交代码推代码

1、git add .（后面有一个点，意思是将你本地所有修改了的文件添加到暂存区）2、git commit -m""(引号里面是你的介绍，就是你的这次的提交是什么内容，便于你以后查看，这个是将索引的当前内容与描述更改的用户和日志消息一起存储在新的提交中)如果在第二步执行完之后报错：× eslint --fix found some errors. Please fix them and try committing again.那么 执行 ：在提交时用下面这句 git commit --no-veri

原创 gitee 码云克隆

直接选择需要克隆的仓库的代码，然后选择HTTPS复制，在终端输入：git clone 下载的链接

原创 webpack ‘vue-cli-service‘ 不是内部或外部命令，也不是可运行的程序 或批处理文件。

‘vue-cli-service’ 不是内部或外部命令，也不是可运行的程序或批处理文件。1.npm install vue-cli -g 安装全局vue-cli如果还 有问题 重新安装一下( npm install ) node modules

原创 1.git 新建仓库，把写好的代码提交到一个新建的仓库里

第一步：如下图所示：打开gitee新建一个仓库第二步，新建完成之后gitee上会有一个这样的界面第三步：运行以下代码片段第四步：运行git init第五步：打开自己要提交代码所在的文件夹 cd 目录，或者打开自己的项目，在导航栏cmd进入命令窗口进了该文件之后第六步：git add . 添加第七步：git commit -m’第一次提交代码’第八步：注意：如果在执行第八步的时候出现类似一下图片的错误error:remote origin already exists(错误

原创 启动node的时候报错 3000端口已经启动

出现这种问题是因为你启动了两次node,在第二次输入node app.js的时候会报这个错误。说明3000端口已经启动

原创 uni-app 动态修改导航名称

一级页面methods: { //在点击list跳转的时候携带id传参到listSecond页面 toLs(index,name) { this.getIndex = index uni.navigateTo({ // url: "../listSecond/listSecond?id=" + this.id url: `../listSecond/listSecond?id=${this.id}&name=${name}` }) }

转载 Vue 点击列表中某一个变色案例

v-bind v-for v-on的使用题目要求：完成一个有序列表，鼠标点击其中某一项，该项字体颜色变红html.<div id="app"> <ul> <li v-for="(movie,index) in movies":class="{active:index===getIndex}"v-on:click="onClick(index)"> {{index}}--{{movie}}</li>

原创 定时器案例，，运动框架，移动，渐变

1、定时器如果一个函数是定时器调用的，则定时器里函数的this是window间歇调用：var 定时器标识 = setInterval(函数，时间毫秒)；间歇调用只执行一次，相当于一个定时炸弹。clearInterval(定时器标识)； 清除定时器超时调用：var 定时器标识 = setTimeout(函数，时间毫秒)；隔一段时间执行一次clearTimeout(定时器标识)； 清除定时器案例1：弹窗定时器（超时定时器使用）<!DOCTYPE html><html lan

原创 web 前端 js 函数定义、传参、argument、案例、数组编辑多条、函数作用域、return、获取元素样式

1、函数定义：就是把一些代码包装起来，方便重复使用函数声明之后必须调回，才会执行2、声明：function 函数名（）{ 代码块 }3、函数表达式： var 函数名=function(){ 执行代码 }4、函数声明之后，它不会自动执行，需要函数名（）调用注意：函数声明的调用在函数的前面或者后面都可以，但是函数表达式只能在函数后面调用5、函数参数传递：如果实参比形参少，没有匹配上的是undefinedvar n = 0;var fn = function(x) {for(var i=1; i&

原创 web前端js分支for语句、获取元素、prompt、alert

prompt() 方法用于显示可提示用户进行输入的对话框。有确定取消和输入框。confirm（）只有确定和取消按钮，alert（）只有确定按钮代码：二、分支语句三、获取元素通过ID获取元素和通过标签获取元素的区别：1、ID获取的是一个元素，而标签获取的一组元素（操作方式不一样）2、ID获取元素前面必须是一个document，而通过标签获取元素前面是document，也可以是某一个父级如下：打印结果：3、通过标签获取的元素，具有动态性（必须加数组形式显示var body=docum

原创 web 前端 数据类型

一、数据类型var n=null; typeof 返回“object”undefined var u； 声明了但没有赋值，会出现undefined typeof 返回的是一个“undefined”字符串返回object函数返回function数组返回objectnull返回object-------------------------------------------...

原创 uni-App使用1

uni-App：接口调用：get方式： function() { // 发起请求 uni.request({ url: '/captcha/sent?m=1', //接口地址，通过？可以传递，或者{}。 method:"GET", success: (res) => { console.log(res) } }); }post方式： function() { /