// 缓存框架 (function (xframe) { /** * 实现了缓存框架的临时存储功能(内存存储) * @type {{data: Array, get: (function(*): *), add: xframe.cache.add, delete: (function(*): boolean), update: (function(*, *): boolean), isExist: (function(*): boolean)}} */ xframe.cache = { data…
/* * @Author: 我爱科技论坛 * @Time: 20180715 * @Desc: 实现一个类似于JQuery功能的框架 * V 1.0: 实现了基础框架.事件框架.CSS框架.属性框架.内容框架.动画框架的搭建 * V 2.0:实现了框架的进一步优化,具有良好的扩展性, 可以支持链式访问 * */ / 主框架: 只做一件事,就是用于获取所有的元素集合 (function (w) { // 定义一个Xframe对象,后面就是他的构造函数 var xframe = function (…
在网上下了一个类似于jQuery的小框架,分析源码,看看怎么写框架. 选择器Select //用沙箱闭包其整个代码,只有itcast和I暴漏在全局作用域 (function( window , undefined){ //Itcast函数,参数:selector.返回值一个Itcast对象,功能:new Itcast.prototype.init() function Itcast(selector){ return new Itcast.prototype.init(); } // Itcas…
// DOM框架(选择器框架) (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({ /** * 向现有的元素集合中添加元素节点(修改this的内容) * @param dom * @return {add} */ add: function (dom) { // 1. 项伪数组中添加元素 this[this.length] = dom; // 2. 数组的长度也需要改变了 this.length+…
// 动画框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({}); // 不需要参与链式访问的 xframe.extend(xframe, {}); // 实现动画框架的封装 xframe.Animate = (function (xframe) { // 1. 定义需要的API接口(API内部用于放置属性) var api = { timer: null,// 这是一个动画循环句柄 que…
// 选择框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({}); // 不需要参与链式访问的 xframe.extend(xframe, { /** * ID选择器 * @param context * @return {HTMLElement | *} */ $id: function (context) { // context是一个DOM对象还是字符串 context = this.…
// 属性框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({ /** * 获取/设置某一个元素的属性信息 * @return {*} */ attr: function () { // 获取属性信息:两种格式,1. 取值模式 2.设置模式 var args = arguments; if (args.length === 0) { // 没有参数的话,就直接返回本身 return this;…
// 事件框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({ /** * 实现一个浏览器的基本事件的绑定 * @param type * @param fn * @return {on} */ on: function (type, fn) { // 注意这里的初始的下标编号是长度减一 var i = this.length - 1; // 可以实现兼容版本的IE浏览器和W3c浏览器的支持…
// 内容框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法) xframe.extend({ /** * .html()用为读取和修改元素的HTML标签 对应js中的innerHTML * @return {html} */ html: function () { var arg = arguments, len = arg.length, arr = Array.prototype.slice.call(this); i…
核心构造函数 (function ( window, undefined ) { // 定义Itcast构造函数 function Itcast ( selector ) { return new Itcast.fn.init( selector ); } Itcast.fn = Itcast.prototype = { constructor: Itcast, type: 'Itcast', length: 0, // 核心模块内容 init: function ( selector ) {…
// CSS 样式框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法)[只要是需要使用到this获取到的元素集合这个变量的时候,这里就是需要进行链式访问的] xframe.extend({ /** * 给DOM元素设置/取值CSS样式 * @return {*} */ css: function () { // 分为两种情况,一种是取值模式,一种是设置模式 var arg = arguments, len = arg.len…
我们知道,jquery css() 方法可以很方便的更改DOM的样式. 但从原理上,这个并不复杂,我们完全可以自己写一个. 上代码. updateDOMStyle(DOM, obj){ Object.keys(obj).forEach(function(key){ DOM["style"][key] = obj[key]; }); }, DOM是你想改的DOM元素,obj是样式对象. 使用. use(width, height){ document.querySelector(&quo…
整个封装过程及阅读JQuery源码的过程基本上持续了一个月吧,最终实现了一个大概30%的JQuery功能的框架版本,但是里面涉及的知识点也是非常多的,总共的代码加上相关的注释大概在3000行左右吧,但也只是对JQuery的里面的知识点了解了大概,后续希望能更深层次的理解JQuery里面涉及的知识点,从而写出高质量的代码,特此记录一下这一段时间学习的点滴. /* * @Author: 我爱科技论坛 * @Time: 20180722 * @Desc: 实现一个类似于JQuery功能的框架 * V…
这个版本的JQuery是对上一个版本的JQuery,使用了require.js进行了二次封装,基本上把前面的每一个框架封装成为一个单独的模块,最终的目录结构如下: 由于代码量和目录比较多,这个封装好的代码和目录已经全部上传到GitHub上面,需要的同学可以前往下载哈. https://github.com/xiugangzhang/JavaScript-Xframe [main.js]这个是模块文件的主入口函数 /** * @Desc : 主要的功能模块展示 * @Author : xiugan…
在我们开发的很多分布式项目里面(如基于WCF服务.Web API服务方式),由于数据提供涉及到数据库的相关操作,如果客户端的并发数量超过一定的数量,那么数据库的请求处理则以爆发式增长,如果数据库服务器无法快速处理这些并发请求,那么将会增加客户端的请求时间,严重者可能导致数据库服务或者应用服务直接瘫痪.缓存方案就是为这个而诞生,随着缓存的引入,可以把数据库的IO耗时操作,转换为内存数据的快速响应操作,或者把整个页面缓存到缓存系统里面.缓存框架在各个平台里面都有很多的实现,基本上多数是采用分布式缓存…
文/Amin706(简书作者)原文链接:http://www.jianshu.com/p/4df5aad0cbd4著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 在项目中总是需要缓存一些网络请求数据以减轻服务器压力,业内也有许多优秀的开源的解决方案.通常的缓存方案都是由内存缓存和磁盘缓存组成的,内存缓存速度快容量小,磁盘缓存容量大速度慢可持久化.常见的内存缓存有NSCache.TMMemoryCache.PINMemoryCache.YYMemoryCache.常见的磁盘缓存有T…
  1.使用缓存的目的 缓存是存取数据的临时地,因为取原始数据代价太大了,加了缓存,可以取得快些.缓存可以认为是原始数据的子集,它是从原始数据里复制出来的,并且为了能被取回,被加上了标志. 在android开发中,经常要访问网络数据比如大量网络图片,如果每次需要同一张图片都去网络获取,这代价显然太大了.可以考虑设置本地文件缓存和内存 缓存,存储从网络取得的数据:本地文件缓存空间并非是无限大的,容量越大读取效率越低,可设置一个折中缓存容量比如10M,如果缓存已满,我们需要采用合 适的替换策略换掉一…
SpringMVC是越来越火,自己也弄一个Spring+SpringMVC+JPA的简单框架. 1.搭建环境. 1)下载Spring3.1.2的发布包:Hibernate4.1.7的发布包(没有使用hibernate的API,只是使用了它对JPA的实现):下载 BoneCP 连接池框架及其依赖的jar,下载缓存框架ehcache,全部所用到的jar包如下: ? antlr-2.7.7.jar bonecp-0.7.1.RELEASE.jar bonecp-provider-0.7.1-rc2.j…
在我们开发的很多分布式项目里面(如基于WCF服务.Web API服务方式),由于数据提供涉及到数据库的相关操作,如果客户端的并发数量超过一定的数量,那么数据库的请求处理则以爆发式增长,如果数据库服务器无法快速处理这些并发请求,那么将会增加客户端的请求时间,严重者可能导致数据库服务或者应用服务直接瘫痪.缓存方案就是为这个而诞生,随着缓存的引入,可以把数据库的IO耗时操作,转换为内存数据的快速响应操作,或者把整个页面缓存到缓存系统里面.缓存框架在各个平台里面都有很多的实现,基本上多数是采用分布式缓存…
在前面几篇随笔中,介绍了PostSharp的使用,以及整合MemoryCache,<在.NET项目中使用PostSharp,实现AOP面向切面编程处理>.<在.NET项目中使用PostSharp,使用MemoryCache实现缓存的处理>参数了对PostSharp的使用,并介绍了MemoryCache的缓存使用,但是缓存框架的世界里面,有很多成熟的缓存框架,如MemoryCache.Redis.Memcached.Couchbase.System.Web.Caching等,这时候我…
在我们开发的很多分布式项目里面(如基于WCF服务.Web API服务方式),由于数据提供涉及到数据库的相关操作,如果客户端的并发数量超过一定的数量,那么数据库的请求处理则以爆发式增长,如果数据库服务器无法快速处理这些并发请求,那么将会增加客户端的请求时间,严重者可能导致数据库服务或者应用服务直接瘫痪.缓存方案就是为这个而诞生,随着缓存的引入,可以把数据库的IO耗时操作,转换为内存数据的快速响应操作,或者把整个页面缓存到缓存系统里面.缓存框架在各个平台里面都有很多的实现,基本上多数是采用分布式缓存…
1.java里面有一些开源的缓存框架,比如ecache,memcache,redis等缓存框架. 2.使用缓存框架的原理就是减少数据库端的压力,将缓存数据放在内存里面,存储成键值对的格式,这样可以不去读取数据库,直接查询缓存,提高系统的效率. 3.缓存算法:LRU,FIFO等类似于缓存操作系统的算法,所以我们使用缓存基本就是配置几个参数.…
声明,该DEMO依托于某个培训机构中,非常感谢这个培训结构.话不多说,现在开始改demo的制作. 首先,在前端的学习过程中,轮播图是我们一定要学习的,所以为了更加高效的实现各种轮播图,封装了一个运动的框架. function getStyle(obj,attr) { if(obj.currentStyle){ return obj.currentStyle[attr];//为了获取IE下的属性值 }else{ return window.getComputedStyle(obj,null)[at…
使用Jquery+EasyUI 进行框架项目开发案例解说之中的一个 员工管理源代码分享 在開始解说之前,我们先来看一下什么是Jquery EasyUI?jQuery EasyUI是一组基于jQuery的UI插件集合,而jQuery EasyUI的目标就是帮助web开发人员更轻松的打造出功能丰富而且美观的UI界面.开发人员不须要编写复杂的javascript,也不须要对css样式有深入的了解,开发人员须要了解的仅仅有一些简单的html标签.jQuery EasyUI为我们提供了大多数UI控件的使用…
我们知道,不管学习任何一门框架,了解其设计的理念.目的.总体的结构及核心特性对我们使用和后续的深入理解框架都是有很大的帮助的.因此在这里先梳理一下本人对jQuery框架的一些理解. 设计目的(为什么要设计这个框架) jQuery可以分解为JavaScript + Query.即JavaScript查询的意思.所以jQuery的核心目标就是JavaScript查询,通过选择DOM元素再对DOM元素进行操作.并解决了跨浏览器兼容问题,使DOM操作趋于统一. 如何实现 选择DOM是为了对其进行进一步的…
前言:ajax的神奇之处在于JavaScript 可在不重载页面的情况与 Web 服务器交换数据,即在不需要刷新页面的情况下,就可以产生局部刷新的效果.Ajax 在浏览器与 Web 服务器之间使用异步数据传输(HTTP 请求),当然也可同步,这样就可使网页从服务器请求少量的信息,而不是整个页面.Ajax使我们的项目更小.更快,更友好,在前端开发有很高的地位,也是面试题的热点.本次测试是在localhost本地环境. 1.原生ajax (1)html前端代码get请求方式 创建一个ajax实例xh…
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption…
Sublime text代码补全插件(支持Javascript.JQuery.Bootstrap框架)   插件名称:javascript-API-Completions 支持Javascript.JQuery.Twitter Bootstrap框架.HTML5标签属性提示的插件,是少数支持sublime text 3的后缀提示的插件,HTML5标签提示sublime text 3自带,不过JQuery提示还是很有用处的,也可设置要提示的语言. 下载地址:https://github.com/P…
//封装一个类似jquery的ajax方法,当传入参数,就可以发送ajax请求 //参数格式如下{ // type:"get"/"post", // dataType:"json"/"jsonp", // url:"地址", // data:{key:value} // success:function(){ // } // } //还需要一个跨域方法,可以访问远程服务器的数据 function myAja…
  前  言           AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核心的是:MVC.模块化.自动化双向数据绑定.语义化标签.依赖注入等等. AngularJS 是一个 JavaScript 框架.它是一个以 JavaScript 编写的库.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过 指令 扩…