- 博客(57)
- 收藏
- 关注
RSS订阅
原创 前端JS部分
1.防抖和节流(性能优化方式之一)防抖作用：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。思路： 每次触发事件时都取消之前的延时调用方法function debounce(fn) { // fn: 需要制定防抖的函数，一般是一个禁止在短时间内重复请求的函数 let timeout = null; // 创建一个标记用来存放定时器的返回值 return function () { clearTimeout(timeout); // 每当用户输入的时候
2022-11-09 10:49:24
1499
原创 JQ实现将div的滚动条滚动到指定子元素所在的位置
function scrollLocation(fater, scrollTo) { // fater.scrollTop( // scrollTo.offset().top - fater.offset().top + fater.scrollTop() // ); // Or you can animate the scrolling: fater.animate({ scrollTop: scrollTo.offset().top -.
2021-11-17 10:48:54
862
转载 vue之回车触发表单提交
操作：在From标签中添加：@keyup.enter.native="handleSubmit"1.若添加在Input标签上，只有聚焦在该input框上有效2.@keyup是触发键盘事件3…enter和.13相同4.加上.native覆盖原有封装的keyup事件5.handleSubmit是提交方法原文链接： https://www.cnblogs.com/s313139232/p/10696474.html...
2021-11-12 13:55:30
1621
原创 element 库 date-picker 的 disabledDate 使用，大于当前日期不可选
html<el-date-picker v-model="birthday" type="date" value-format="timestamp" :picker-options="pickerOptions"></el-date-picker>scriptdata() { return { pickerOptions: { disabledDate: item => {
2021-11-09 16:29:46
1544
原创 jq、js 实现可手动输入搜索input下拉框---手机区号
/* 手机区号 */ .id_areaCode { position: relative; height: 100%;}.areaCode_ul { display: none; position: absolute; width: 4.80rem; height: 4.00rem; z-index: 88; /* margin-top: 30rem; */ /* padding: 0 20rem; */...
2021-10-15 10:32:48
985
原创 计算时间段的各个单位时间的时间戳
时间var date1=new Date(); //开始时间var date2=new Date(); //结束时间var date3=date2.getTime()-date1.getTime() //时间差的毫秒数//计算出相差天数var days=Math.floor(date3/(2436001000))//计算出小时数var leave1=date3%(2436001000) //计算天数后剩余的毫秒数var hours=Math.floor(leave1/(36001000))
2021-10-15 09:43:57
283
原创 vue表单校验报错 Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘indexOf‘)
原因是表单项使用了v-if控制，并且出现两个在了两个正常的 el-form-item 中间的情况。如下：然后在使用 this.$refs[“specialForm”].resetFields(); 重置表单的时候，就会报错解决方案：在 el-form-item 之外包一层 div 用作if判断可避免。......
2021-09-27 10:32:53
24443
4
原创 750px h5设计稿 适配rem
// public/js/rem.jsfunction remSize() { let screenWidth = window.document.documentElement.clientWidth || window.innerWidth; if (screenWidth > 750) { screenWidth = 750; } if (screenWidth < 320) { screenWidth = 320
2021-09-17 16:31:32
528
原创 vue 使用vue-canvas-poster生成自定义海报
<vue-canvas-poster :widthPixels="750" :painting="painting" @success="posterSuccess" @fail="fail"></vue-canvas-poster>widthPixels：最终生成的画布宽度painting： 传参posterSuccess（src）： 成功回调； src是生成画布地址fail： err回调多余的就不截图了，自己去看吧，提供一个文档链接： vue-canvas-p
2021-08-13 15:58:52
1479
5
原创 element-ui el-table组件添加height属性后滚动条被顶下去一截
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-08-13 15:00:00
859
1
原创 时间格式化fun
/**对Date的扩展，将 Date 转化为指定格式的String月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)例子：(new Date()).Format(“yyyy-MM-dd hh:mm:ss.S”) ==> 2006-07-02 08:09:04.423(new Date()).Format(“yyyy-M-d hⓂ️s.S”) ==>
2021-03-25 14:53:29
180
原创 js 防抖
function throttle(func, delay) { var timer = null; var startTime = Date.now(); return function() { var curTime = Date.now(); var remaining = delay - (curTime - startTime); var context = this; var args = arguments; clearTimeout(tim
2020-12-28 11:38:41
130
原创 vscode 插件详解 转自 varHarrie的git
https://github.com/varHarrie/varharrie.github.io/issues/10
2020-11-05 20:57:35
144
原创 vue页面循环生成倒计时
<div class="classroom" v-for="(item, index) in classList" :key="index"> <span v-else-if="item.Timecode == 2">{{getLeftTime(item.countdown,index)}}<i>{{timeList[index]}}</i></span></div>// 页面数组循环，多个倒计时 getLeftTim
2020-08-19 14:40:14
894
原创 jq获取动态生成元素的html和val
动态生成的表单，绑定事件要使用事件委托。不是input框建议使用alt存储应该给value的值，使用attr(“alt”)获取var str = "" for(let i=0; i<res.length; i++){ var tr ="" if(res[i].classFrequency == 1){ tr = "学生定制"}else{ t
2020-07-21 10:48:45
684
原创 JQ一个点击事件控制另外两个radio框切换选中问题
JQ一个点击事件控制另外两个radio框切换选中问题 <div id= "tab"> <input name="cooperation" type="radio" value="1" checked/>自营 <input name="cooperation" type="radio" value="2" />第三方 </div> //这
2020-07-21 10:43:21
748
原创 vue基础 day03 组件
组件 (Component) 是 Vue.js 最强大的功能之一组件可以扩展 HTML 元素，封装可重用的代码组件注册全局注册Vue.component(‘组件名称’, { }) 第1个参数是标签名称，第2个参数是一个选项对象全局组件注册后，任何vue实例都可以用组件基础使用 <div id="example"> <!-- 2、 组件使用 组...
2019-12-23 17:21:23
222
原创 vue 基础方法函数
Vue 实例选项el ："#id" 挂载的元素，视图data：{ name:“zs” }数据methods：{ fn:function(){ 函数体 } } 函数或者方法，函数里面的this指向的是Vue实例对象MVVMM: 模型V: 视图VM：视图模型指令指令的本质就是自定义属性 Vue 里面所有的指令都以 v- 开头v-cload 阻止闪动（页面初加载时会短暂的显示原文本...
2019-12-23 16:47:26
7885
原创 Vue.js day02 vue基础 双向数据绑定、自定义指令、计算属性、侦听器、过滤器、生命周期钩子
day02Vue常用特性表单基本操作获取单选框中的值通过v-model <!-- 1、 两个单选框需要同时通过v-model 双向绑定 一个值 2、 每一个单选框必须要有value属性 且value 值不能一样 3、 当某一个单选框选中的时候 v-model 会将当前的 value值 改变 data 中的 数据 ...
2019-12-14 20:40:55
238
原创 Vue.js day01 vue基础 常用指令、事件与案件修饰符、分支、循环
day01Vue 是什么？Vue 是一套用于构建用户界面的渐进式框架vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合使用Vue将helloworld 渲染到页面上指令本质就是自定义属性Vue中指定都是以 v- 开头v-cloak防止页面加载时出现闪烁问题<style type="text/css"> /* ...
2019-12-14 19:21:04
300
原创 字符串截取方法汇总
一、使用 slice() 截取1，函数说明slice() 方法可通过指定的开始和结束位置，提取字符串的某个部分，并以新的字符串返回被提取的部分。语法如下：stringObject.slice(start, end)参数说明：start（必需）：规定从何处开始选取。如果是负数，那么它规定从字符串尾部开始算起的位置。也就是说，-1 指最后一个字符，-2 指倒数第二个字符，以此类推。e...
2019-12-08 21:32:58
1974
原创 ajax day04 jquery 里面封装的 ajax 跨域方法、restful风格的API
$.ajax<script src = "jquery.min.js"><script>//ajax方法接收一个对象作为参数//对象中包含了很多的属性，这些属性就是用来设置请求信息的$.ajax( { type:"get",//type属性用来设置请求方式，可以设置为get,post，type属性不设置，默认type为get url:"/post...
2019-12-03 20:26:40
151
原创 ajax day03 同源与非同源以及解决方案
ajax请求限制ajax只能想自己的服务器发送请求，即同源的网页同源： 如果两个页面拥有相同的协议、域名和端口，那么这两个页面就属于同一个源，其中只要有一个不相同，就是不同源同源政策的目的： 为了保证用户的信息安全解决同源限制的方法JSONP 方法jsonp 是 json with padding 的缩写，它不属于 Ajax 请求，但它可以模拟 Ajax 请求。jsonp解决方案的原...
2019-12-03 20:00:22
211
原创 ajax day02 进阶使用 模板引擎、表单FormData对象
关于对象的覆盖方法//将对象2中的属性去覆盖对象1中的属性//对象2不会有任何改变，对象1是覆盖之后的效果。//覆盖：如果有同名的属性，相当于同名的属性进行赋值操作//如果对象2中有对象1没有的属性，对象1会添加这个属性。Object.assign( 对象1, 对象2 );模板引擎的使用(1)下载并引入模板引擎的文件<script src="/js/template...
2019-12-03 18:52:40
130
原创 ajax day01基础 ajax 的原理与实现 、get、post 参数请求发送方式
ajax day01概念Ajax：标准读音 [ˈeɪˌdʒæks] ，中文音译：阿贾克斯它是浏览器提供的一套方法，可以实现页面无刷新更新数据，提高用户浏览网站应用的体验。应用场景页面上拉加载更多数据列表数据无刷新分页表单项离开焦点数据验证搜索框提示文字下拉列表运行环境Ajax技术需要运行在网站环境中才能够生效。运行原理Ajax 相当于浏览器发送请求与接收响应的代理人，...
2019-11-30 19:24:00
150
原创 nodejs day04 --模板引擎 express框架
nodejs day041.模板引擎语法A.简洁语法(标准语法){{ name }}解析属性 {{ @content }}B.原始语法(原生语法)<%= name %>解析属性 <%- name %>2.判断语法<!‐‐ 标准语法 ‐‐> {{if 条件}} ... {{/if}} {{if 条件1}} ... {{else if 条件...
2019-11-29 19:20:25
268
原创 nodejs day03 -- 数据库 增删改查
7. 数据库存储数据的仓库。现在比较流行mysql,Oracle,mongoDBmongoDB数据库当中有很多的数据仓库(database)数据仓库中会有很多的集合(collection)集合中包含很多相似的数据，这种数据叫做文档数据(document),文档数据中有一列一列的具体属性，这种属性叫做字段(field)8. 连接数据库//安装第三方模块 mongoose ： npm i...
2019-11-17 20:20:57
184
原创 nodejs day02 package.json文件 服务端开发
nodejs-day021.package.json文件package.json文件就是一个项目信息描述的文件，它用来记录项目的一些基本信息，还有第三方模块的记录信息。如果我们需要自己创建一个全新的项目，也需要创建项目的描述文件package.json在项目文件夹下打开终端，执行命令 npm init -y 就可以生成一个 package.json 文件，文件内容描述如下：{ "na...
2019-11-15 21:13:05
236
原创 nodejs-day01 基础语法 模块化开发
node.js-day011.node到底是什么？node就是一个js代码的运行环境。基于chrome v8引擎的运行环境。2.环境变量path的作用?告诉操作系统有一些目录，这些目录中有需要执行的程序。当我们去执行某些程序的时候(比如说node)，就先到操作系统的默认执行目录中查找这个程序如果没有找到，就继续去path环境变量中查找是否有这个程序可以执行。3.javascript的...
2019-11-14 20:35:16
228
原创 nodejs git
nodeJs git相关代码：git config --global user.name //配置姓名git config --global user.email //配置邮箱git config --list //查看配置信息git init //初始化本地仓库git status //查看文件状态git add 文件名 //添加某个文件到暂存区，如果写 . 代表当前...
2019-11-14 20:02:39
1424
原创 javaScript 高级05 ES6新增的关键字和方法、set集合
javaScript 高级051. ES6ES6的概念：ES6就是ECMAScript，就是脚本语言的标准化体现，2016年之后出现的统称为ES6。学习ES6是大势所趋，它更加方便我们程序员的开发工作。2. ES6新增关键字2.1 letlet 是ES6中新增的声明变量的语法结构： let num（变量名）= 66（值）;特点：不存在变量提升（即页面预加载时的变量、方法声...
2019-11-09 21:22:59
409
原创 javaScript 高级04 正则表达式（边界符、字符类、量词符）
javaScript 高级041. 什么是正则表达式1.1 特点灵活性、逻辑性和功能性强大可以用既简单又迅速的方式控制字符串实际开发可以使用 菜鸟工具或者其他工具复制粘贴1.2 概述正则表达式（ Regular Expression ）是用于匹配字符串中字符组合的模式。在JavaScript中，正则表达式也是对象。正则表通常被用来校验、替换那些符合某个模式（规则）的文本。2....
2019-11-08 20:55:42
714
原创 javaScript 高级03 函数的定义和调用、改变函数this指向、高阶函数、闭包
javaScript 高级031. 函数的定义和调用1.1函数的定义方式方式1 函数声明方式 function 关键字 (命名函数)function fn(){}方式2 函数表达式(匿名函数)var fn = function(){}方式3 new Function()var f = new Function('a', 'b', 'console.log(a +...
2019-11-06 20:32:33
332
原创 javaScript 高级02 原型对象、原型链、继承、ES5的一些方法
javaScript 高级021. 构造函数和对象原型1.1 对象的三种创建方式–复习字面量方式var obj = {};new关键字var obj = new Object();构造函数方式function Person(name,age){this.name = name;this.age = age;}var obj = new Person(‘...
2019-11-05 21:14:41
192
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人