随笔分类 - JavaScript
在浏览器测试JavaScript的方法
摘要:在浏览器测试JavaScript的方法 JSFiddle Cross Browser Testing Tool Karam + Jasmine + Google Chrome CodePen JSBin Liveweave 测试JavaScript是一件很痛苦的事情。很多工具、技术和框架已经被开发出
阅读全文
解读前端js中签名算法伪造H5游戏加分
摘要:信息安全在我们日常开发中息息相关,稍有忽视则容易产生安全事故。对安全测试也提出更高要求。以下是笔者亲自实践过程:一. 打开某个数钱游戏HTML5页面,在浏览器 F12 开发工具中,查看的js,如下,都压缩混淆:如上分析是Vue.js开发的前端,Webpack打包二. 玩游戏,通过fiddler抓包,分析分数相关请求HTTP RAW详细报文如下:POST https://testgame....
阅读全文
前端性能核对表Checklist-2018
摘要:前端性能核对表Checklist-20181. 计划与度量 Get Ready: Planning and Metrics☐ Establish a performance culture.☐ Choose the right metrics.☐ Be 20% faster than your fastest competitor.☐ Share the checklist with your c...
阅读全文
前端迷思与React.js
摘要:前端迷思与React.js 前端技术这几年蓬勃发展, 这是当时某几个项目需要做前端技术选型时, 相关资料整理, 部分评论引用自社区。 开始吧: 目前, Web 开发技术框架选型为两种的占 80% 。这种戏剧性的变化持续了近 6 年。 自 2013 年 5 月推出以来,ReactJS 在过去三年中已成为了 Web 开发领域的中坚力量。 任何组件与框架都有它的适用场景, 我们应该冷静...
阅读全文
前端工程师技能整理
摘要:前端工程师技能整理 一、框架与组件 bootstrap等UI框架设计与实现 伸缩布局:grid网格布局 基础UI样式:元素reset、按钮、图片、菜单、表单 组件UI样式:按钮组、字体图标、下拉菜单、输入框组、导航组、面包屑、分页、标签、轮播、弹出框、列表、多媒体、警告 响应式布局:布局、结构、样式、媒体、j...
阅读全文
Javascript单元测试Unit Testing之QUnit
摘要:QUnit是一个基于JQuery的单元测试Unit Testing 框架。虽然是基于JQuery但用来测试纯Javascript代码。 用来运行Javascript单元测试用例的html页面是这样的: QUnit test runner 假设我们有如下...
阅读全文
Durandal介绍
摘要:Durandal是一个JS框架用于构建客户端single page application(SPAs).它支持MVC,MVP与MVVM前端构架模式。使用RequireJS做为其基本约定层,Durandal能提供高效的可维护的SOLID代码标准。 从外面支持rich UI组合,modal对话框,事件/消息,widgets, 变换,路由…. 当Durandal是一个纯Javascript库,...
阅读全文
优雅输出Javascript从Chrome浏览器
摘要:一般前端Web开发好的App中js脚本文件,为了节约流量,都会做最小化,甚至合并压缩处理。但在对于需要Debug已处理过Javascript文件就不太方便了,可读性太差了。 使用Google Chrome的Scripts插件功能Pretty print, 我们能重新格化式javascript,如下图: 这是前后操作的对比图。希望对您Web开发帮助...
阅读全文
HTML5上传文件显示进度
摘要:下面我们使用Html 5的新特性file api实现上传文件,并显示上传文件进度百分比。意图是这样的,当选择文件时,显示当前文件信息。这里我们是结合Asp.net MVC做为服务端,您也可以是其它的服务端语言。让我们看面这个片断的HTML: @using (Html.BeginForm("Upload", "Home", FormMethod.Pos...
阅读全文
SignalR介绍与Asp.net
摘要:SignalR 是一个asp.net异步库,它提供广播消息到多个client端的机制。 SignalR能用来持久客户端与服务端的连接,让我们便于开发一些实时的应用,例如聊天室在线预订系统,股票交易等实时应用。这可以显著降低服务器的负载确保没有不必要的请求从重复客户端请求。 SignalR是非微软的正式开源项目。 它实现了Long Polling的模式,可看下面图示: ...
阅读全文
用Knockoutjs与Asp.net MVC实现级联下拉列表
摘要:Knockout Js 另一个javascript库。 开源, 纯Javascript,小,无依赖,支持众多浏览器。在Asp.net MVC中我们来实现一个简单的级联下拉列表。 先看我们定义的Controller与Model: public class HomeController : Controller { public A...
阅读全文
Asp.net MVC 3 中Session与ViewBag传值到Js中
摘要:Asp.net MVC 3 中Session与ViewBag传值到Javascript中, 主要方法有: 1. 使用Javascript Variable 假设有say _layout.cshtml<head> ... <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /...
阅读全文
用SquishIt最小化Css与Javascript文件
摘要:SquishIt 是一个轻易压缩与合并CSS与JavaScript文件的组件。同时它还使用dotless处理css. 它依赖组件是: Dependencies Id Version Range YUICompressor.NET (≥ 1.7.0.0) dotless (≥ 1.2.2.0) AjaxMin (≥ 4.46.4422.26284...
阅读全文
用LazyLoad实现Javascript脚本与Css样式文件延迟加载
摘要:为了防止Javascript脚本block住浏览器进程. 往往我们需要等整个Page加载后再加载Javascript脚本.可以使用LazyLoad library.在经过最小化压缩后只有966字节.LazyLoad将从你指定URL文件数组自动并行加载并且确保执行顺序. 例如常规加载2个JS文件,1个CSS文件: 1: <link rel="stylesheet" href="http:/...
阅读全文
JQuery插件之Autocomplete
摘要:JQuery插件真是太多了,今天来说下Autocomplete。大家都有用过Baidu,Google,都已体验过Autocomplete了。我们在Asp.net 也可以实现累似的效果。使用jQuery plugin: Autocomplete,此处我使用的是Asp.net webform,当然你也可以使用Asp.net MVC。在MVC中,我们使用Controller/Action 返回数据,在A...
阅读全文
Asp.net MVC 中使用JTemplates呈现表格
摘要:在Asp.net MVC 中,使得我们能够更加自由控制我们所想显示HTML。通常情况下,都要做一下数据列表。那么我们可以手动去拼一个表格出来,但这样有时对于复杂的表格说,那就JS代码比较复杂了。我们可以借助JS下的模板引擎,来实现这一功能。下面要介绍就是JTemplates,它也是基于Jquery的。 看效果: 看VIEW代码: ...
阅读全文
JQuery取RadioList所选择项的值
摘要:首先,Radiolist控件默认Render后最外面是个,好,看代码,传统方式: Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--> 1 4 5 6 7 8 test 9 30 31 32 33 34 35 3...
阅读全文
鼠标划过链接时弹出窗口
摘要:从某控件中,提取的Javascript鼠标划过链接时弹出窗口。直接看代码: 1 2 3 4 MouseOverPopWindowDemo 5 89 90 91 92 93 鼠标划过 94 95 ...
阅读全文
JavaScript模仿MSN的弹出窗口FLASH
摘要:一个模仿MSN的弹出窗口FLASH的效果,修改src处的FLASH路径,宽和高,时间可根据需要重定义。
阅读全文