L1:Base
主要是和前端们一起分享前端必须要掌握的一些看似基础但却被忽视的细节,掌握这些你才能算是一名合格的前端
朝阳若蓝
专注于HTML5、CSS3、Javascript、JQuery、Vue、Vuex、Axios、ElementUI、React等常见前端技术栈
展开
-
前端开发规范之js
对象成员嵌套越深,读取速度也就越慢。所以好的经验法则是:如果在函数中需要多次读取一个对象属性,最佳做法是将该属性值保存在局部变量中,避免多次查找带来的性能开销。如果vue2中的this.$nextTick(())可以替代setTimeout就尽量替代。代码中使用了定时器setTimeout和setInterval,需要在不使用时进行清除。函数式编程可以让代码的逻辑更清晰更优雅。原创 2024-05-18 14:10:50 · 184 阅读 · 0 评论 -
关于阻止父节点的事件
最近遇到很多人都能遇到的问题,在这里flag下。 就是父节点要触发这个方法,但是其子节点不能触发这个方法,即阻止这个方法。 e.stopPropagation();这一句就可以实现。 $(obj).unbind(“click”).bind(“click”,function(e){ //方法相关执行 e.stopPropagation();//最关键一步...原创 2018-06-01 17:36:55 · 808 阅读 · 0 评论 -
常见的js效果(二)之高德地图的应用
2.其次就是当我点击地图上的点时,得到它的坐标,后台就直接返回地址,我们得到地址之后,如果地址和上面经营地址不一致,就把省市区下拉框里面选中的地址和详细地址替换成现在点击之后的地址,当然也要添加标注。说一下需求,其实根据这个图就知道,当我选择了经营地址的时,下面就会自动定位并标注,当我们点击其他的地址时,经营地址和详细地址就会自动改变。1.首先详细地址键入内容时,得到经营地址和详细地址,如果找到就自动定位到那个地点,并进行标注,如果没有找到,就定位到选择到的省市区,今天我要说的是关于高德地图的应用。原创 2017-09-21 10:21:30 · 3279 阅读 · 1 评论 -
常见的js效果(一)之固定楼层导航栏
项目中遇到比较多的的文档内容,为了方便查找里面的小内容,一般都会在左侧或者右侧放一个固定楼层的导航栏,今天就来说一下这个固定楼层导航栏的思路以及实现的方法。先来看一下效果: 看完效果,相信大家对于这个固定楼层导航栏的意思就略知一二了。确实,我们其实要实现三个功能。其一:固定导航栏滚动到一定位置出现,否则就消失其二:当我们滚动页面的时候,滚动到相应的位置时,相应的楼层导航栏的位...原创 2017-09-20 08:49:36 · 7407 阅读 · 2 评论 -
前端必须要注重的规范(一)之html规范
前端基本上第一课都是需要掌握前端的各种编码规范,但是实际上并不是所有的人都能够在后期的项目开发中明白这一点的,所以需要我们在项目进行中,时刻用这些规范激励自己,进一步地明白这些规范的深层次的意义,从而能够达到灵活自如地运用到工作中。今天我就总结下html的前端规范,包括书写的规范和html标签的使用规范。以及在webstorm中html里可以使用的快捷键<!DOCTYPE h...原创 2017-09-26 11:19:16 · 500 阅读 · 0 评论 -
前端必须要注意的规范(二)之css规范
前一章主要讲了html的规范和html在webstorm里的一些快捷书写方式,这一章主要讲css的规范和书写顺序/* 属性书写顺序,提高代码的可读性 *//* Formatting Model(布局方式、位置) > Box Model(尺寸) > Typographic(文本相关) > Visual(视觉效果) *//* Formatting Model:posi原创 2017-10-08 14:06:00 · 739 阅读 · 0 评论 -
前端必须要注意的规范(三)之js规范
上一章主要讲了css的书写顺序以及一些可以省略精简更优的写法,这一章主要讲述js的一些前端规范////////////// 一.空格/////////////////1.二元运算符必须有一个空格,一元运算符与操作对象之间不允许有空格 var a = !arr.length; a++; a = b + c;//2.用作代码块其实的左花括号 "{" 前必须有一个...原创 2017-10-08 14:11:20 · 743 阅读 · 0 评论 -
看似基础的js基础你却不知道的事(一)
今天主要是来讲讲关于js最底层的基础知识,把握每个细节,做一个真正了解前端的前端。 主要涵盖js数据类型,js对象,数组,字符串,函数,请君侧耳听 一. Js数据类型: Js数据类型分类 明细 基本数据类型 String ,Number,Boolean,Undefined,Null 复杂数据类型 Object,Array,Function...原创 2018-06-20 16:48:55 · 394 阅读 · 0 评论 -
看似基础的js基础你却不知道的事(二)
今天主要是来讲讲关于js最底层的基础知识,把握每个细节,做一个真正了解前端的前端。 主要涵盖属性、变量,提升,比较运算符,块, 请君侧耳听 一.属性1.通过.来访问对象的属性var luke = { jedi: true, age: 28};// badvar isJedi = luke['jedi'];// goodvar isJedi = luke....原创 2018-06-21 13:51:09 · 201 阅读 · 0 评论 -
看似基础的js基础你却不知道的事(三)
今天主要是来讲讲关于js最底层的基础知识,把握每个细节,做一个真正了解前端的前端。 主要涵盖注释,空白,逗号,分号,类型转化,命名规则, 请君侧耳听 一.注释1.使用 /* … / 作为多行注释。包含描述、指定所有参数和返回值的类型和值// bad// make() returns a new element// based on the passed in tag ...原创 2018-06-21 15:08:26 · 243 阅读 · 0 评论 -
前端必须掌握的知识点
老司机要开车啦,拿个小板凳坐好,嗯哼… 1.webstorm是IDE(集成开发环境),不是编辑器 编辑器:首推:VIM(windows上用的叫做GVIM),Brakets 可选:atom,sublime,phpStorm webstorm>file>Power Save Mode如果被选择了,就会自动关闭webstorm的智能提示2.查看本机的ip地址:cmd ...原创 2018-05-18 11:08:32 · 4020 阅读 · 0 评论 -
总结一下项目中常用的正则validate及键盘的一些事件
$(function(){ // 匹配姓名 全英文带空格或者全中文不能英文中文混合 /^([a-zA-Z ]+|[\u4e00-\u9fa5]+)$/ // 只能输入[0-9]数字 /^\d+$/ // 只能输入6位数字 /^\d...原创 2017-08-31 16:08:34 · 496 阅读 · 0 评论 -
js常识之for,for in,$.each进阶
今天主要说说for,for in,$.each的区别,以及三者之优劣。首先说说for循环,顾名思义是只有循环的功能,举个栗子:var data = [{},{},{}];for(var i=0;i<data.length;i++){} 其次说一下for in循环遍历,与for循环相比,更高级的地方是,它多了一个遍历的功能,它主要可以遍历数组或者对象,举个栗子:var data...原创 2018-04-22 10:32:30 · 343 阅读 · 0 评论 -
关于两种定时器的打开关闭和窗口打开关闭
这一章主要讲讲定时器的打开和关闭以及窗口的打开和关闭。 定时器主要分为两种。 其一,setTimeout,在指定时间只执行一次;<script> //定时器 异步运行 function hello(){ alert("hello"); } //使用方法名字执行方法 var t1 = window.se...原创 2018-06-15 15:40:18 · 2235 阅读 · 0 评论 -
常用的一些快捷键
一. webstorm必须要掌握的内容1.查找历史记录VCS > Local History > show HistoryAlt + Shift + c (查看历史记录的快捷方式)Ctrl + E (弹出最近打开的文件)2.让代码自动换行File > Settings > Appearance > 勾选Use Soft Wraps in e...原创 2017-09-14 16:20:35 · 559 阅读 · 0 评论 -
几个小的js问题
遇到几个JS问题,与思路无关,只与写法相关,今天得空,拿出来总结一下:1.第一个不得不说的是我们在做权限勾选或者在做购物车的勾选的时候,全选这种的细节问题2.第二个要说的是JS对象与jquery的对象互转的问题3.表单的序列化提交一.首先来说一下权限勾选的问题。关于权限勾选,我只想说两点:1.原生的判断checkbox是否勾选的方式(有三种) 1)if($(".checkbox...原创 2018-04-09 10:10:03 · 168 阅读 · 0 评论 -
break; continue; return; return false; e.stopPropagation(); e.preventDefault();的联系
阻止循环与阻止事件在我们的工作经常会遇到,如果不能明白其中各自的用法和意义的话,会造成通篇return false的尴尬局面,所以今天我就来说一说这些阻止语句各自的意义。 一 . 先来说说跳出循环的break和continue以及return break:跳出一层循环 如果有多层for循环,break会跳出当前这一层,去执行最外层循环,而不是退出所有层循环;continue...原创 2018-06-22 15:06:40 · 161 阅读 · 0 评论 -
js实现倒计时和jquery实现倒计时
jquery实现倒计时代码:<script src="jquery-1.8.2.min.js"></script><script type="text/javascript">var i=5;$(function(){ setTimeout(function(){ window.location.href=''; ...原创 2018-06-25 13:25:48 · 1558 阅读 · 0 评论