自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 问答 (1)
  • 收藏
  • 关注

原创 css属性box-shadow

box-shadow属性向box添加一个或多个阴影语法:box-shadow: offset-x offset-y blur spread color inset;box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展] [阴影颜色] [投影方式];词解释:blur:模糊 spread:伸展 inset:内凹参数解释:offset-x:必需,取值正负都可。offset-x水平阴影的位置。2.offset-y:必需,取值正负都可。offset-y垂直阴影的位置。blur

2021-03-31 17:56:24 875

原创 jq实现导航吸顶效果

显示效果如下:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"> <title>导航滚动到一定高底后吸顶,锚点定位自动跟

2021-03-31 17:11:48 527

原创 jquery实现电梯导航

<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>楼层导航3</title> <style> * { margin: 0; padding: 0; } #container { width: 900px

2021-03-29 11:27:23 407

原创 正则验证邮箱号

<script> function validEmail(email) { const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ return re

2021-03-29 10:35:33 69

原创 vue2.0和vue3.0的区别

#Vue2.0Vue3.0安装npm install -g vue-clinpm install -g @vue/cli项目创建vue init webpack 项目名vue create 项目名(项目名需小写)运行npm run devnpm run serve配置webpack.config.js(自动添加)vue.config.js(手动添加)路由模式配置const router = new VueRouter({mode:“histor...

2021-03-26 17:06:13 338 1

原创 js封装获取地址栏中?后面的参数

以下这是我测试的路径<script> function getUrlPramas(pramas) { //定义一个空对象来存储路径中获取的参数 var object = {}; //1.获取?后面的所有内容包括问号 var url = decodeURI(location.search); //?name=嘻嘻&hobby=追剧 // 2.

2021-03-26 16:16:14 417

原创 js封装时间函数转换成任意日期格式(升级版)

<script> function timeTemp(value,fmt){ var date = new Date(value); var o = { "M+": date.getMonth() + 1, //月份 "d+": date.getDate(), //日 "h+": date.getHours(), //小时

2021-03-26 15:03:43 128

原创 vue实现全局(局部)日期过滤器(任意格式)

1.全局时期过滤器<script> Vue.filter('formaDate2', function (value, fmt) { var date = new Date(value); var o = { "M+": date.getMonth() + 1, //月份 "d+": date.getDate(), //日 "h+": date.ge

2021-03-26 14:48:03 3435 1

原创 jq实现下拉框的change事件获取选中的值

jq获取选中的value值 <select name="" id="sel"> <option value="" selected hidden>请选择输入方式</option> <option value="电话">电话</option> <option value="微信">微信</option> <option value="QQ">QQ</option> <opti

2021-03-26 11:41:06 2755

原创 封装时间戳转换成时间格式(基础版)(如:YYYY-MM-DD hh:mm:ss)

1.时间戳转成对应自定义时间格式(如:YYYY-MM-DD hh:mm:ss)<script> function timeStamp(t){ let date = new Date(t) let Y = date.getFullYear(); let M = date.getMonth()+1 <10 ? '0' + date.getMonth()+1 :date.getMonth()+1; let D = date.getDate() <10 ? '0' + d

2021-03-26 10:48:31 678

原创 css设置文本超出显示省略号

1.单行文本超出隐藏显示省略号注意:包裹内容的盒子必须设置一定的宽度并且强制不换行<style>p{ border:1px solid skyblue; width:150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }</style>2.多行文本超出隐藏显示省略号<style> p { bo

2021-03-25 18:00:42 245

原创 CSS中white-space属性

white-space 规定段落中的文本是否进行换行:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=

2021-03-25 17:16:01 345

原创 css中overflow属性的使用

如果元素中的内容超出了给定的宽度和高度属性,overflow 属性可以确定是否显示滚动条等行为。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-w

2021-03-25 16:55:19 229

原创 html中css清除浮动的四种方法

清除浮动的原因就是让两个及两个以上的元素显示在同一排; <style> *{ margin:0; padding:0; } .outBox{ border:2px solid pink; font-size:20px; color:#fff; font-weight: bold; }

2021-03-25 15:11:22 232

原创 深拷贝的两种方法

<script> function deepClone(obj){ let objClone = Array.isArray(obj)?[]:{}; if(obj && typeof obj==="object"){ for(key in obj){ if(obj.hasOwnProperty(key)){ //判断ojb子元素是否为对象,如果是,递归复制 i

2021-03-24 12:08:23 110

原创 JavaScript页面刷新的方法

1,reload方法该方法强迫浏览器刷新当前页面。语法:location.reload()2,replace方法当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL。语法: location.replace(URL)返回并刷新页面:location.replace(document.referrer);document.referrer //前一个页面的URL不要用 history.go(-1),或 history.back();来返回并刷新页面,这两种方法

2021-03-24 11:10:19 310

原创 vue中watch的使用

1.通常情况使用如下:<input type="text" v-model.lazy="userName" />watch: { userName (newName, oldName) { console.log(newName) }}lazy的作用,在enter键按下或者失去输入框失去焦点后触发此方法的缺点:当值第一次绑定的时候不会执行监听函数,只有当值改变的时候才会执行;需求:如果我们想在第一次绑定的时候就执行此监听函数,则需要设置immediate为true.应用场

2021-03-23 11:56:10 623

原创 文件下载

1.html <button type="button" class="downloadBtn" data-text='国产非特殊化妆品检测项目清单.pdf' data-name="国产非特">点击下载检测项目清单</button> <button type="button" class="downloadBtn" data-text='国产特殊化妆品检测项目清单.pdf' data-name="国产特">点击下载检测项目清单</button>

2021-03-19 17:09:13 49

原创 js倒计时实现方式第一种

效果图如下:<!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"> <titl

2021-03-19 15:59:47 70

原创 获取浏览器窗口(window)的宽高

以下三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。1.对于Internet Explorer、Chrome、Firefox、Opera 、 Safari: 浏览器窗口的内部高度: window.innerHeight 浏览器窗口的内部宽度: window.innerWidth2.对于 Internet Explorer 8、7、6、5:浏览器窗口的内部高度:document.documentElement.clientHeight浏览器窗口的内部宽度:d

2021-03-18 11:23:35 17665 1

原创 vue中实现表格导出

1.安装npm install -S file-saver xlsxnpm install -D script-loader2.下载excel包(在utils文件夹中放入excel)链接: https://pan.baidu.com/s/1QkBmaLBLl9bqGNITjkma3Q 提取码: 2ycf3.在需要的页面中使用首先给按钮绑定一个点击事件其次书写相应的js代码<script>export default { name: "excel", data()

2021-03-17 17:34:09 153

原创 vue中使用noprogress插件

nprogress 插件是在页面刷新和跳转时出现在浏览器顶部的进度条,它会随着页面的加载而显示进度状态。效果图如下:(点击时候红色闪动部分就是效果图,特意样式为红色方面查看)1.首先安装npm install --save nprogress2.在utils中创建一个nprogress.js文件import router from '@/router'import NProgress from 'nprogress'import 'nprogress/nprogress.css' //

2021-03-12 16:08:49 1132

原创 线上项目使用插件babel-plugin-transform-remove-console来移除控制台的console.log()

1.安装 npm install babel-plugin-transform-remove-console --save-dev2.在babel.config.js中进行使用(此种方法会移除开发环境的输出,不便于本地测试,不推荐!!!)3.进一步优化通过process.env.NODE_ENV === 'production’来进行判断是否为线上环境来进行添加此插件...

2021-03-12 11:46:21 433

原创 隐藏浏览器控制台输出async-validator验证警告

报错提示如下图:解决方法:只需将一下目录的输出注释掉然后重启项目即可亲测有效。。。

2021-03-12 11:09:50 719

原创 vue中使用表格树插件vue-table-with-tree-grid

效果图如下:使用步骤如下:1.下载npm i vue-table-with-tree-grid -S2.在main.js中引入并全局注册import treeTable from ‘vue-table-with-tree-grid’Vue.component(‘tree-table’,treeTable)3.使用 <tree-tabl></tree-table>查看参数地址数据结构如下图:...

2021-03-11 10:05:42 517 1

原创 vue中使用vue-ueditor-wrap富文本

1.首先通过官网进行euditor的下载(我下载的是最版本1.4.3.3) 下载地址2.将下载好的压缩包解压(目录如下:)3.进入解压的目录安装依赖包 npm install(此步骤必不可少)4.安装grunt(npm install -g grunt-cli)然后命令行运行 grunt default 构建会生成一个dist文件夹(此步骤必不可少,非常重要,否则目录结构下不会有dist文件夹生成!!!)目录结构如下:5.将生成的dist文件夹下的utf8-php进行重命名修改后的

2021-03-10 15:43:52 3917 3

原创 vue中使用富文本

效果图1.npm i vue-quill-editor --save2.在main.js中引入// 引入富文本插件import VueQuillEditor from 'vue-quill-editor'// 引入富文本样式import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'// 使用富文本Vue.use(VueQuillEdito

2021-03-09 17:45:41 140

原创 vue中使用loadsh实现对象的深拷贝

1.首先安装npm i --save lodash官网链接(https://www.lodashjs.com/)2.引入2.1 在全局引入(main.js)import _ from ‘lodash’2…2 在单个组件中引入import _ from ‘lodash’3.使用

2021-03-09 17:30:15 451

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除