Javascript

JS启示录《JavaScript Enlightenment》阅读分享与延伸

Posted by admin 在 Friday, 21 August 2015

这本书基本上都在说JS的基础知识，对于有经验的JS工程师来说，很多内容说得有点啰嗦了，他总是遵循：由浅入深，循序渐进的教学方式，同时会在不同的地方对重要的观点重复阐述。（重要的话说三遍）

基础部分

基础这部分简单点讲下，对有经验的JS工程师肯定都看过《JavaScript权威指南》或者《JavaScript高级编程》等，所以基础部分不过多描述。如下主要从基础数据类型切入，逐个大致说说。

博客分类: 
Javascript

排版引擎和JS引擎

Posted by quentin 在 Wednesday, 5 June 2013

排版引擎（Layout Engine）

主要是是用来让网页里浏览器绘制网页。目前流行的排版引擎如下：

WebKit 

  - Apple Safari

  - Google Chrome

Trident

  - Internet Explorer

Gecko

  - Firefox

 

JS引擎(JS Engine)

顾名思义，JS engine是专门用来处理JS脚本的程序。

主流的浏览器的JS engine如下：

Mozilla

  SpiderMonkey - Firefox 1.0～3.0

  Rhino - 由Mozilla基金会管理，open source，完全以java编写的。

  TraceMonkey Firefox 3.5～3.6

  JaegerMonkey  Firefox 4.0 + 

  IonMonkey Firefox 18.0+

Google

博客分类: 
电脑技术
Javascript
HTML/CSS

Chrome Opera 中 for-in 语句遍历出对象属性的顺序与定义的不同

Posted by quentin 在 Friday, 17 May 2013

问题描述

Chrome & Opera 中使用 for-in 语句遍历对象的属性时，遍历出的属性顺序与对象定义时不同。所以在使用 for-in 来处理属性顺序依赖的问题时常常会出错。

问题分析

Chrome Opera 中使用 for-in 语句遍历对象属性时会遵循一个规律，它们会先提取所有 key 的 parseFloat 值为非负整数的属性， 然后根据数字顺序对属性排序首先遍历出来，然后按照对象定义的顺序遍历余下的所有属性。其它浏览器则完全按照对象定义的顺序遍历属性。

示例：

博客分类: 
Javascript

页面中实现无刷新上传文件

Posted by quentin 在 Friday, 3 May 2013

在web中实现无刷新上传文件有几种方式：

 

1. 使用HTML5中的FormData和fileReader实现。但是这种方式受限于浏览器。如：IE只适用于IE10。

可参考：http://net.tutsplus.com/tutorials/javascript-ajax/uploading-files-with-ajax/

2. 使用隐藏的iframe提交。

可参考：http://confi.blog.51cto.com/5271328/1174071

 

最近，在Drupal 7里发现内容类型（content type）为image的字段都可以实现无刷新上传。所以很想知道它是怎么实现的。经过研究发现，其实Drupal7内引入了一个js lib——jquery.form.js。

使用挺简单的：

index.html 

博客分类: 
PHP
Javascript
HTML/CSS

几种流行的客户端MVC框架

Posted by quentin 在 Monday, 3 December 2012

 

转自：http://www.ibm.com/developerworks/cn/web/wa-clientmvc/

简介

15 年前，许多人都使用 Perl 和 ColdFusion 之类的工具构建网站。我们经常编写可以在页面顶部查询数据库的脚本，对数据应用必要的转换，以及在同一个脚本底部显示数据。这类架构适合于向网站添加简单的 “Contact us” 表单。然而，随着应用程序变得更加复杂，这种方法无法进行相应的扩展来处理更大的复杂问题。大部分 Web 应用程序现在已经对模型-视图-控制器 (MVC) 架构进行了标准化，使用单独的代码实现业务逻辑、显示逻辑和用户交互（路由）逻辑。涌现出从 Spring MVC 到 Rails 的各种框架可以帮助您快速实现基于 MVC 的 Web 应用程序。

博客分类: 
Javascript

一个不错的图片轮放flash——bcastr3.0 通用图片轮换播放器

Posted by admin 在 Monday, 29 October 2012

今天在网上找到一个用于图片轮放的flash，可以动态的加载图片。

bcastr3.0 通用图片轮换播放器

可以用于各种新闻系统或者blog系统

  • 可以读取xml设置播放列表,自定义xml地址
  • 可以将图片地址直接写网页中直接,不需要xml
  • 自动适应图片大小
  • 循环播放，自定义自动播放时间
  • 不限制图片数量
  • 自定义尺寸,自动适应任何比例，图片不变形
  • 自定义图片题目（可选）
  • 浏览过程中下载
  • 自定义图片连接（可选）
  • 自定界面色彩放案

3.0新增特点：

博客分类: 
Javascript
HTML/CSS

jQuery、PHP与API等实现脸部辨识功能

Posted by quentin 在 Wednesday, 24 October 2012

导读：脸部辨识是通过图像算法来判断人脸位置和大小的计算机技术。它指认面部特征，忽略其他图像噪音，譬如建筑物，树木和身体。现在大多数社交网络平台的相册都有这个功能，在你上载了一张照片后，它自动跑算法，在照片上标识出你的朋友。此文向你介绍用不同的插件和库来实现这个功能。

jQuery 脸部辨识

jQuery 的插件在照片上标识脸部并给出他们的坐标和大小。这个插件是由六六(音译：Liuliu)结合 HTML5 canvas 开发的，所以只能在支持 HTML5 的客户端跑。有兴趣的话可以参见这个样例(见下图，不过要翻墙)，整套算法代码可以在 git hub 下载。

      PHP 脸部辨识扩展

提供了用 PHP 实现的 OpenCV (Open Source Computer Vision) 。它包含两个函数 face_count () 和 face_detect (). 第一个给了在一张图像上所标识的面部数量。第二个给了一个他们的坐标数列和总数量。你可以在 XARG’s page.找到安装程序和使用手册，还有 Demo。

脸部辨识 API

博客分类: 
PHP
Javascript

JS中的数组操作学习

Posted by quentin 在 Wednesday, 15 August 2012

1、Array.join([separator])：将数组中的所有元素都转换成字符串，然后以指定的分隔字符串把它们连接起来（默认使用","作为分隔符）。它的作用与String.split()相反，因为split的作用是将字符串分割成几个片段为创建数组。

 

2、Array.reverse()：直接操作原数组。将数组中的元素的顺序颠倒，返回颠倒顺序后的数组。 

 

3、Array.sort([sortFunc(a,b)])：直接操作原数组。根据sortFunc指定的方式对数组元素排序（默认按字母排序并将未定义元素放到数组的末尾）。 

 

4、splice(start, delCnt, args)：直接操作原数组。可以在删除任意指定位置开始的delCnt个元素的同时，插入args指定的元素到数组中（即同时完成删除和插入操作，当然也可以只删除或只插入，这取决于你传递的参数）。它返回的是被删除的元素数组，若没有删除任何元素，则返回空数组。若args指定的是待插入的数组，则这里并不展开数组，而是将数组本身作为一个元素进行插入。 

 

博客分类: 
Javascript

页面