image.png 随着前端业务复杂化的不断加深,前端交互流程也愈加复杂,所以angularJs,vueJs,avalonJs等许多前端框架都出现了,它们不像JQ那样,只是提供一种工具的集合,它们更多的是一种前端业务的解决方案。你们它们从方法,到配置,到工具,都自成一套。虽然根子上都是操作DOM,操作DATA,但思路都各不相同。唯一的相同之处就是都把对DOM和DATA的操作进行了重重封装,有时用它们写JS,感觉就像在写config配置。这方面做到极致的,目前看来就是ExtJs了。 抛开这此框架不谈,单说组
##引言 工作大概9年了,就算不算上在学校里的写网页的经历,其实从事与Web前端有关的开发已经8年。这8年我自己也随着Web开发技术的革新,也在不停地更新这方面的知识体系。最近在想,是时候对目前所掌握的Web开发技术进行一个小结了。于是就有了这个系列的开始,这个系列开篇会概览性地说一下Web开发几个重要的工具或技术,后面则会在以demo示例的方式讲一讲在真实项目中是如何实践它们的。 很多年前,那个时候写前端页面真的很简单,基本上抓起一个编辑器就可以开始写html了,当时页面真的很简单,就是一堆html标签,
作者|波同学 原文|http://www.jianshu.com/p/3f97570d22b4 早几年学习前端,大家都非常热衷于研究jQuery源码。我还记得当初从jQuery源码中学到一星半点应用技巧的时候常会有一种发自内心的惊叹,“原来JavaScript居然可以这样用!” 虽然随着前端的发展,另外几种前端框架的崛起,jQuery慢慢变得不再是必须。因此大家对于jQuery的热情低了很多。但是许多从jQuery中学到的技巧用在实际开发中仍然非常好用。简单的了解它也有助于我们更加深入的理解JavaScri
本文主要介绍了高可维护的JavaScript代码规范,包括变量命名、注释、函数、正则表达式、对象、闭包、性能、模块化、私有变量、代码格式化、测试、编码规范、工具和最佳实践等。同时,本文还提供了常见代码规范的具体示例和JavaScript代码规范检查工具的输出结果。通过遵循这些规范,可以大大提高代码的可读性和可维护性,从而提高开发效率。
你不懂JS - 可能是用现代JavaScript编写的最好的书,完全可以免费在线阅读,或者可以买来支持作者。
Vue之所以受欢迎,主要就在于它的轻量和灵活,我们可以用vue做SPA,也可以用它做多页应用,一个页面对应一个VUE实例。而且因为他的轻量,低侵入性,所以我们可以很方便地和其他框架或者库搭配使用,那么我们怎么在基于vue的SPA应用中搭配jquery使用呢?
随着互联网的高速发展以及技术的不断革新,Web前端工程师需要掌握的技术也有所变更。很多人想知道当前常用的Web前端技术有哪些?如何快速掌握这些技术?接下来Web前端小编就给大家介绍下。 常用的Web
底层的前端框架领域中,早先是jquery称霸互联网,近些年,MVVM类型的框架成为主流,Vue、React和Angular三大框架并驾齐驱。目前这四种是开发者使用较广的底层框架。
在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及熟悉jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求。目前页面中常用的一些组件,都有多种jQuery插件可供选择,网络上也有很多专门收集jQuery插件的网站。利用jQuery插件确实可以给我们的开发工作带来便捷,但是如果只是会简单使用,而对其中的原理不甚了解,那么在使用过程中碰到问题或者对插件进行定制开发时就会有诸多疑惑。本文的目的就是可以快速了解jQuery插件的开发原理以
在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及熟悉jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求。目前页面中常用的一些组件,都有多种jQuery插件可供选择,网络上也有很多专门收集jQuery插件的网站。利用jQuery插件确实可以给我们的开发工作带来便捷,但是如果只是会简单使用,而对其中的原理不甚了解,那么在使用过程中碰到问题或者对插件进行定制开发时就会有诸多疑惑。本文的目的就是可以快速了解jQuery插件的开发原理以及掌握jQuery开发的基本技能。 进行jQuery插件开发前,首先要知道两个问题:什么是jQuery插件?jQuery插件如何使用? 第一个问题,jQuery插件就是用来扩展jQuery原型对象的一个方法,简单来说就是jQuery插件是jQuery对象的一个方法。其实回答了第一个问题,也就知道第二个问题的答案了,jQuery插件的使用方式就是jQuery对象方法的调用。 我们先看个例子:$("a").css("color","red")。我们知道每个jQuery对象都会包含jQuery中定义的DOM操作方法,这里使用$方法来选择a元素,返回一个a元素的jQuery对象,这个对象就可以使用jQuery中定义的DOM操作方法。那么jQuery对象是如何获取这些方法的呢?其实jQuery内部定义了一个jQuery.fn对象,查看jQuery源码可以发现jQuery.fn=jQuery.prototype,也就是说jQuery.fn对象是jQuery的原型对象,jQuery的DOM操作方法都在jQuery.fn对象上定义的,然后jQuery对象就可以通过原型继承这些方法。 基础版jQuery插件 知道了上面这些知识,我们就可以来写一个简单的jQuery插件。假如我现在需要一个jQuery插件用来改变标签内容颜色,就可以按下面的方式来实现这个插件: $.fn.changeStyle = function(colorStr){ this.css("color",colorStr); } 然后按下面的方式来使用插件: $("p").changeStyle("red"); 插件调用的时候,插件内部的this就是当前调用插件的jQuery对象,这样的话每个使用$()方法选择的标签,在调用changeStyle()插件时都会使用css()方法重设color样式。 满足链式调用的jQuery插件 链式调用时jQuery的一大特色,一个通用的插件应该遵循jQuery风格,满足链式调用要求。实现链式调用的方式也很简单: $.fn.changeStyle = function(colorStr){ this.css("color",colorStr); return this; } 然后使用的时候就可以链式调用其他方法了: $("p").changeStyle("red").addClass("red-color"); 实现链式调用的关键点就一行代码return this,插件中加了这行代码,那么在插件执行完之后,就会把当前的jQuery对象返回,然后就可以在插件方法后面继续调用其它jQuery方法。 防止$符号污染的jQuery插件 有很多js库都会使用$符号,虽然jQuery可以使用jQuery.noConflict()方法交出$符号的使用权,但是如果定义插件的时候,使用$.fn对象来定义的,那么这些插件使用的时候就会受到其它使用$变量的js库的影响。对于这种情况,我们可以使用立即执行函数通过传参的方式封装插件。形式如下: (function($){ $.fn.changeStyle = function(colorStr){ this.css("color",colorStr); return this; } })(jQuery); 因为使用了立即执行函数,所以此时的$只属于这个立即执行函数的函数作用域,这样就可以避免$符号的污染。 可以接受参数的jQuery插件 继续上面的例子,假如我还想为这个插件添加一个设置标签元素内容文字大小的功能,那么我可以这么来实现: (function($){ $.fn.changeStyle = function(colorStr,fontSize){ this.css("color",colorStr).css("fontSize",fontSize+"px"); return this; } })
https://segmentfault.com/a/1190000019151460
地址:https://github.com/lindelof/power-mode-input
JS前端开发框架常用的有哪些?在底层的前端框架领域中,早先是jquery称霸互联网,近两年MVVM类型的框架成为主流,Vue、React和Angular三大框架并驾齐驱。目前这四种是开发者用的最多使用交广的底层框架。
摘要:我们将会为Web开发人员提供多个资源。其中包括一个着陆页设计资源、两种降低屏幕刺眼程度的方法、一个用来实现拖曳网页布局的插件、一个用于整理date-picker的jQuery插件,以及许多为开发
each 方法用来遍历 jQuery 对象的,它的参数是一个事件处理函数,这个事件处理函数有两个参数,第一个参数是索引,第二个参数时索引对应的 DOM 对象,使用的时候注意转成 jQuery 对象。
Deck.gl Deck.gl是由Uber开源的数据可视化库,基于WebGL的可视化图层。能够支持大规模数据的2D和3D可视化。 可以在React中使用,也可以单独使用; ? Svelte Sve
http://www.bootcss.com,下载用于生产环境的Bootstrap即可。
一、前端开发入门 在入门阶段,你首先要学会最基本的技能:根据UI的设计稿,实现HTML的静态页面制作。这就要求你得掌握HTML、CSS页面布局排版、样式美化等技能。 📷 请点击此处输入图片描述 在这个阶段你需要学习: 1、HTML+CSS: HTML进阶、CSS进阶、div+css布局、HTML+css整站开发 2、JavaScript基础 掌握JS的基本语法、条件、语句、循环等,学会常用算法,增强逻辑性。 3、常用的前端工具 比如Webstrom、Sublime、Dreamweaver、HBuilder等
Bootstrap是一个功能强大的、以移动端为优先的响应式前端框架,它是用CSS、HTML和JavaScript构建的。与从零开始编程,甚至许多其他框架相比,Bootstrap都有许多优势。
前言 代码质量不仅适用于后端的Java或C语言,它也适用于CSS。继续阅读,了解如何编写出色的CSS! 编写基本的CSS和HTML是我们作为Web前端开发人员学习的第一件事情之一。然而,我遇到过很多的应用都没有人花时间真正考虑前端开发的长久性和可维护性。 我认为这主要是因为许多开发人员对CSS / HTML和JavaScript的长久维护缺乏深刻的理解。但是对于团队来说,编写可维护的前端代码是非常重要的。 这篇文章的目的不在于规则手册,而在于您正在编写CSS时,更多的是要考虑事物的指南。我鼓励你找到你自
1.UI.Layout jQuery UI布局插件 官方网站:http://layout.jquery-dev.com/index.cfm 使用大小可折叠的嵌套面板和大量选项创建高级UI布局。布局
基于Jquery开发的Autocomplete插件。具有易于使用,配置简单,既可以利用Ajax读取数据也可以直接从本地获取数据。
本文原文由作者“司徒正美”发布于公众号“前端你别闹”,即时通讯网收录时有改动,感谢原作者的分享。
AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一个可用的模块化 JavaScript 的解决方案。
Webpack已升级为v4版本,优化之后性能提升好几倍,请移步这个 webpack4项目配置Demo,以及 这篇升级优化点
有些事件希望自动触发,比如轮播图自动播放功能跟点击右侧按钮一致。可以利用定时器自动触发右侧按钮点击事件,不必鼠标点击触发。
vue3 源码实战出来啦:在面试中,害怕被问到 Vue源码,或者想通过自己对Vue 源码的来秀一下面试官的,可以了解一下。
tablecloth.js是一个能够只用寥寥几行代码即可快速美化你页面上HTML代码的jQuery插件。 tablecloth.js自身携带了多种表格风格,同时支持表格的排序功能,使用也极其简单。 如何使用 在你的HTML导入jQuery、Bootstrap以及tablecloth.js随包发行的其他几个js文件(如果你想要tablecloth.js的全部功能的话)。 <link href="assets/css/bootstrap.css" rel="stylesheet"> <l
jQuery补充知识点 隐式迭代 基本概念 隐式迭代:jQuery在设置属性时会自动的遍历,因此我们不需要再遍历 jQuery在执行设置性操作时,会给所有的元素都设置上相同的值。 jQuery在执行获取性操作时,只会返回第一个元素对应的值。 如果想要给每一个元素都设置不同的值,需要手动进行遍历jQuery对象。 each方法 遍历jQuery对象集合,为每个匹配的元素执行一个函数 语法: // 参数一表示当前元素在所有匹配元素中的索引号 // 参数二表示当前元素, 在function中this也表示当前元素
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
jQuery本质上就是一个外部的js文件(jQuery.js),该文件中封装了很多js代码,实现了很多功能。并且jQuery有非常丰富的插件,大多数功能都有相应的插件解决方案。jQuery的宗旨是write less, do more。 (写的更少,做的更多)。
jQuery插件就是别人已经开发好弄的,我们直接约会就可以使用。并且基于jQuery制作的,可以实现某些特定的网页效果的js文件(js + css)。
1qjnmmn gbhjnhbgfsjkgff 编写基本的CSS和HTML是我们作为Web开发人员学习的首要事情之一。然而,我遇到的很多应用程序显然没有人花时间真正考虑前端开发的长久性和可维护性。 我认为这主要是因为许多开发人员对组织CSS / HTML和JavaScript的策略缺乏深刻的理解。 在我和我们团队的观念中,编写可维护的前端代码非常重要。尽管我们有一些使用了多年的客户端,但要记住你永远不会是唯一一个工作于应用程序的人。仅仅因为你的一次性元素和配置对你有意义,并不意味着它们对下一个可能继承应用
编写基本的CSS和HTML是我们作为Web开发人员学习的首要事情之一。然而,我遇到的很多应用程序显然没有人花时间真正考虑前端开发的长久性和可维护性。
今天想了解一下jQuery的插件开发,于是google了一下,列在前面的两篇文章都很不错,jQuery插件开发全解析 更是将插件开发的方方面面细致入微的进行了讲解,并提供了PDF进行下载。笔者今天详细的阅读了这篇文章并记录了一些笔记。
head.jsp文件 将项目中所需要用到次数比较多的的插件,库等,同意放在一个jsp文件里面,命名为head.jsp文件,相当于一个全局的 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib uri="
对于那些不知道的人来说,jQuery是一个JavaScript库,它包含了许多特性,非常小而且速度很快。它还包括一个易于使用的API,在所有浏览器上都是兼容的,并且可以很容易的进行HTML遍历、动画、DOM操作和事件处理。它不仅可扩展,而且经久耐用。因此,客户端脚本自开发以来变得容易得多。
我自己的经验 如果项目要求支持低版本的 IE 的话(比如 IE7,8),就用较传统的jQuery,Bootstrap,jQuery插件/组件以及类似 Knockout.js 能够提供数据绑定的 JS 库,再加上 require.js + gulp 或者 fis3 做模块化和自动化构建。 如果不需要支持低版本 IE 的话,我们主要使用 React: React – 编写页面组件 Redux – 数据流和状态管理,一般结合 redux-saga 使用 React-router v4 – 前端路由管理(Note:
在追求页面互动效果的时代,大家都想把页面效果做的美轮美奂,这一切都离不开前端技术脚本Javascript,而最近常被人用到的Javascript库文件则是jQuery。 jQuery的使用具体步骤如下:
作者语 Insdep theme是基于EasyUI 1.5.x 的一款免费的美化主题包,拥有百度编辑器、cropper、Highcharts、justgage、plupload等各类适应本主题的第三方插件美化补丁。并且各类常用Jquery插件正在美化中。后期会提供更多的主题、组件及第三方插件美化样式。 项目简介 演示地址:www.insdep.com/example/ 下载地址:www.insdep.com 问答地址:bbs.insdep.com QQ交流群:184075694 (第一时间发布体验包) 关于
前端与移动开发基础大纲所处阶段主要内容技术要点学习目标第一阶段: HTML5 + CSS3HTML51、 浏览器与浏览器内核2、语法及使用、3、 常用标签4. 语义化5、 表单元素6、 HTML 、7 新增标签可掌握的核心能力: 掌握 HTML5 常用标签; 掌握 CSS 语法及使用技巧; 掌握CSS3新增选择器; 掌握CSS3新增样式属性; 掌握 DIV+CSS 布局方式; 掌握常见网页布局技巧; 掌握企业级、电商级网页开发基本的流程、规范; 掌握语义化、模块化、兼容性的PC端网页开发; 掌握 Pho
前端开发要的不是去蛮干,要学会有技巧的去运用知识,那么该怎么运用知识去提高你的开发效率呢? 类库和框架,你值得拥有: 📷 欢迎共同交流前端技术 、 首先,jquery一定是大部分web前端开发者不可或缺的工具。利用jquery不仅仅停留在只使用它的API和插件上,还可以会自己去写jquery插件,还可以去读jquery的源码、了解jquery的设计思路。如果你也能那样做,你会收获到意想不到的效果。 假设你现在遇到一个问题:怎么才能最透彻的去理解javascript的事件系统?最好的答案是之一就是读jquer
最近被派去维护和开发一些做了一半、年久失修的项目。有一部分内容是关于word文件导出,顺带着把excel、pdf文件的导出也调研下吧,我想未来开发我应该会遇到的,遂做了下笔记分享给需要的人。
前面的话 有一个流传较广的笑话,一个人在stackoverflow中提了一个问题,如何使用javascript实现一个数字与另外一个数字相加。最高票回答是你应该使用jQuery插件,jQuery插件可以做任何事情。 历史总是在重演,以前是jQuery,现在可能是react或vue。不同的框架有不同的应用场景,杀鸡不要用牛刀。本文将详细介绍框架选型 框架与库 库(lib)具有以下三个特点: 1、是针对特定问题的解答,具有专业性; 2、不控制应用的流程 3、被动的被调用 框架(frameword)具有以下三个
jQuery 功能比较有限,想要更复杂的特效效果,可以借助于 jQuery 插件完成。
一、没有引入jQuery库文件 二、jQuery库文件和jquery.cookie.js文件的顺序问题。须先引入jQuery库文件再引入cookie插件文件 三、页面的加载顺序所导致 大家的问题大多出在第三个原因! 网上有人说是一个页面由于二次或多次引入了jquery插件导致。 我觉得应该这样总结: 火狐浏览器报错$.cookie is not a function;是由于一个页面通过非正常方法载入jquery插件所导致! 怎么个非正常方法呢?比如jquery的ajax方法load(),当被
GitHub项目仓库收集地址:https://github.com/YSGStudyHards/DotNetGuide/issues/12
iSlider是一个表现出众,无任何插件依赖的手机平台javascript滑动组件。它能够处理任何元素,例如图片或者DOM元素
领取专属 10元无门槛券
手把手带您无忧上云