随笔分类 - [10]JS
-
Meteor+AngularJS:超快速Web开发
摘要:Meteor+AngularJS:超快速Web开发为了更好地描述Meteor和AngularJS为什么值得一谈,我先从个人角度来回顾一下这三年来WEB开发的变化:三年前,我已经开始尝试前后端分离,后端使用php的轻量业务逻辑框架。但当时前端还没有成熟且广泛流行的业务逻辑框架。所以在做产品开发时我仍然选用drupal等整体开发框架。开发时常常需要在javascript和php间切换,同时还要自己搞定数据库。此时的开发模型图是这样(红色箭头和红色块都表示工作重灾区):随着对用户体验的追求,我开始把业务逻辑往前端推移,于是马上遇到了前端数据与页面展示绑定的问题,业务逻辑简单时还能用jquery搞定。 阅读全文
-
JavaScript中变量声明有var和没var的区别
摘要:JavaScript中变量声明有var和没var的区别JavaScript中有var和没var的区别Js中的变量声明的作用域是以函数为单位,所以我们经常见到避免全局变量污染的方法是(function(){ // ...})();在函数内部,有var和没var声明的变量是不一样的。有var声明的是局部变量,没var的,声明的全局变量,所以可以借此向外暴露接口东东。在全局作用域内声明变量时,有var 和没var看起来都一样,我们知道,声明的全局变量,就是window的属性,究竟是否一样,我们通过ECMAScrpit5提供的属性的特性查询方法,来发现之间的区别。var fff = 2;window. 阅读全文
-
39行代码实现JS HTML模板(轻量+高效+易用)
摘要:39行代码实现JS HTML模板(轻量+高效+易用) Address City ... 阅读全文
-
原生JS的对象常用操作总结
摘要:原生JS的对象常用操作总结前端时间写了篇怎么判断js对象相等的文章,一直在期待大神给点消息,无奈一直杳无音讯,还是自己写个函数来进行判断,下面总结一些常用的对象操作的方法。 咋们来个先抑后扬的方式,先放出几个基本的东西,埋点伏笔,一下子就把那方法亮出来,我这文章就没得写了。大神们就绕道走吧,哥这是入门级别的,自己觉还挺实用的,就先做个记录。类型定义及判断 先来个全局变量 及定义默认的数据类型 1: var framework = { 2: //定义常用的js类型 3: type : { 4: nothing : -1, 5... 阅读全文
-
javascript对象深拷贝,浅拷贝 ,支持数组
摘要:javascript对象深拷贝,浅拷贝 ,支持数组经常看到讨论c#深拷贝,浅拷贝的博客,最近js写的比较多, 所以也来玩玩js的对象拷贝。下面是维基百科对深浅拷贝的解释:浅拷贝One method of copying an object is the shallow copy. In the process of shallow copying A, B will copy all of A's field values.If the field value is a memory address it copies the memory address, and if the fi 阅读全文
-
迷你MVVM框架 avalonjs 0.85发布
摘要:迷你MVVM框架 avalonjs 0.85发布本版本对循环绑定做了巨大改进,感谢@soom, @limodou, @ztz, @Gaubee 提供的大量测试文件。fix scanNodes, 在循环绑定(ms-each)扫描元素节点时必须 nextTick,否则旧式IE会忙碌不过来。fix ms-css ,旧式IE style[name] = value, 当value为NaN ,不带单位或不是数值什么会抛异常,需要try catch。旧式IE下有些元素的innerHTML是只读的, 因此不能一律使用innerHTML,并且有些元素的生成,如script标签是不会执行,为此我引入新的pars 阅读全文
-
JQuery的$(document).ready(function(){})与JS的window.onload 的各自优势!
摘要:JQuery的$(document).ready(function(){})与JS的window.onload 的各自优势!由于项目需要,使用JQuery也有相当一段时间了。由于经常要处理DOM节点加载、图片显示以及动态资源请求,所以对$(document).ready(function(){})理解也越来越深了,所有在此分享我的一些体会:1. $(document).ready(function(){...}) 此方法是JQuery版本的window.onload = function(){...}。 1.1 $(document).ready(function(){...})的其他两种缩. 阅读全文
-
设置角色遗留问题和为权限设置角色以及EasyUI Tabs的使用
摘要:设置角色遗留问题和为权限设置角色以及EasyUI Tabs的使用ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)(1):框架搭建(2):数据库访问层的设计Demo(3):面向接口编程(4 ):业务逻辑层的封装 (5):前台Jquery easyUI实现(6):EF上下文实例管理(7):DBSession的封装(8):DBSession线程内唯一 (9):TT摸版的学习(10):VSS源代码管理(11):验证码实现和底层修改(12):实现用户异步登录和T4模板 (13):权限设计(14):主框架搭建(15):权限数据库模型和用户登录详细错误(16):用户注册的各种验证 .. 阅读全文
-
jQuery Mobile (整合版)
摘要:jQuery Mobile (整合版)前言为了方便大家看的方便,我这里将这几天的东西整合一下发出。里面的例子请使用手机浏览器查看。什么是jQuery Mobile?jquery mobile是jquery在移动设备上的版本,他是基于jquery、HTML5、CSS3构建的,他提供了一个丰富的交互性强的接口用以兼容不同移动平台。于是我们去下载一番:我这里就直接下载的这个压缩文件了,完了我们看看他有些什么东西,我们这个还是要依赖jquery的,所以还是准备一个吧。这个东东是个好东西哦,他还有配套的样式呢,依赖他我们可以开发一套不错的手机应用呢。自定义属性在jquery mobile中,是使用自定义 阅读全文
-
jQuery Mobile (中)
摘要:jQuery Mobile (中)前言昨天我们一起学习了一部分jquery mobile的知识,今天我们继续。这些是些很基础的东西,有朋友觉得这个没有其它的好,但是学习下不吃亏嘛,我反正也不会一起学习基础啦。例子请使用手机查看哦内容区域格式布局网格布局jquery mobile提供一种多列布局功能,由于移动设备的屏幕大小原因,一般情况还是不要使用多列布局啦。jquery mobile提供一种css样式规则来定义多列布局,对应css为ui-block,每列的样式是通过定义前缀+“-a”等方式对网格的列进行布局,a字母根据网格的列数而定。例如两列布局CSS为:ui-block-a与ui-block 阅读全文
-
jQuery Mobile
摘要:【初探移动前端开发03】jQuery Mobile前言到目前为止,我打了几天酱油了,这几天落实了工作,并且看了一部电视连续剧(陈道明-手机),我很少看连续剧了,但是手机质量很高啊,各位可以看看。我们今天先学习一下jquery mobile的基础知识,然后逐步进入移动开发吧。我们这里再来看看响应式布局,我们是一个页面可以在不同的设备上使用,其实这在某些方面上是不太合适的。因为我们移动端的事件不太一致,可能鼠标操作很方便的,用手就不行了,所以为移动端出单独的网页还是很有必要的。文中测试链接请使用手机打开。什么是jQuery Mobile?jquery mobile是jquery在移动设备上的版本, 阅读全文
-
博客园数据统计
摘要:博客园数据统计今天突发奇想,想统计一下博客园上的这么多文章的阅读次数和发布时间之间有没有什么关系。于是自己写了一个简单的js脚本,把博客园首页的200页内容,共4000篇文章的发布时间、阅读次数、推荐次数、评论次数都统计了下来。(不知道有没有给服务器带来负担,抱歉啊,管理员童鞋)然后把js生成的数据弄到excel里面做出了下面这几张图。文章数 — 阅读次数 分布图这张图的横轴是文章的阅读次数,步进100,纵轴是计算出来的文章的篇数。可见,绝大部分文章的阅读次数都在300 ~ 1600之间。话说此前我发过4篇文章了,阅读次数分别是 100+、400+、500+、2400+, 唉—— 说多了都是泪 阅读全文
-
CSS文件和Javascript文件的压缩
摘要:CSS文件和Javascript文件的压缩像JQuery一样来压缩我们的CSS和JS我们都知道一般JQuery新版本发布的时候往往会有几个不同类型文件,比如原始版本文件、最小文件以及其他配合IDE智能提示的各种版本文件,前期我们使用JQuery时可能用的是完整版文件,可以到了网站发布的时候为了减轻文件大小,真正用到的就是我们常见的所谓压缩版文件。我们在想,网站发布的时候为什么不为我们的CSS和JS也生成这样的压缩版文件呢?今天我就为这来发一篇随笔谈谈这个并予以实现,话说好多人都知道也都在使用。YUI Compressor前端的肯定都知道这个东东,呵呵,这个太出名了,假若前端的你不知道就孤陋寡闻 阅读全文
-
原生javascript-图片按钮切换
摘要:原生javascript-图片按钮切换即上次被分配写原生JS相册弹窗后,这次又接到了写原生JS,图片按钮切换,真激情:个人在线实例:http://www.lgyweb.com/picSwitch/以下为详细代码:function LGY_picSwitch(option){ this.oWrap = this.getId(option.wrapID); //最外层元素 this.olistWrap = this.getNodeByClassname(this.oWrap,'gy_picSwitch_listWrap')[0]; this.oUl = this.olistWra. 阅读全文
-
jquery animate stop函数解析
摘要:jquery animate stop函数解析今天我们来看看jquery中动画操作的stop函数。其实我至今不是很明白啊,所以此文算是求救以及抛砖引玉。在jquery 1.7版本以前,stop支持两个参数,分别是clearQueue和jumpToEnd。这点可以参考官方文档:stop今天我写个示例,该例参考了w3school的在线测试代码:jquery stop 参数示例本人代码示例:demo1,demo2stop(clearQueue,jumpToEnd)函数分析仅仅从官方API上给出的说明,我们就知道,第一个参数是针对的其它动画队列(不包含当前动画),第二个参数则是当前动画。那么,什么是动 阅读全文
-
开始使用THREE.JS
摘要:开始使用THREE.JS译序Three.js是一个伟大的开源WebGL库,WebGL允许JavaScript操作GPU,在浏览器端实现真正意义的3D。但是目前这项技术还处在发展阶段,资料极为匮乏,爱好者学习基本要通过Demo源码和Three.js本身的源码来学习。国外网站aerotwist.com有六篇较为简单的入门教程,我尝试着将其翻译过来,与大家分享。我在一些实验项目中使用了Three.js,我发现它对快速上手浏览器3D编程确实很有帮助。通过Three.js,你不仅可以创建相机、物体、光线、材质等等,还可以选择着色器,可以决定使用何种技术(WebGL、Canvas或SVG)在网页上渲染你的 阅读全文
-
迷你MVVM框架 avalonjs 入门教程
摘要:迷你MVVM框架 avalonjs 入门教程关于AvalonJs开始的例子扫描视图模型数据模型绑定属性与动态模板作用域绑定(ms-controller, ms-important)模板绑定(ms-include)数据填充(ms-text, ms-html)类名切换(ms-class, ms-hover, ms-active)事件绑定(ms-on,……)显示绑定(ms-visible)插入绑定(ms-if)双工绑定(ms-duplex,原来的ms-model)样式绑定(ms-css)数据绑定(ms-data)布尔属性绑定(ms-checked, ms-selected, ms-readonly, 阅读全文
-
javascript 闭包基础分享
摘要:javascript 闭包基础分享 闭包向来给包括JavaScript程序员在内的程序员以神秘,高深的感觉,事实上,闭包的概念在函数式编程语言中算不上是难以理解的知识。如果对作用域,函数为独立的对象这样的基本概念理解较好的话,理解闭包的概念并在实际的编程实践中应用则颇有水到渠成之感。在DOM的事件处理方面,大多数程序员甚至自己已经在使用闭包了而不自知,在这种情况下,对于浏览器中内嵌的JavaScript引擎的bug可能造成内存泄漏这一问题姑且不论,就是程序员自己调试也常常会一头雾水。用简单的语句来描述JavaScript中的闭包的概念:由于JavaScript中,函数是对象,对象是属性的集合, 阅读全文
-
看几道JQuery试题后总结(下篇)
摘要:看几道JQuery试题后总结(下篇)感谢圆友的提醒昨天下午完成了9道试题中的前4道,之后好多园友存在些疑惑和建议,在这里我一并说一下吧。首先对于昨天第一题可能存在误导,在JQuery中并没有innerHTML这个属性,不过我们可以将JQuery对象转换成DOM对象再使用innerHTML,还有对于那个innerTEXT也是操作DOM对象的,不过貌似用的比较少。其次是第三题,我们选择表单元素,尽量使用表单元素选择器。总之,感谢圆友们的批评指正、、、接下来我们继续完成昨天没有完成的试题......第五题题目:JQuery对象与dom对象的区别,以及两者互相转换的方法var jquery = $(& 阅读全文
-
JS,Jquery,ExtJs不同脚本动态创建DOM对象
摘要:JS,Jquery,ExtJs不同脚本动态创建DOM对象好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来...简单使用JavaScript、JQuery、ExtJs进行DOM对象创建的测试,主要是使用JavaScript、JQuery、ExtJs动态创建Table对象、动态Table数据填充、多选控制。1.简单前台数据处理界面有点丑了,没美化界面,主要是JavaScript动态创建Table。效果图:View Code个人觉得这个方式还可以再修改一下,这样的话是不是太繁琐了,况且JS的话使用的没有jquery的多,所以还是接着往下看 阅读全文