腾讯 Web 前端 JX 框架入门教程 (三)
In Web开发 on 2013年09月24日 by view: 6,094
2

开发者问得比较多的一个问题是,JX 的 ui 组件怎么用。其实只要记住,JX 是遵循驼峰式命名法,“小驼峰式(小写字母开头)” 的是变量、方法名,“大驼峰式(大写字母开头)” 的是类名,这个问题就会简单明了了。

类和继承

原生 js 的类和继承是通过原型和原型链实现的,这是个很好玩的东西,我们可以想出很多很优雅很灵活的方法去声明我们的类,唯一的问题是看你代码的人(甚至是隔了一段时间之后的自己)可能看得云里雾里,这显然不是团队合作中希望遇到的。因此 JX 对类做了简单的封装,废话说得差不多了,直接上代码。

腾讯 Web 前端 JX 框架入门教程 (二)
In JavaScript on 2013年08月31日 by view: 14,591
8

Ajax 和模版

当你需要不刷新页面而加载更多数据,ajax 是个不错的选择,怎么把 ajax 异步加载的数据优雅地拼接起来,就需要用到模版引擎了。复杂的交互都离不开 ajax 和模版,下面介绍如何在 JX 中使用 ajax 和模版。
处理 ajax,我们主要用到 http 包的 ajax 方法:J.http.ajax(uri, option)
第一个参数是 ajax 请求的 url,第二个参数是一个包括请求选项的 Object。
示例代码
腾讯 Web 前端 JX 框架入门教程 (一)
In Web开发 on 2012年09月05日 by view: 9,019
5

什么是 JX 框架

JX 框架 (Javascript eXtension tools) 是模块化的非侵入式 Web 前端框架,适用于 Web Page 和 Web App 项目的开发,特别适合构建和组织大规模、工业级的 Web App,腾讯 WebQQ、腾讯 Q+等产品都是采用 JX 框架开发,兼容目前所有主流浏览器。
JX 框架具有以下特点:

  • 微内核设计,内核可完全分离出来
  • 原生对象零污染,随着 Web App 越来越复杂,对原生对象的零污染也体现的越来越重要了
  • 模块封包,采用命名空间、闭包等方式建立了模块封包的体系,模块自身做了良好的架构分离,各个模块之间可以自由拼装组合
  • 原子级封装,最大限度保留了代码的执行效率,接近原生的接口,降低了学习门槛
  • 无缝集成各种 js 框架:jQuery, YUI, Mootools, Prototype.js,Mini,Sizzle,cssQuery,xpath,JSON 等等

第一个程序

没错,正如你所想的,我们要写的第一个程序是 “hello world”,通过这个程序,你可以对使用 JX 框架有个概括的了解。
谷歌苹果等全面参战移动浏览器
In Web 前端资讯 on 2012年05月29日 by view: 7,093
0


国外媒体刊载文章称,一场围绕着移动互联网浏览器市场主导权而展开的 “战争” 正在升级,谷歌、苹果、微软和雅虎都卷入了这场战争,挪威人开发的 Opera 浏览器和 Mozilla 的开源火狐浏览器也同样涉足其中。

这场战争背后的动机不仅仅是为了争夺夸口的资格。掌控着移动互联网的公司就能将用户导向其网站,而另一点很重要的是,拥有掌控权的公司能搜集用于定位广告的数据。

市场研究公司 Opus Research 分析师格雷格·斯特林(Greg Sterling)称:“浏览器需要出现在移动设备上才能生存下去,所有人都正尝试在这个多屏幕和多平台的世界中管理自身的策略。”


据国外媒体报道,科技博客网站 Pocket-lint 援引一名 “可靠消息人士” 的话报道称,Facebook 在尝试收购浏览器开发厂商 Opera Software(以下简称 “Opera”),这可能是 Facebook 考虑推出浏览器的一个信号。

什么是本地存储

以下内容从网上抄来的

HTML5 storage 提供了一种方式让网站能够把信息存储到你本地的计算机上,并再以后需要的时候进行获取。这个概念和 cookie 相似,区别是它是为了更大容量存储设计的。Cookie 的大小是受限的,并且每次你请求一个新的页面的时候 cookie 都会被发送过去。HTML5 的 storage 是存储在你的计算机上,网站在页面加载完毕后可以通过 Javascript 来获取这些数据。
简单的说本地存储是 HTML5 的一部分。更为详细准确的说是本地存储过去是 HTML5 的标准中的一部分,而后来由于有些工作组的人表示 HTML5 太庞大了,于是就剥离出来作为一个单独的标准。这听起来好像是把一块馅饼分成很多块目的是为了减少总的卡路里……

为什么要用本地存储

其实前面已经提到了,用本地存储有这些好处

  • 本地存储和 cookie 一样提供了把数据保存到本地的能力,页面刷新或者关掉浏览器后,数据依然存在
  • 大!虽然不同浏览器的标准可能不一样,主流的一般都在 5~10M,比 cookie 的 4k 强多了
  • 本地存储的数据不会被发到服务器,与 cookie 相比,节省带宽,加快响应速度

所以,如果需要保存一些数据到用户的浏览器,而这些数据又不需要每个请求都提交给服务器,不妨考虑使用本地存储。

如何使用

首先,得检查浏览器是否支持本地存储
可以通过检测 window 下面是否有 localStorage 字段来判断,但是在 IE 下,本地文件是不能访问 localStorage 的,此时 localStorage 字段为空,所以还要加上判断

还有一种情况,假如页面里有 id 为 localStorage 的元素,某些浏览器可以通过 window.localStorage 索引到这个元素-___,-||
为了避免你的代码在遇到如此蛋疼的 DOM 时跪掉,我建议是使用特征检查

Html5 音乐播放器(一)
In JavaScript,Web开发 on 2011年10月31日 by view: 6,938
1

过去在网页上播放声音一般使用 wmp(windows media player)控件,但是 wmp 控件提供的 js 接口非常有限,更致命的是 IE only。如果不想接受 wmp 的界面,又或者想要跨平台,只能借助于 flash 了。现在 html5 标准已经原生支持音频播放,并且各大浏览器都不同程度地实现了。