![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Javascript
JLinZen
对We前端非常感兴趣
展开
-
javascript拾荒
document.defaultView:一般情况下,在google浏览器开发者工具的console面板下运行document.defaultView === window,这个是会返回true的。首先,我们得知道defaultView这个属性到底是什么意思呢?查下MDN:在浏览器中,返回与当前document所关联的window对象,如果没有则返回null,而且是一个只读属性。前面说的一般情况...原创 2019-10-14 16:59:01 · 178 阅读 · 0 评论 -
移动开发小记-01
1、 iphone第三方输入法不能监听到keyup, keypress, keydown事件:昨天在工作中遇到的一个小坑,我们在用jQuery绑定一个input框的keyup事件的时候,遇到iphone手机不能监听到的状况,后来仔细排查,发现不能监听到的都是iphone安装了第三方输入法。于是,我们个中百度,stackoverflow之,辗转查询,发现iphone的第三方输入法的问题,在此我们也测试原创 2016-06-29 11:51:20 · 517 阅读 · 0 评论 -
一个订阅发布者模式
常见的订阅发布者模式的编写(function(window) { function Subscribe() { this.events = {}; }; Subscribe.prototype.subscribe = function(eventName, fn) { (!this.events[eventName]) && (this.eve原创 2016-06-15 14:28:21 · 502 阅读 · 0 评论 -
基于rem的响应式布局
rem的布局新见解其实,在写这篇博客之前,我建议大家可以参看这篇文章从网易与淘宝的font-size思考前端设计稿与工作流,我在仔细消化这篇文章后做了一个自己的看法和理解,欢迎交流。像素单位的选择em的没落em的计算与继承:em是基于父元素而来计算的,比如div的parent节点font-size为1.2em,如果我们此时再对div做一个font-size的设置为1.2em,如果1em=12px,那原创 2016-07-02 11:05:32 · 1859 阅读 · 0 评论 -
jQuery中的noConflict机制
一直以来,自己对jQuery的源码研究是中断而又重新再继续,发现自己缺乏好的习惯和坚持,以后对这方面能力还是要多加培养。现在来谈下对jQuery对于多个版本的jquery和同时引用$引起的冲突的处理。其实,对于jQueryAPI比较熟悉的jser应该比较熟悉$.noConflict()。现在让我们看下这个方法的源码:var _jQuery = window.jQuery, //版本冲突 _$原创 2016-07-03 10:04:32 · 325 阅读 · 0 评论 -
javascript框架设计-种子模块一
种子模块种子模块是框架设计中的核心部分,也是框架最先执行的一部分,所以要极具扩展性、稳定性及常用性。常见框架的种子模块至少具有类型拓展、数组化、类型判定、简单事件的绑定与卸载、无冲突处理、模块加载及domReady功能。1、无冲突处理参考jQuery源码,原理:利用临时变量将同命名变量或不同版本同框架(如jQuery版本很多)保存下来,然后使用函数处理控制权。//jQuery noConflict源原创 2016-07-04 23:04:32 · 280 阅读 · 0 评论 -
谈谈Angular指令bindToController的使用(1.4版本后支持)
命名空间、代码的一致性及合适的设计模式在软件工程中是很重要的环节,Angular的出现解决了许多前端工程师所要面临的问题。在此分享下通过在指令中使用bindToController属性来使DOM控制更加专一,保持代码的一致性,同时在controller继承一些数据或构建的时候有更好的设计1、使用ControllerAs 使用bindToController时建议使用controllerAs语法糖配原创 2016-12-10 17:59:02 · 2474 阅读 · 0 评论 -
webpack 配置总结
entry入口文件配置:配置entry入口配置有三种写法,每一个入口称为chunk。 字符串: entry: ‘./index/index.js’: 配置模块会被解析为模块,并在启动时加载。chunk名默认为mian,具体打包文件名视output配置而定。数组: entry: [‘./src/mod1.js’, […,], [./src/index.js]]:所有的模块在启动时按照配置顺序原创 2016-12-11 09:47:10 · 5173 阅读 · 0 评论 -
Javascript高级编程读书笔记一
parseInt与parseFloat方法的区别 parseInt方法是将参数转为number类型的整数类型,支持二进制、十进制、八进制、十六进制的转化,默认为十进制; parseFloat默认是将参数转为十进制的浮点型数值;parseInt、parseFloat方法都是将参数转化为Number类型数据。对于String类型、Boolean类型、Object类型的参数,转化也会有不同。如果是原创 2017-04-11 11:17:43 · 262 阅读 · 0 评论 -
angular最佳实践
1、$scope: 在controller之中,write-only(只写 ) ; 在template中,read-only(只读) ; 2、用ng-bind代替 {{ expr }},bg-bind代替表达式; 3、ng-cloak 防止闪烁,通过在头部样式声明 [ng-cloak] { display: none; } 4、ng-repeat中,如果数据有唯一标识id,用track b原创 2017-04-11 11:20:01 · 511 阅读 · 0 评论 -
underscore中的类型判断
underscore的类型判断类型判断是一个必要的js工具,在实际工作中是必要用到的。那么,如果正确的判断一个对象的类型是很有必要的。当然,这里正确的判断主要是一些浏览器的兼容性问题; 在underscore中,它把基本类型如Object、Array等的原型用一个变量存储,以便快速访问;在类型判断中,underscore主要涉及到:_.isEmpty()_.isElement()_.isAr原创 2017-08-09 23:11:22 · 720 阅读 · 0 评论 -
一行代码求数组的最大值与最小值
在平时的工作及任务中,常会有求数组中的最大值与最小值。现在给出求出数组最大最小值的最便捷方法。 var ArrayMax = function(array) { return Math.max.apply(null, array); }, ArrayMin = function(array) { return Ma原创 2017-07-26 21:38:47 · 755 阅读 · 0 评论 -
Javascript事件与鼠标坐标的属性
在平常的的开发中,多多少少会遇到与鼠标坐标相关的一些需求。比如:在移动端的手势判定、PC端的摇拽拖动的窗体事件等。那么你们是否都了解与之相关的Javascript的Event事件属性呢? 如当我们在点击事件的时候,弹出当前的坐标多少?首先我们要弄明白event.pageX、event.clientX及event.screenX之外,还要弄明白其属性的一些浏览器兼容性问题;在这之前,我们还原创 2017-09-08 23:07:36 · 327 阅读 · 0 评论 -
图片上传预览的几种方式,了解下?
图片上传预览场景基本处处可见,朋友圈发动态配图,身份验证及头像更新,莫过如斯。原由最近在研究twitter PC网站的时候,在个人中心的主页,设置个人的背景图的时候,发现twitter有个非常好的设计,那就是用户在更改背景墙图片的时候,它根本不是先上传图片,而是在本地预览及编辑图片,待用户点击保存后,才上传图片,可以说是非常省流量的啦。然后,我在玩知乎的时候貌似它是先上传,然后预览的,为啥...原创 2019-05-16 18:35:32 · 1042 阅读 · 0 评论 -
jQuery事件详解
原生js事件分析1.1、事件捕获:当某个元素触发某个事件(如onclick),顶层对象document就会发出一个事件流,随着DOM树的节点向目标元素节点流去,直到到达事件真正发生的目标元素。在这个过程中,事件相应的监听函数是不会被触发的。1.2、事件目标:当到达目标元素之后,执行目标元素该事件相应的处理函数。如果没有绑定监听函数,那就不执行。1.3、事件起泡:从目标元素开始,往顶层元素传播。途转载 2016-06-27 12:59:59 · 664 阅读 · 0 评论 -
angular中$emit与$broadcast详解
angularjs 中 broadcast与broadcast 与 emit $on的处理思想对于Angular的controll之间的通信方式,我们可以常见有有几种方式,如可以通过rootScope,还有通过rootScope,还有通过scope的作用域,当然还有一种个人觉得很好的通信方式就是broadcast,broadcast,emit,$on来监听;broadcast方式与broadc原创 2016-05-28 01:08:04 · 9376 阅读 · 1 评论 -
Web前端开发规范
Web前端开发规范一、前端开发规范目的为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改.二、基本准则符合web标准, 语义化html标签;结构、表现、行为三者相互分离, 兼容性优良;页面转载 2014-09-25 09:25:43 · 531 阅读 · 0 评论 -
JS拖拽元素实现
再附上JS,然后我再讲下原理:function getByClassName(className,parent) { var oParent = parent ? document.getElementById(parent) : document, eles = [], elements = oParent.getElementsByTagName('*'); for(v原创 2015-01-29 00:18:07 · 668 阅读 · 0 评论 -
javascript的事件机制
首先,让我们来看一幅图,这样便让我们更加理解JS的事件机制,如图:首先,让我们来举个例子,在两个同心圆中,当我们来点圆心的时候,其实我们点的是两个圆的圆心,那我们如何来区分我们点击是哪个圆的圆心呢?那么联系我们Web里面,在界面上,当我们来点击某个元素的时候,我们又是怎么区分的呢?其实早在IE4与Netscope浏览器之争的时候,他们提出来了两个方案,得到两个完全不同事件概原创 2015-01-30 13:04:27 · 524 阅读 · 0 评论 -
DOM学习
//Node 类型 Node typeNode.ELEMENT_NODE(1); //元素节点Node.ATTRIBUTE_NODE(2); //属性节点Node.TEXT_NODE(3); //文本节点Node.CDATA_SECTION_NODE(4);Node.ENTITY_REFERENCE_NODE(5);Node.ENTITY_NODE(6);Node.PROC原创 2014-12-29 22:22:26 · 468 阅读 · 0 评论 -
Require.js初探(一)
AMD 简介 前端开发在近一两年发展的非常快,JavaScript 作为主流的开发语言得到了前所未有的热捧。大量的前端框架出现了,这些框架都在尝试着解决一些前端开发中的共性问题,但是实现又不尽相同。在这个背景下,CommonJS 社区诞生了,为了让前端框架发展的更加成熟,CommonJS 鼓励开发人员一起在社区里为一些完成特定功能的框架制定规范。AMD(Asynchronous M原创 2015-02-11 11:45:04 · 492 阅读 · 0 评论 -
javascript基础复习
javascript基础复习1、如何判断一个变量是否为数组 有两种方法: (1)if(value instanceof Array) (2) if(Array.isArray(value)) 注意:第二种方法是ECMAScript5新增的方法:支持IE9+,FF4+; 2、数组的方法: Array.push();原创 2015-03-16 22:17:53 · 509 阅读 · 0 评论 -
jQuery.load()的使用
在写jQuery.load()方法之前,先讲一些题外话吧!广州的四月天,有如家里的五月份天气了!难得的是今夜下来一场小雨,让空气中带有一丝凉意。细细想来,工作也快一年了,感觉自己成长了不少,这个成长是建立在一年前。看了许多blog,一些博主在大学就很有建树,还没毕业就已经拿到了BAT或知名IT企业的offer letter,看完心中感慨颇多。现在回想起来,大学四年里我究竟学了多少,用井底之蛙来相容原创 2015-04-29 23:32:19 · 520 阅读 · 0 评论 -
获取时间函数
在Web前端开发中,与Date对象打交道算是很平凡的了,可以说是家常便饭了,所以日期对象是很常用的。这里,菜鸟写了个函数,把后台传过来的时间戳按规定的格式显示出来。其实很简单的,我们可以通过(Date(new Date())).toString()一句就可以得到一个格林威治时间格式字符串。 /** * @Descript: used to format Date like YYYY:MM:DD原创 2015-05-11 21:36:02 · 1335 阅读 · 1 评论 -
Javascript正则表达式学习
其实,正则还是要靠自己多写,这样才能记住那些复杂的规则,推荐MDN的基础篇及正美的博客,希望对你有帮助:列表内容这里写链接内容原创 2015-05-14 21:30:32 · 356 阅读 · 0 评论 -
js回到顶部
今晚,我自己写了一个很简单的回到的顶部的js,同时也希望自己能在原生JS上面有发展,与大家共勉!<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>javascript backToTop</title></head><body> <div style="width:100%;heig原创 2015-05-06 23:26:06 · 364 阅读 · 0 评论 -
异步编程Promise的简单实现
promise模式-那么多中异步编程的方式,为什么选择promise, 因为前面几种方式不够灵活,用起来不够痛快,不优雅。为了降低异步编程的复杂性,所以promise。promise的核心是有一个promise对象,这个对象有一个重要的then()方法, 它用于指定回调函数,如:f1().then(f2); promise模式在任何时刻都有三种状态:已完成(resolved),未完成(unfulf原创 2015-07-31 10:14:42 · 1882 阅读 · 0 评论 -
Backone初探——学生信息管理
Backone初探——学生信息管理-下面是我做的给一个简单的学生信息管理,可以增加学生,删除学生,总体感觉用Backbone思路是最重要的,也就是MVC思想。具体的backboneAPI 可以查看这里:backbone中文API -下面是整个APP页面功能的展示 页面代码-ps:记得自己引用jquery,underscore,backbone的 js库。<html> <head lang原创 2015-07-24 16:46:22 · 870 阅读 · 1 评论 -
Angular手动启动应用
Angular App应用的启动方式自动启动手动启动的原理及注意1、angular的启动是默认检测dom元素是否ng-app属性,如果有ng-app属性,则立即执行angular.bootstrap()函数自行启动应用,不会去检测下一个ng-app。 2、我们可以通过angular.bootstrap()函数来手动启动应用。 例子:自启动应用 <div ng-app>原创 2016-05-25 11:58:00 · 2521 阅读 · 1 评论 -
JavaScript基础01
首先,我们先来看一段代码原创 2014-09-24 22:49:05 · 388 阅读 · 0 评论