随笔分类 - [10]JS
-
原型与原型链
摘要:【javascript基础】原型与原型链前言原型是什么理解原型对象原型对象isPrototypeOfhasOwnProperty属性查找重写原型对象原型动态性原生对象的原型小结前言荒废了好几天,在宿舍闷了几天了,一直想着回家放松,什么也没搞,论文就让老师催吧。不过,闲的没事干的感觉真是不好,还是看看书,写写博客吧,今天和大家说说函数的原型。原型是什么第一次看到这个的时候,没太理解这个概念,其实也就是一个概念呗,没啥神秘的。书上说每个函数都有一个prototype属性(原型属性),这个属性是一个指针,指向一个对象(原型对象),这个对象包含这个函数创建的实例的共享属性和方法。也就是说原型对象中的属 阅读全文
-
Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定
摘要:使用Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定原文地址:http://www.dotnetjalps.com/2013/05/Simple-data-binding-with-Knockout-Web-API-and-ASP-Net-Web-Forms.htmlIn this post We are going to see How Knockout, ASP.Net Web API and ASP.Net works together smoothly. There are lots many examples of ASP.Net MVC, 阅读全文
-
JS实现等比例缩放图片
摘要:JS实现等比例缩放图片2014-01-19 21:57 by 龙恩0707,40阅读,0评论,收藏,编辑JS实现等比例缩放图片有时候我们前端页面只有500×500像素的宽和高的布局,但是后台返回的数据图片是1000×1000,那么这种情况下 如果我直接返回的话 那么图片肯定有一部分没有显示出来,在这种情况下我是想能不能在我们前端开发实现图片等比例缩放。比如如下HTML代码: CSS代码如下:#demo1{width:800px;height:300px;overflow:hidden;}外层div的css样式定了宽度是800像素 高度是300像素,但是这张图片的宽度和高度分 阅读全文
-
javascript图片懒加载与预加载的分析
摘要:javascript图片懒加载与预加载的分析懒加载与预加载的基本概念。懒加载也叫延迟加载:前一篇文章有介绍:JS图片延迟加载延迟加载图片或符合某些条件时才加载某些图片。 预加载:提前加载图片,当用户需要查看时可直接从本地缓存中渲染。两种技术的本质:两者的行为是相反的,一个是提前加载,一个是迟缓甚至不加载。懒加载对服务器前端有一定的缓解压力作用,预加载则会增加服务器前端压力。懒加载的意义及实现方式有: 意义:懒加载的主要目的是作为服务器前端的优化,减少请求数或延迟请求数。 实现方式: 1.第一种是纯粹的延迟加载,使用setTimeOut或setInterval进行加载延迟. 2.第二种是条件.. 阅读全文
-
JavaScript原生数组函数
摘要:有趣的JavaScript原生数组函数在JavaScript中,可以通过两种方式创建数组,构造函数和数组直接量, 其中后者为首选方法。数组对象继承自Object.prototype,对数组执行typeof操作符返回‘object’而不是‘array’。然而执行[] instanceof Array返回true。此外,还有类数组对象是问题更复杂,如字符串对象,arguments对象。arguments对象不是Array的实例,但却有个length属性,并且值能通过索引获取,所以能像数组一样通过循环操作。在本文中,我将复习一些数组原型的方法,并探索这些方法的用法。循环.forEach断言.some 阅读全文
-
JS菜单条智能定位效果
摘要:JS仿淘宝详情页菜单条智能定位效果2014-01-15 15:40 by 龙恩0707,1366阅读,9评论,收藏,编辑类似于淘宝详情页菜单条智能定位 对于每个人来说并不陌生!如下截图所示:红色框的那部分!基本原理:是用JS侦听滚动事件,当页面的滚动距离(页面滚动的高度)大于或者等于 "对象"(要滚动的对象)距离页面顶部的高度,也就是说滚动的对象与窗口的上边缘接触时,立即将对象定位属性position值改成fixed(固定)(除IE6以外,因为IE6不支持fixed)。对于IE6用绝对定位position:absolute,top:就是"游览器滚动的top&quo 阅读全文
-
日期级联组件
摘要:JS日期级联组件代码分析及demo2014-01-14 14:50 by 龙恩0707,569阅读,3评论,收藏,编辑 最近研究下JS日期级联效果 感觉还不错,然后看了下kissy也正好有这么一个组件,也看了下源码,写的还不错,通过google最早是在2011年 淘宝的虎牙(花名)用原审JS写了一个(貌似据说是从YUI那边重构下的) 具体的可以看他的博客园, 感觉kissy组件源码 思路也是和YUI类似 所以我今天的基本思路也和他们的一样 只是通过自己分析下及用自己的方式包装下。基本原理1.传参中有 '年份下拉框dom节点', '月份下拉框dom节点', 阅读全文
-
JS代码平面化
摘要:重构JS代码 - 让JS代码平面化js中的嵌套函数用的很多,很牛叉,那为何要平面化?易懂(自己及他人)易修改(自己及他人)平时Ajax调用写法(基于jQuery)$.post('url', jsonObj, function (data) { if(data) { var tips = $.ligerDialog.tip({ title: 'Tip', content: 'Operation suc... 阅读全文
-
avalon1.0正式发布
摘要:2013年最后的收成:avalon1.0正式发布大半年前我就说过,MVVM是前端究极的解决方案,因此之后我大多数时间都在折腾avalon,成立了专门的QQ群与感兴趣的一起讨论。感谢第一批吃螃蟹的人,avalon发展得很快,GITHUB上的贡献人数达到8人,issues二百多个主题,各种组件也不断完善。时至今日,我可以自豪地说许多静待1.0的看客说,它终于来了!下面是avalon的生态系统:avalon的核心是avalon.js或avalon.mobile.js(移动端版本,针对手机与平板)。其中avalon.js兼容到IE6,满足中国的特殊国情。avalon.mobile.js是支持移动端,I 阅读全文
-
dialog
摘要:弹出框插件——dialog基于jquery和dot.js弹出框插件,兼容IE6+等其他浏览器。思想:弹出框元素插入body节点中,并在页面垂直居中显示(fixed定位),触发确定和关闭事件绑定。注意ie6包含两个问题:一、select、flash不能遮罩,采用iframe。二、fixed属性采用滚动时重新计算高度或在样式中采用表达式计算expression。源码分析:1、creatHtml:采用doT.js初始化元素添加到body中;2、show:设置宽度,高度,居中显示;3、events:为关闭和确定绑定事件;4、removeCallback:移出元素节点,如有执行回调方法;5、ie6fix 阅读全文
-
系统重构
摘要:当前标签: 系统重构代码复用应该这样做(2)充满诗意的联盟 2014-01-11 19:31 阅读:41 评论:0系统重构是个什么玩意儿充满诗意的联盟 2013-12-11 13:18 阅读:57 评论:0需求变更是罪恶之源吗?充满诗意的联盟 2013-12-08 10:44 阅读:104 评论:1JS图片延迟加载分析及简单的demo2014-01-11 20:16 by 龙恩0707,397阅读,0评论,收藏,编辑JS图片延迟加载 图片延迟加载也称 "懒加载",通常应用于图片比较多的网页,比如 "美丽说首页","蘑菇街"等一些导购网 阅读全文
-
高性能的JavaScript--加载和执行
摘要:高性能的JavaScript--加载和执行写在前面JavaScript在浏览器中的性能,可认为是开发者所要面对的最重要的可用性的问题,此问题因JavaScript的阻塞特征而复杂,也就是说JavaScript运行时其他的事情不能被浏览器处理,事实上,大多数浏览器使用单进程处理UI更新和JavaScript运行等多个任务,而同一时间只能有一个任务被执行。JavaScript运行了多长时间,那么浏览器空闲下来响应用户输入之前的等待时间就有多长。从基本层面说,这就意味着 6 7 8 9 10 11 Hello world!12 13 虽然这些代码看起来没什么问题,但是在〈head〉部分加载了三... 阅读全文
-
JS实现星级评价
摘要:JS实现星级评价JS实现星级评价说明: 本方法采用了Jquery库,暂时检测兼容IE8版本。本示例的2种颜色的星星都是放入了一张png图片当中,当然还有其他的一些实现思路。本示例展示的情况是当前页面只有一个星级评价的情况。思路: 通过对星级显示元素的,mouseenter,mouseout,click 三个事件的监听,从而星星显示的个数。其中我用了2个变量(temp_value,choice_value)来存放当前选定星级的值和当前临时的星级值; temp_value : 临时的星级值; choice_value : 选择的星级值; mouseenter : 鼠标移入,获取当前... 阅读全文
-
JS数量输入控件
摘要:JS数量输入控件很早看到kissy首页 有数量输入控件,就随便看了下功能 感觉也不怎么难 所以也就试着自己也做了一个, 当然基本的功能和他们的一样,只是用了自己的编码思想来解决这么一个问题。特此给大家分享下!kissy demo链接个人编写的demo链接下面来一步步分析下我当初写代码的思路: 1. 首先是HTMl代码如下:demo1:步长为0.8,下限为0, 默认是1设为40加一步减一步而我打开控件demo页面时候 在火狐游览器firebug看到如下代码:也就是说 里面的span input代码是JS自动生成的。2. 我JS代码做了如下事情: 1. 先判断传进来的容器类型判断. 支持 dem. 阅读全文
-
jsoneditor显示Json data
摘要:https://github.com/josdejong/jsoneditor/ 阅读全文
-
AMD规范与CMD规范的区别
摘要:AMD规范与CMD规范的区别2014-01-06 22:13 by 龙恩0707,553阅读,1评论,收藏,编辑AMD规范与CMD规范的区别是什么? 在比较之前,我们得先来了解下什么是AMD规范?什么是CMD规范?当然先申明一下,我个人也是总结下而已,也是网上看到的资料,自己总结下或者可以说整理下而已,供大家更深入的了解!因为我们都知道 AMD规范:是 RequireJS 在推广过程中对模块定义的规范化产出的,而CMD规范:是SeaJS 在推广过程中对模块定义的规范化产出的。什么是CMD规范?在CMD中 一个模块就是一个文件,如下代码所示://基本格式如:define(id, deps, fa 阅读全文
-
C#通过模板导出Word(文字,表格,图片)
摘要:C#通过模板导出Word(文字,表格,图片) C#导出Word,Excel的方法有很多,这次因为公司的业务需求,需要导出内容丰富(文字,表格,图片)的报告,以前的方法不好使,所以寻找新的导出方法,在网上找到了通过模板文件导出Word的方法,记录一下过程.一:模板的创建 通过模板导出,肯定需要先创建模板,然后顾名思义就是将模板中提前设置好的占位符,通过程序替换为想输出的内容即可; 新建word文件(必须为docx或者dotx文件),放在程序根目录下,在需要位置 插入-文档部件-域, 域名:MacroButton 宏名:DoFieldClick 显示文字:... 阅读全文
-
原生Js 两种方法实现页面关键字高亮显示
摘要:原生Js 两种方法实现页面关键字高亮显示上网看了看别人写的,不是兼容问题就是代码繁琐,自己琢磨了一下用两种方法都可以实现,各有利弊。方法一 依靠正则表达式修改1.获取obj的html2.统一替换html标签3.替换要修改的关键字4.再把html标签修改回去不足就是如果查找的关键字跟替换的标签一样就有冲突了效果预览:http://jsfiddle.net/dtdxrk/EAqkN/embedded/result/ 1 2 3 4 5 方法一 依靠正则表达式修改 6 7 8 9 一个和尚挑水吃、两个和尚抬水吃、三个和尚没水吃。总寺的方丈大人得知情况后,就派来了一名主... 阅读全文
-
Javascript面向对象
摘要:Javascript基础回顾 之(三) 面向对象本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:)在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者那里的一知半解,所以决定先花一些时间整理一下这些基础知识和大家分享。 后面会附上培训用的PPT。刚开始是打算写一篇的,但是后来写着写着就发现越来越多,所以决定还是写一个系列吧。本系列所有内容都是涉及Javascript基础的,没有时髦的玩意儿,但是我相信这些基础的东西会有助于你理解那些有趣的东西的。Javascript基础回顾之(一) 类型Javasc 阅读全文
-
JS图片自动或者手动滚动效果(支持left或者up)
摘要:JS图片自动或者手动滚动效果(支持left或者up)JS图片自动或者手动滚动效果在谈组件之前 来谈谈今天遇到搞笑的事情,今天上午接到一个杭州电话 0571-28001187 即说是杭州人民法院的 貌似说我用招商银行信用卡在今年的6月23日借了招商银行19800元人民币,今天是最后一天没有还款,说我其他银行钱都被冻结了。以后有可能法律投诉我!我靠 我无语啊 我长这么大从来都没有办理过信用卡,我根本就不需要办理信用卡,所以一直以来也没有办过,招商一卡通是有一张 但是从来没有借过钱啊,身份证一直都身上带着!基本上没有脱离过身,今天我打电话过去 他问我叫什么名字 我就报了名字 我问是什么情况 然后说了 阅读全文