学习zepto.js(原型方法)[1] 新的一周,新的开始,今天来学习一下zepto里边的原型方法,就是通过$.进行调用的方法,也是可以通过$.fn进行扩展的方法: $.camelCase...(本人发现zepto中的原型方法都是通过将匿名函数赋值给变量的方式来进行声明的,而直接使用function声明的函数在外部是获取不到的)解释的不详细，是因为原型方法都有一个原型的引用，而那些普通函数没有做这个引用...高性能JavaScript里边曾经提到过这种写法,一个方法需要做兼容处理时,写成这样会比较节省资源,而不是在方法内部判断并执行,因为用户在使用的过程中不可能更换浏览器(原话忘记了,差不多就是这意思.);.... $.fn: 这个不是一个方法,而是一个对象,指向Zepto对象的prototype,所以说,使用$.extend来使$.fn继承某些方法,进行扩展插件. $.fn.alert = function...);//this指向调用该方法的Zepto对象 } $("hello").alert();//-->hello /*这种是直接给key赋值,如果有多个,须结合$.extend使用
学习zepto.js(对象方法)[4] 今天说说那一套获取元素集合的一些方法: ["children", "clone", "closest", "contents", "empty
学习zepto.js(对象方法)[1] zepto也是使用的链式操作,链式操作:函数返回调用函数的对象....下边介绍的方法都会返回zepto对象; add(): 支持一到二个参数,第一个为选择器,与$()的规则相同,甚至是,第一个参数传进去一个function,它也会正确执行(后果自负- -),所以说,正确的使用方式是传入选择器...forEach方法,这里注意forEach方法传入了第二个参数,第二个参数的用途是设置forEach中this的指向.详情可以看MDN Array.prototype.forEach() 在循环内部,我们使用...Array对象的一系列循环方法第二个参数貌似都是设置函数内部this指向的(没有资料可以证明我说的话,用之前查文档,错了别找我- -) classRE函数是一个使用缓存的动态生成正则对象的函数 ?...直接贴代码.如果第二个参数没有传,就按照有了删,没了填的方案来走,如果第二个参数有值,(有种走后门既视感),则不执行hasClass方法,直接通过when变量的值来决定使用什么方法.
学习zepto.js(对象方法)[2] 今天来说下zepto那一套dom操作方法, ['prepend', 'append', 'prependTo', 'appendTo',...之所以将这八个方法放在一块说,是因为这八个方法是通过循环动态生成的.首先要先会用,才可以去试着了解内部结构.了解完了以后,你会发现,你会很熟练的使用它; ? ?..._(下划线),表示在该函数中并未使用到,但必须要占位(某群某大神就是这么干的),注意数组中存储的, 只有四个值(四个将参数插入至对象中的方法名[就叫它主动方法吧,原创名字,可以随意使用,不受任何版权约束...insertBefore方法, 顺便说一下原生的insertBefore方法使用方式....售票处.insertBefore(李四,张三); 思考一下为什么要这么做. after 首先after是第一个,after是外部的操作,而且是插入到当前调用的对象的后边, 要想使用insertBefore
学习zepto.js(原型方法)[2] 接着昨天的来,继续说原型方法,昨天的传送阵(昨天出了点小意外,博文经过WP手机的UC浏览器进行编辑后标签就露出来了- -,现已修复);
学习zepto.js(Hello World) Zepto是一个轻量级的针对现代高级浏览器的JavaScript库， 它与jquery有着类似的api。...昨天听说了zepto.js,正好最近也比较闲,所以就学习一下这个著名DOM操作库,由于本人刚接触这个,但又不想单纯的说如何使用,所以本人会按照API顺序来说明方法如何使用并试着将对于源码的理解写上来;...$(): 与jQuery的$()几乎一样,但zepto的选择器是直接使用的原生querySelectorAll(),所以,一些jQuery自定义的选择器是不支持的,但可以添加selector.js...id:'span-ele', css: { color: 'red' } })/*创建一个id为span-ele,显示值为hello,红色的span标签*//*以上为作为选择器的使用方法
学习zepto.js(对象方法)[3] 继续说zepto里attributes的相关操作. attr,removeAttr,prop这三个方法....对象 $("").attr("id","special"); //--> [] 第二个参数也可以传入一个function,有两个参数可以使用...那是zepto.js中文api中所说的.本人认为,在判断有关交互的属性时,应优先使用prop,比如checked和selected; ? ? 之所以为出现差异,是因为两者底层实现的区别. ?...则说明不是节点对象.直接返回undefined —-否则就从调用该节点的getAttribute方法,并赋值给result变量. name in this[0] 这个表达式返回一个bool值.同时将result使用
学习zepto.js(对象方法)[6] first: 获取当前对象集合中的第一个dom元素。...slice就是[].slice(); 使用get并且不传入参数的对象前后变化图： ? has: 传入参数为一个选择器字符串或者一个节点，返回的是对象集合中子节点包含参数的对象。...可以传入一个参数，作为选择器筛选； 参数只能是一个选择器字符串； 返回的集合不会出现重复的元素； 如果想取出元素的直接父节点，使用parent； 如果想取出第一个符合筛选条件的父节点，使用closest...").parents(); // 获取所有p标签的所有父节点 $("p").parents(".ads"); // 获取所有p标签的所有父节点className包含ads的节点 //使用...方法首先声明一个数组用于存放dom元素，将this赋值给nodes变量； 使用一个while循环，条件为nodes.length > 0； 在循环内部，通过$.map给nodes进行赋值，map方法内部将
学习zepto.js(对象方法)[5] clone: 该方法不接收任何参数,会返回对象中的所有元素集合,但不会对象绑定的事件. var $temp =$("div").clone...而且使用的深度克隆,就是说,会将节点下方的子节点统统克隆过来....hello world <script type="text/javascript" src="js/<em>zepto.js</em>...zepto对象; contents: contents用来获取zepto所有对象的子节点（包括文本，注释），或者zepto某对象为一个iframe时，则获取该iframe的document对象引用； 直接<em>使用</em>
我们简单回顾下如何使用zepto的这三大功能。...为了直接切入不易理解，我们先来看看zepto中是如何给基础的zepto.js模块添加功能的 首先看看zepto.js模块 var Zepto = (function () { // xxxx var...xxxx })() window.Zepto = Zepto window.$ === undefined && (window.$ = Zepto) 尽量删除了一些不必要的代码，可以看到我们平时使用的...而$.fn就是其原型 如何给zepto.js模块增添功能 zepto.js模块只有一些基础的功能，比如给dom添加事件的功能就没有，怎么添加呢？...因为我们知道$()函数的使用方式有很多，有些方式得到的zepto对象是没有选中dom节点的) 最后还有一个else分支，这个分支处理走的不是手动触发事件，而是直接触发注册事件时添加的事件处理程序(因为这里涉及到
先了解设计模式 创建插件，扩展 四、移动端简单网页案例 1.移动端案例介绍 ajax请求，dom节点渲染，事件绑定 2.项目目录结构 后端代码-node.js lib-逻辑方面，views存放一些模板 前端代码-zepto.js
注意超过 2 个参数的查询封装，禁止使用 Map 类来传输。 那么我们需要思考以下几个问题： 为什么需要这些分层领域模型？ 实际开发中每种分层领域模型都会用到吗？...此对象在实际使用中有不同的理解，有的团队采用领域驱动设计，BO 含有属性和方法（具体可参考领域驱动设计的相关图书）；有的团队将 BO 当做 Service 返回给上层的 “专用 DTO” 使用；而有的团队则当做...使用不同的分层领域模型能够让程序更加健壮、更容易拓展，可以降低系统各层的耦合度。 分层模型的优势只有在系统较大时才体现得更加明显。...DAO 层一般插入和更新的参数对象使用 DO 或 Param, 查询参数一般使用 Query，删除参数一般使用 Param。...实践分层领域模型能够提高项目的健壮性、可拓展性和可维护性，降低了系统内部各层的耦合度。 上面只是给出一种参考，很多团队对部分分层模型的理解会有差异，实际的使用过程中根据自己团队的规模可以适当变通。
这篇文章讨论领域驱动设计(DDD)，DDD是建立在面向对象分析设计上开发软件的一种方法。 通过这篇文章我们解释什么是领域驱动设计，在现代开发周期中如何实现，使用DDD的优点和缺点。...换句话说,在软件开发中,领域指的是”应用程序逻辑范围的知识和活动” 另一个在软件开发中常使用的术语是领域层或领域逻辑，对于开发者来说，说成是业务逻辑或许应该会更加熟悉。...构建块 领域驱动设计同样也定义了几个连接领域模型的高层次概念，以此来修改，创建领域模型。 .Entity（实体）：连续状态变化的对象，而不是传统使用属性来定义的对象。...领域驱动设计优点 .沟通简单：团队成员使用与领域模型相关的统一语言来沟通会更加容易。...领域驱动设计的缺点 .需要精力充沛的领域专家：即使有最精通技术的开发人员，如果团队内没有一个知道应用程序使用领域相关的领域专家，那也是没有意义的。
发布领域事件 在使用领域事件时，我们通常采用“发布-订阅”的方式来集成不同的模块或系统。...在单个微服务内部，我们可以使用领域事件来集成不同的功能组件，比如在上文中提到的“用户注册之后向用户发送欢迎邮件”的例子中，注册组件发出一个事件，邮件发送组件接收到该事件后向用户发送邮件。 ?...在微服务内部使用领域事件时，我们不一定非得引入消息中间件（比如ActiveMQ等）。...另外需要注意的是，在限界上下文之内使用领域事件时，我们依然需要遵循“一个事务只更新一个聚合根”的原则，违反之往往意味着我们对聚合根的拆分是错的。...即便确实存在这样的情况，也应该通过异步的方式（此时需要引入消息中间件）对不同的聚合根采用不同的事务，此时可以考虑使用后台任务。
一般来说，在下面的几种情况下，我们可以使用领域服务： 执行某个具体的业务操作。 领域对象的转换。 以多个领域对象为输入，返回一个值对象。 4....使用领域服务 经过上面的分析，很显然我们的用例，使用领域服务来实现更合适。...同样，领域服务也可以从DomainService类继承，因此它可以使用继承得来的日志、本地化、等属性。...; } task.AssignedPersonId = user.Id; //使用领域事件触发发送通知操作...当然，我们也要记住，过度使用领域服务会导致贫血领域模型（即所有的业务逻辑都位于领域服务中，而不是实体和值对象中）。
源码路径：Github-LearningMpaAbp 1.引言 最近刚学习了下DDD中领域事件的理论知识，总的来说领域事件主要有两个作用，一是解耦，二是使用领域事件进行事务的拆分，通过引入事件存储，来实现数据的最终一致性...若想了解DDD中领域事件的概念，可参考DDD理论学习系列（9）-- 领域事件。 ? Abp中使用事件总线来实现领域事件，而关于事件总线的实现，大家可参考我这篇博文——事件总线知多少，本文将不再赘述。...而这时领域事件就可以粉墨登场了。 3.使用领域事件 就这个用例而言，“用户被成功分配任务”就是一个领域事件。下面我们就来实际应用一下。 3.1....; } task.AssignedPersonId = user.Id; //使用领域事件触发发送通知操作 _eventBus.Trigger(new TaskAssignedEventData...4.最后 由于demo比较简单，找不到合适的用例，以上使用的用例比较简单。
Zepto.js是一个轻量级的针对现代浏览器的JavaScript库， 它与jquery有着类似的api。 如果你会用jquery，那么你也会用zepto。 1. Why Zepto.js？...API类似jQuery，熟悉jQuery可以无缝迁移到Zepto.js Zepto仅针对高版本现代浏览器设计了最小核心的通用库，代码体积小，尤其适合移动端开发。...Zepto.js下载 代码下载：zeptojs中文站 、 github 2.1 自定义Zepto.js文件模块 zepto默认是有五个模块的，分别为zepto、event、ajax、form、ie，这五个模块被称为核心模块...不支持jQuery CSS 扩展， 然而，可选的“selector”模块有限提供了支持几个最常用的伪选择器 Zepto.js: 无法获取隐藏元素宽高； Zepto 的选择器表达式: [name=value...总结 zepto.js确实非常小巧，而且非常讨巧的利用了大家熟悉jQuery的优势，确实非常可爱的一个js库，设计的模块中庸而又实用，在移动端的触屏事件封装的很不错，移动端web开发值得推荐。
参考了angular和vuejs的设计实现思路，并进行简化封装，目前使用的zepto基本依赖库，使用最少的代码实现了基础功能版。 2，为什么要做它 PC浏览器时代，实现mvvm有着麻烦的兼容性问题。...预计对于中大型的移动前端应用项目，使用mvvm能减少至少30%的业务量，让项目更容易维护。...setter: function, //对象设置方法 getter: function, //对象获取值方法 tpl: #div //模板字符串,部分指令需要使用...这里注意一下使用attr- 和data-指令使用attr_src和data_src来读取访问器，后面需要统一接口。...实现时使用了根节点循环向下传递的方式。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
