Archive for the ‘HTML’ Category

【译】HTML5 的Web SQL Databases-本地数据库中文教程

针对本地数据储存,W3C提及到四种不同的方法,每一种方法都很精彩,但是今天要提及的只是其中一种:Web SQL Databases

HTML5的Web SQL Databases的很诱惑人,当你发现可以用与mysql查询一样的查询语句来操作本地数据库时,你会发现这东西挺有趣的,遗憾找不到中文教程,我这里只好特意翻译一篇文章(原文):

————————–翻译启动——–

从Safari 4,iPhone/iPad OS3,Chome 5以及Opera 10.5(桌面版)开始,HTML5 Local Database就开始被支持。我从这里了解到HTML5 Local Database,并且已经研究了一段时间,因此我决定做几个简单的例子来告诉你该怎么去使用它。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 function initDatabase() { try ...
......[ More Detail ]

一个简单的HTML类名命名思维

重构的时候有一种很简单的class命名思维,我们可能知道,可能不知道;但是知道后又很难应用上,是什么的思维呢?请看以下两段代码:

第一段:

...

对应的css写法:

.a{} .a .b{} .a .b .c{}

第二段:

...

对应的css写法:

.a{} .a_b{} .a_b_c{}

有什么区别呢?很明显第二种的HTML写法会冗余一点,但是CSS的写法就没那么复杂的选择结构了。在小型项目中,这两个基本上没什么区别的。但是在大型项目中就不一样了:

1、第一种写法适合局部排版

2、第二种写法适合全局公用模板

......[ More Detail ]

无聊的时候写了一个非ie浏览器跳转页

鉴于本博客主题皮肤直接鄙视了ie浏览器,于是需要一个非ie浏览器跳转页来提示用ie的用户。

ie用户在本站看到的效果比高端浏览器用户看到的效果是相差甚远的,为表示歉意,我特地做了以下提示页:[ie用户的富士康深情一跳]

当然也不是说ie就不是高端浏览器啦,ie9还是灰常强大的。

以下是demo: 点击这里

ie用户可直接访问http://xiebiji.com就会有提示啦。

......[ More Detail ]

小笔记两个

在获取鼠标所在位置坐标的时候,针对ie需要用到document.body.scrollTop属性,但是在以下情况下,document.body.scrollTop始终为0,如果顶部申明:

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd"

document.body.scrollTop 要改成: document.documentElement.scrollTop

给textarea加以下css属性:

textarea{resize:none}

不要问我有什么用,有这个属性自然有其发生作用的时候。

......[ More Detail ]

ie和firefox中的事件处理

1,捕捉阶段,事件从对象沿着文档树向下传播给目标节点。2,目标节点触发阶段:在目标上的适合的事件处理程序将运行。3,气泡阶段,在这个阶段,事件将从目标元素向上传播或者气泡回对象的文档层次。

ie和ff下的事件传播阶段应该是一样的。但是两个浏览器依据的模型有区别。

由于firefox支持dom2的时间模型,用法可以直接这样:

function test(event){ alert(event.clientX); } ele.addEventListener('click',test,true);//ele为某dom元素 关于这个模型(event可以理解为一个全局变量) DOM2的事件模型函数 作用 addEventListener 添加事件监听函数。 removeEventListener 删除事件监听函数。 preventDefault 组织默认事件的发生 stopPropagation 可以组织事件从当前正在处理它的节...
......[ More Detail ]

web workers超强悍的新技术

最近学习HTML5的时候发现这个技术,不得不惊叹。

为网页上的脚本提供了一种能在后台进程中运行的方法。一旦它被创建,Web Workers就可以通过postMessage()向任务池发送任务请求,执行完之后再通过postMessage()返回消息给创建者指定的事件处理程序(通过onmessage进行捕获)。

Web Workers进程能够在不影响用户界面的情况下处理任务,并且,它还可以使用XMLHttpRequest来处理I/O,无论responseXML和channel属性是否为null。

注意:通常,后台进程(包括web workers进程)不能对DOM进行操作。如果希望后台程序处理的结果能够改变DOM,只能通过返回消息给创建者的回调函数进行处理。

workers不仅仅能够让我们未来的web APP更加MVC。同时,他的异步后端运算给web程序带来更多可...

......[ More Detail ]