![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
Tansum
Hello world!
展开
-
动态添加的新元素没有绑定旧元素的事件
原来的绑定方式—————动态添加的新元素不会绑定原本定义的事件,$("[name='provinceCode']").change(function(){ //具体操作});改成下面这种方式,原来的元素和动态添加的新元素都能绑定事件$("#insertDataDiv tbody").on("change","[name='provinceCode']",function(){ //具体操作});其中,$("#insertDataDivtbody")选择器是要绑定..原创 2021-04-23 14:52:17 · 254 阅读 · 0 评论 -
vue的npm run dev和npm run build
参考:https://www.jb51.net/article/154579.htm npm run dev npm run build 执行的文件 npm run dev 执行的文件build/dev-server.js文件。 build/dev-server.js文件,执行了: 1.检查node和npm的版本 2.引入相关插件和配置 3.创建express服务器和webpack编译器 4.配置开发中间件(webpack-dev-midd.原创 2021-04-01 10:59:59 · 862 阅读 · 0 评论 -
邮箱校验错误——带中文句号也能通过校验
我们所要的邮箱校验正则表达式为^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$但下面这种使用方式有错误,会使中文句号也能通过校验:var regExp = new RegExp("^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$");//中文句号也能通过原因:使用构造函数创造正则对象需要进行转义;正确方式:1.构造函数创造.原创 2021-03-23 10:27:39 · 483 阅读 · 0 评论 -
前端HTML拼接时,用onclick等方法传递对象解决办法
方法如下:JSON.stringify(obj).replace(/\"/g,"'")其中,obj为对象例子:html += '<a onclick="setStatus(' + JSON.stringify(obj).replace(/\"/g,"'") +');">设置状态</a>';原创 2021-03-23 09:40:37 · 593 阅读 · 0 评论 -
前端富文本编辑器UEditor的使用(1)——下载、创建demo、ueditor.all.js文件找不到的解决方法
UEditor的使用可以查看:UEditor文档1.下载到官网下载UEditor编辑器:https://github.com/fex-team/ueditorStep1:git clone 仓库 https://github.com/fex-team/ueditor.gitStep2:安装依赖(如果没有安装 grunt , 请先在全局安装 grunt) npm install Step3:在终端执行 grunt default grunt default2.原创 2020-12-30 09:30:33 · 2368 阅读 · 4 评论 -
nginx使用
下载http://nginx.org/en/download.html我选的是下图中所框的版本下载解压好nginx压缩包。直接在cmd窗口,或在nginx文件夹下按shift键+鼠标右键打开Powershell窗口,输入命令启动关闭nginx服务。(不同的是,在Powershell窗口中应在 'nginx' 前加'.\',即 '.\nginx' )以下为部分方法1.启动start nginx2.关闭nginx -s quit //正常(完整有序)停...原创 2020-08-10 17:36:43 · 143 阅读 · 0 评论 -
正则表达式 - 千分位分隔符
若对下文中 ?= 和 ?: 不是很了解的同学可以先看看:正则表达式 ?= ?! 和 ?:下面来看看给数字添加千分位的正则表达式方法:let num = "12345678";console.log(num.replace(/(\d)(?=(?:\d{3})+$)/g,'$1,'))//"12,345,678"让我们来解析一下上面的代码。正则表达式 /(\d)(?=(?:\d{3...原创 2019-11-21 15:18:07 · 8379 阅读 · 0 评论 -
正则表达式 ?= ?! 和 ?:
我们先来看 ?= 和 ?! ,它们的作用如下:?= n 匹配任何其后紧接指定字符串 n 的字符串。 ?! n 匹配任何其后没有紧接指定字符串 n 的字符串。 零宽断言是一种零宽度的匹配,它匹配的内容不会保存到匹配结果中,也不会占用index宽度,最终匹配的结果只是一个位置。零宽断言分为四类正向零宽先行断言(前瞻) exp1(?=exp2) 匹配e...原创 2019-11-20 09:56:09 · 1389 阅读 · 0 评论 -
css实现三角形、圆、椭圆、半椭圆、1/4圆(扇形)
1.三角形如何使用css生成一个三角形呢?首先,先编写一个空元素。<div class="triangle"></div>将该元素除了三角形底边的几个方向的边都设置为透明的即可:.triangle { height: 0; width: 0; border-width: 0 150px 260px 150px; border-styl...原创 2019-11-19 15:13:02 · 2911 阅读 · 0 评论 -
Jquery ajax和Axios区别
Jquery ajax是对原生XHR的封装,除此以外还增添了对JSONP的支持。$.ajax({ type: 'POST', url: url, data: data, dataType: dataType, success: function () {}, error: function () {}});缺点:本身是针对MVC的编程,不符合...原创 2019-11-07 09:22:01 · 1739 阅读 · 0 评论 -
forEach、map和filter的区别
forEachforEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。注意: forEach() 对于空数组是不会执行回调函数的。语法:array.forEach(callback(currentValue, index, arr), thisValue)callback(currentValue, index, arr)必需。 数组中每个元素需要调用的函数。...原创 2019-11-05 17:14:45 · 3794 阅读 · 2 评论 -
防抖与节流
防抖(debounce)频繁触发某事件时,把这些事件合并成一次去执行。即在指定时间内只执行一次回调函数,如果在指定的时间内又触发了该事件,则回调函数的执行时间会基于此刻重新开始计算。以生活中乘车刷卡的情景举例,只要乘客不断地在刷卡,司机师傅就不能开车,乘客刷卡完毕之后,司机会等待几分钟,确定乘客坐稳再开车。如果司机在最后等待的时间内又有新的乘客上车,那么司机等乘客刷卡完毕之后,还要再等待...原创 2019-11-04 10:40:08 · 285 阅读 · 0 评论 -
css预编译的优缺点
什么是CSS预编译?CSS 预编译,就是预先编译处理CSS。它扩展了 CSS 语言,增加了变量、Mixin、函数等编程的特性,使 CSS 更易维护和扩展。CSS预编译的工作原理是提供便捷的语法和特性供开发者编写源代码,随后经过专门的编译工具将源码转化为CSS语法。它从这几个方面提升了CSS开发的效率:增强编程能力;增强可复用性;增强可维护性;更便于解决浏览器兼容性。CSS预编译的核心功...转载 2019-11-03 11:27:02 · 3503 阅读 · 0 评论 -
JavaScript关于函数声明定义的一些代码题
js里面没有函数重载的概念,在其他语言中(如java)java中,可以存在同名函数,只要传入的参数数量或者类型不同即可。在js中,声明了多个同名函数后,后面的函数会覆盖前面的函数。var m= 1, j = k = 0; function add(n) { return n = n+1; } y = add(m); function add(n) { re...原创 2019-10-26 11:40:37 · 333 阅读 · 0 评论 -
元素垂直居中
实现元素水平垂直几种常见的方式:1.若元素是单行文本, 则可设置 line-height 等于父元素高度(即line-height和height的值相同)2.若元素是行内块元素, 基本思想是使用display: inline-block, vertical-align: middle和一个伪元素让内容块处于容器中央。.parent::after, .son{ displa...原创 2019-10-25 11:24:28 · 215 阅读 · 0 评论 -
元素水平居中
实现元素水平居中几种常见的方式:1. 若是行内元素, 给其父元素设置 text-align:center2.若是块级元素, 给该元素设置 margin:0 auto3. 使用绝对定位方式, 以及left:0;right:0;margin:0 auto; 子元素设置如下:.son{ position:absolute; width:固定; left:0;...原创 2019-10-25 10:54:28 · 293 阅读 · 0 评论 -
函数中this的绑定
函数中的this总指向调用它的对象。默认绑定当一个函数没有明确的调用对象的时候,也就是单纯作为独立函数调用的时候,将对函数的this使用默认绑定:绑定到全局的window对象。凡是函数作为独立函数调用,无论它的位置在哪里,它的行为表现,都和直接在全局环境中调用无异。//1function fire () { console.log(this === window)}fir...原创 2019-10-17 11:47:55 · 201 阅读 · 0 评论 -
Object.defineProperty()
参考:Object.defineProperty()Object.defineProperty(obj, prop, descriptor)方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。该方法允许精确添加或修改对象的属性。通过赋值操作添加的普通属性是可枚举的,能够在属性枚举期间呈现出来(for...in 或 Object.keys 方法), 这些属...原创 2019-10-16 09:45:55 · 84 阅读 · 0 评论 -
一些代码题
1.暂时性死区var a = 1;function test(){ console.log(a); let a = 2;}test(); //ReferenceErrorlet x = 10;let foo = () => { console.log(x); let x = 20; x++;}foo(); //抛出 ReferenceErro...原创 2019-10-17 20:38:57 · 1141 阅读 · 0 评论 -
jQuery中on()、delegate()、live()、bind()的区别
自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。live() 方法在 jQuery 版本 1.7 中被废弃,在版本 1.9 中被移除。on()on() 方法在被选元素及子元素上添加一个或多个事件处理程序。使用 on() 方法添加的事件处理程序适用于当前及未来的元素(比如由脚本创建的新元素)。如需移除事...原创 2019-05-11 12:03:19 · 208 阅读 · 0 评论 -
找不到dev-server.js文件,vue如何更改端口号
在网上看教程,vue-cli更改端口号是在build文件夹下的dev-server.js中修改port,将其改为自己所需要的端口号,如将port赋值为8082但是,我在build文件夹下并未发现dev-server.js文件,经过在网上的搜索及我的尝试,终于成功解决了该问题。在根目录下可发现config文件夹,打开文件夹下的index.js文件,我们可以看见如下代码:在这里,将...原创 2019-08-21 21:27:27 · 1333 阅读 · 0 评论 -
Sublime中vue文件的高亮显示及自动补全
实现vue文件自动高亮只需三步:1.ctrl + shift + p2.输入:install Package3.输入:Vue Syntax Highlight然后重启sublime 打开vue文件就可以实现自动高亮了原创 2019-08-21 21:57:49 · 1262 阅读 · 0 评论 -
美团点评一面
9.24,视频面,将近一个小时,面试官小哥哥人还挺好的。不过答得挺烂,hh。记忆力不是很好,昨天抽时间努力回忆了一下面试点(也根本记不清问题顺序了)个人相关:自我介绍,讲一下自己做的项目和项目背景,为什么做前端,问了六级成绩,成绩还可以为什么没有考虑保研(我们学校没有保研hh)/考研。面试点:从输入网址到页面显示的过程 css布局模式?(问瀑布流算不算是,面试官好像说的算) c...原创 2019-09-26 15:43:33 · 215 阅读 · 0 评论 -
雅虎14条优化原则
1.尽可能的减少 HTTP 的请求数 (content) 常用的方法,合并css,js(将一个页面中的css和js文件分别合并)以及Image maps和css sprites等。2.使用 CDN(内容分发网络Content Delivery Network) (server) 通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的cac...原创 2019-09-27 10:33:43 · 231 阅读 · 0 评论 -
HTML5离线储存(应用程序缓存,Application Cache)
参考:https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache在用户没有与因特网连接时,可以正常访问站点或应用,在用户与因特网连接时,更新用户机器上的缓存文件。原理:HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术),通过这个文件上的解析清单离线存储资...原创 2019-10-04 12:08:55 · 360 阅读 · 0 评论 -
["1","2","3"].map(parseInt)问题
["1", "2", "3"].map(parseInt)返回结果是什么?你可能觉的会是[1, 2, 3],但实际的结果为 [1, NaN, NaN]。为什么是这个结果呢?我们先来看看parseInt和map函数吧。parseIntparseInt(string, radix)函数可解析一个字符串,并返回一个整数。参数 描述 string 必需。要被解析的字...原创 2019-10-06 20:31:00 · 264 阅读 · 0 评论 -
JS判断数据类型方法(1)- Object.prototype.toString
1.Object.prototype.toString用来判断类型再合适不过,借用它几乎可以判断所有类型的数据。console.log(Object.prototype.toString.call({}))//[object Object]console.log(Object.prototype.toString.call([]))//[object Array]console.log(...原创 2019-10-08 11:30:39 · 456 阅读 · 0 评论 -
关于setTimeout的一道经典面试题
想必大家都见过这一道经典的面试题:for (var i = 1; i <= 5; i++) { setTimeout(function test() { console.log(i) // 依次输出:6 6 6 6 6 }, i * 1000);}造成这个现象的原因是等到setTimeout异步执行时,i已经变成6了。(不了解的小伙伴可以去看下JS...原创 2019-10-08 15:47:48 · 680 阅读 · 0 评论 -
手写实现call函数
在大厂的面试中,手写实现call,apply,bind(特别是bind)一直是比较高频的面试题,在这里我们先来实现一下call函数。思路根据call的规则设置上下文对象,也就是this的指向。 通过设置context的属性,将函数的this指向隐式绑定到context上 通过隐式绑定执行函数并传递参数。 删除临时属性,返回函数执行结果Function.prototype.myCa...原创 2019-10-08 17:37:20 · 1808 阅读 · 0 评论 -
三个盒子,左右定宽,中间自适应布局
1.左右两侧浮动定位中间利用margin-left margin-right<div style="width:100%; margin:0 auto;"> <div style="width:200px; float:left; background-color:#6FF">左侧内容 定宽</div> <div style="width...原创 2019-10-25 10:46:04 · 986 阅读 · 0 评论 -
事件源的获取
事件源:在事件中,当前操作的那个元素即为事件源。常用3种的事件源获取方法:1.通过id名:document.getElementById("ID名");2.通过标签名:document.getElementsByTagName("标签名");3.通过类名:document.getElementsByClassName("类名");也可通过名称获取:document.getEle...原创 2019-04-14 21:18:05 · 1919 阅读 · 0 评论