![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
总结
技术林
前端开发 基础知识分享
展开
-
js数组方法 改变原数组和不改变原数组的方法整理
改变原数组:pop():删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不 改变数组,并返回 undefined 值。arrayObject.pop()*push():*push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject,而不是创建一个新的数组,arrayObject.push(newelement1,newelement2,….,newelementX)reverse原创 2020-11-19 10:39:55 · 2028 阅读 · 0 评论 -
前端时间格式转换的几种办法
https://www.cnblogs.com/mr-wuxiansheng/p/6296646.html原创 2020-10-19 15:54:15 · 2024 阅读 · 0 评论 -
Validate表单验证
validate一、 validate的使用步骤引入jquery.min.js引入 jquery.validate.js页面加载后对表单进行验证 $("#表单id名").validate({}) 在validate中的rules中编写验证规则(格式如下)字段的name属性:“校验器”(tisps:一个输入框只有一个校验器的时候使用字段的name属性:{校验器:值,校验器:值}(tips:输入框需要有多个校验器的时候使用)在validate中的messages中编写提示信息(tips格式与ru原创 2020-10-15 14:04:26 · 326 阅读 · 0 评论 -
如何在vue项目中引入防抖节流插件
安装npm install throttle-debounce --save引入(哪里需要引哪里)节流import { throttle } from ‘throttle-debounce’; const throttleFunc = throttle(1000, false, (num) => { console.log('num:', num);}); // 也可以这样使用,因为默认情况下,是falseconst throttleFunc = throttle(原创 2020-10-14 20:53:43 · 2346 阅读 · 0 评论 -
vue实现 tab切换 结合element ui
1.顶部tab切换需求:1-1添加默认值1-2二级属性的动态样式思路:V-model ,实现默认值;将二级菜系作为路由,点击时传参,并判断是否对应从而,实现动态样式的切换;解决办法:activeName: ‘1’,//切换卡,默认为第一个 v-model=”activeName”isActive:’’,//动态样式 默认为空每个二级菜系都是一个路由,添加属性:to=”{query:{classify:fenlei.type}}”数据:Fenlei.type= 1-1/1-2/2-1…原创 2020-10-14 09:11:21 · 614 阅读 · 0 评论 -
js 处理方法 之 reduce( ) 重点 以后项目中会用于处理数据 累加器 可以把你传递的参数累加起来
reduce()方法用于对数组中的所有元素调用指定的回调函数,该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供它有两个参数,一个是函数,一个时初始值原创 2020-10-13 07:56:19 · 167 阅读 · 0 评论 -
vue $watch监听属性之 监听函数 handler() 以及 immediate:true立即执行
vue watch 属性handler 方法就相当于普通侦听器触发的事件,即:当数据变化时要执行的操作例如:点击路由,跳转的时候传递参数,监听到参数变化实现动态切换路由样式immediate:true 立即执行 :当刷新页面时会立即执行一次handler函数使用场景:不加immediate:true 在tab切换时,你已经选中了2-1,当你刷新页面时,选项会回到默认位置1-1加immediate:true 在tab切换时,你已经选中了2-1,当你刷新页面时,选项仍在在2-1位置原创 2020-10-12 20:19:55 · 6661 阅读 · 0 评论 -
js 方法 find( )用法详解
定义和用法find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。find() 方法为数组中的每个元素都调用一次函数执行:当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。 如果没有符合条件的元素返回undefined注意: find() 对于空数组,函数是不会执行的。注意: find() 并没有改变数组的原始值。实例获取数组中年龄大于 18 的第一个元素<!DOCTYPE html><html&原创 2020-10-08 20:00:42 · 14715 阅读 · 2 评论 -
JavaScript学习笔记之 Js对象 日期对象 Math对象 DOM对象 BOM对象
一、Object类型概述:到目前为止,我们使用的引用类型最多的可能就是Object 类型了。虽然Object 的实例不具备多少功能,但对于在应用程序中的存储和传输数据而言,它确实是非常理想的选择。创建Object 类型有两种。一种是使用new 运算符,一种是字面量表示法。1.使用new 运算符创建Object var box = new Object(); //new 方式 box.name = '李四'; //创建属性字段 box.age = 28原创 2020-10-05 08:28:12 · 192 阅读 · 0 评论 -
js 事件学习笔记 javaScript 点击事件 键盘事件 鼠标事件
事件概述:事件三要素:事件源:被监听的html元素(就是这个事件加给谁),就是某个(某些)html标签事件类型:某类动作,例如点击事件,移入移除事件,敲击键盘事件等执行指令:事件触发后需要执行的代码,一般使用函数进行封装 语法格式:事件源.事件类型=执行指令常用的事件案例:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>原创 2020-10-05 08:18:08 · 174 阅读 · 0 评论 -
js 函数 轮播图案例
函数是命名的独立的语句段,这个语句段可以被当作一个整体来引用和执行:格式:function 函数名(形式参数){函数体}调用函数:函数名(实际参数);//声明一个函数function get(a,b){ console.log(a,b)}get(3,4)//调用注意:1、函数只有被调用后才会执行2、如果函数需要返回值、直接使用return 返回<script type="text/javascript"> // 定义一个函数 : function f原创 2020-10-04 20:58:46 · 213 阅读 · 0 评论 -
js for循环 循环结构 while、do-while. for 使用for循环实现99乘法表
1.for循环for(循环变量赋初值;循环条件;循环变量增值){循环语句;}2.while循环while(循环条件){循环体;}3.do…while 循环do{循环体;}while(循环条件);console.log(…); 以日志的形式在控制台输出结果!<script> // 需求 : 统计 1~100 之间能够被3和7整除的数字个数 var count = 0; // 1. 遍历 1~100 之间的所有整型数值 for (原创 2020-10-04 20:38:07 · 678 阅读 · 0 评论 -
(超详细)javaScript 基础知识点笔记总结
11.关系(比较)运算符 大于等于 >= 小于 < 小于等于 <= 不等于 != == 等于(只比较内容) === 恒等于(比较内容的同时还要比较数据类型)注意:关系运算符返回的结果只有两个:true / false<script> // 请问1 : 3 > 5, 结果为 ? alert(3 > 5); // false // 请问2 : “22” == 22 结果为 ? alert("22"原创 2020-10-04 20:32:29 · 582 阅读 · 0 评论 -
js是什么,javaScript基础入门
1、概述:JavaScript是目前web开发中不可缺少的脚本语言,js不需要编译即可运行,运行在客户端,需要通过浏览器来解析执行JavaScript代码。诞生于1995年,当时的主要目的是验证表单的数据是否合法。JavaScript本来应该叫Livescript,但是在发布前夕,想搭上当时超热的java顺风车,临时把名字改为了JavaScript。(也就是说js跟java没有关系,当时只是想借助java的名气)。js由3部分组成:(1)核心(ECMAScript):这一部分主要是js的基本语法原创 2020-10-04 20:19:09 · 2147 阅读 · 0 评论 -
css动画-animation各个属性详解
css3的animation很容易就能实现各种酷炫的动画,虽然看到别人的成果图会觉得很难,但是如果掌握好各种动画属性,做好酷炫吊炸天的动画都不在话下,好,切入正题。一、动画属性:动画属性包括:①animation-name,②animation-duration,③animation-timing-function,④animation-delay,⑤animation-iteration-count,⑥animation-direction,⑦animation-fill-mode,⑧原创 2020-10-04 19:25:51 · 11377 阅读 · 1 评论 -
VUE过滤器
文章目录过滤器注册过滤器全局过滤器局部过滤器实例过滤器过滤器是一个使用在 双大括号插值 和 v-bind 中,用于过滤输出内容的函数假设有一个用于把内容转为大写的过滤器函数 toUpperCase{{content|toUpperCase}}| : 管道符,表示数据从左至右通过管道符进行传递过滤器可以有多个,执行顺序从左至右,过滤器函数第一个参数的值就是其管道符前一个的结果注册过滤器全局过滤器Vue.filter('过滤器名称', 过滤器函数);局部过滤器Vue.compone原创 2020-10-04 11:50:54 · 110 阅读 · 0 评论 -
(图文)一看就懂的CSS 浮动 float 属性详解
声明:本文属于搬砖大神的文章到自己的博客上,原文地址为:https://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html很早以前就接触过CSS,但对于浮动始终非常迷惑,可能是自身理解能力差,也可能是没能遇到一篇通俗的教程。前些天小菜终于搞懂了浮动的基本原理,迫不及待的分享给大家。写在前面的话:由于CSS内容比较多,小菜没有精力从头到尾讲一遍,只能有针对性的讲解。如果读者理解CSS盒子模型,但对于浮动不理解,那么这篇文章可以帮助你。原创 2020-10-04 11:24:59 · 343 阅读 · 0 评论 -
css定位详解
CSS中的定位使用来布局的熟练应用对页面美化有很好的帮助,下面就进行详细介绍:定位分为静态定位,相对定位,绝对定位,固定定位这四种,定位有不同的参数,例如:left、right、top、bottom、z-index等。1、静态定位(static)一般的标签元素不加任何定位属性都属于静态定位,在页面的最底层属于标准流。2、绝对定位(absolute)绝对定位的元素从文档流中拖出,使用left、right、top、bottom等属性相对于其最接近的一个最有定位设置的父级元素进行绝对定位,如果元素的父级没原创 2020-10-04 11:04:47 · 123 阅读 · 0 评论 -
css盒模型
1.什么是盒子模型盒子模型是CSS样式修饰之后一个元素占用整个HTML页面的空间大小操作方式存在外边距,边框,内边距和元素本身2.边框、内外边距的界限border-width:边框宽度border-style:边框样式solid 实线 double 双实线/空心线dashed 虚线 dotted 圆点虚线border-color:边框颜色border: 边框宽度, 边框样式, 边框颜色;例如: border: 10px solid black; <style>原创 2020-10-03 16:15:14 · 281 阅读 · 2 评论 -
如何给你的标签添加样式 ?怎么选择你要添加样式的标签 css 选择器
根据W3C定义CSS3 选择器: 在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。基础选择器层次选择器伪类选择器伪元素选择器属性选择器【基础选择器】元素选择器(选择元素名) \ 如:p{color:red;}ID选择器(#号+ID名)\ 如:#csdn{color:black;}类选择器(.+class名) \ 如:.csdn{color:blue;}通配符选择器(选择全部元素,不建议使用)\如:* {color:green}并集选择器/组合选择器(多个不同的标.原创 2020-10-03 16:06:41 · 2239 阅读 · 0 评论 -
HTML标签大全
文本<h1>...</h1>标题字(最大)<h6>...</h6>标题字(最小)<b>...</b>粗体字<strong>...</strong>粗体字(强调) (同上效果略同)<i>...</i>斜体字<em>...</em>斜体字(强调)<dfn>...</dfn>斜体字(表示定义)<u>...</u&g原创 2020-10-03 11:54:27 · 68 阅读 · 0 评论 -
vue路由设置高亮模式的时候默认路由一直是高亮,切换别的路由也还是高亮的解决办法
vue路由设置高亮模式的时候默认路由一直是高亮,切换别的路由也还是高亮的解决办法在使用vue-router高亮 样式 .router-link-active 的过程中我发现,设置完这个属性有一个bug,那就是当我们切换路由的时候首页一直处于高亮状态,如下图:悬系小说是我的默认子路由,所以会出现它一直高亮的状态.解决办法 是给默认子路由添加 exact 属性就好了如果对你有用,不要吝啬您的点赞哦!您的支持就是我前进的动力!...原创 2020-09-28 09:19:11 · 1023 阅读 · 0 评论 -
vue 在组件上使用v-model
vue 在组件上使用v-model首先我们先搞清楚为什么要在组件上使用v-model?原因:在实际的项目中,我们经常会遇到父组件和子组件共用一个参数的情况,想一下通常我们会怎么处理呢?这时候你会想到组件之间的传参,父传子,子再传给父,谁需要就通过props 或者$emit()方法实现传参,这时候你会发现你的组件上绑定了一大堆的事件监听器,看起来非常的复杂,你有更好的办法改变这种情况吗?让你的代码看起来更简洁!你没有不要紧,vue 都为你准备好了!!!那到底怎么在组件上使用这个v-model 呢?不原创 2020-09-21 20:47:16 · 1968 阅读 · 0 评论 -
vue slot <slot>
定义:根据需要在组件中插入一些内容用法:要插入内容写在组件标签内,<slot></slot>标签写在组件template模板中例如,我们在mycom 组件中想添加一些内容的时候,我们可以使用插槽Vue.component('pagenation-link', { template: ` <div> <slot name="header"></slot>原创 2020-09-21 17:21:49 · 129 阅读 · 0 评论 -
vue 实现组件之间通信的三种方式
vue的组件传值分为三种方式:父传子、子传父、非父子组件传值父子组件的关系可以总结为 prop 向下传递,事件向上传递父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消息,如下图所示:下面我们就开始用代码详细的介绍vue组件传值的三种方式1、父传子子组件的代码:<template> <div id="container"> {{msg}} </div></template><script原创 2020-09-21 08:28:36 · 228 阅读 · 0 评论 -
vue v-on修饰符
**事件修饰符: 1. .stop:阻止事件继续传播,即阻止事件冒泡行为 2. .prevent:阻止本来应该发生的事件,转而执行我们自己定义的事件 例如:阻止a 链接href 跳转,去执行我们定义的事件 3. .capture: 变为捕获事件,事件由外向内触发 (修饰符要写在外层) 4. .once :一次性事件修饰符 加上此修饰符之后相应的函数只能触发一次,无论你点击多少下,函数就只触发一 5. .self修饰符 ...原创 2020-09-16 09:19:55 · 174 阅读 · 0 评论 -
vue指令 v-html 和 v-text 的用法和区别
vue指令 v-html 和 v-text 的用法和区别作用:都是用于渲染页面区别:v-html可以识别html标签并渲染到页面中,而v-text不能识别标签,只可以渲染文本。用法:<div id="app"> <p v-html="html">我是一个p</p> <p v-text="text">我也是一个p</p> </div>new Vue({ el原创 2020-09-10 19:16:40 · 2518 阅读 · 0 评论