手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 免费部署 N8N 的 Zeabur 注册 | 登陆
浏览模式: 标准 | 列表全部文章

春晚

Submitted by gouki on 2010, February 19, 9:18 PM

春晚，现在提或许是有点晚了。但我也没有办法，小孩子在身边过年，我那天晚上几乎都没有看，还好有线电视有视频点播，里面就有春晚，还有春晚十大看点。

看来看去，春晚好象也就那么几个节目可以让人看看，什么赵本山的小品，刘谦的魔术，小虎队和王菲的歌了。

只是觉得本山大叔今年的小品实在一般了，节目过程都象极了几年前的黑土白云，一唱一和，而且包袱也没抖啥，反而广告做了一堆，去年说搜狐也只有一句话，今年那是翻来覆云都是它。实在有点让人失望，而且也没啥经典好玩的台词了。只是那句长脸，是在影射自己是春晚的常脸了呢？还是别的啥就不知道了。

刘谦的魔术一如既晚，只是电视机前的我们可以看清楚，就是不知道现场的那些观众怎么看的，难道是看大屏幕？桌面魔术实在不方便现场观看啊。

小虎队的歌还是很感人的，三首歌都让人想起了自己的年轻时代。只是当年那清纯的歌声已经被纯厚的男中音所替代了，不过看到那些熟悉的手势还是很让人感慨时间过的真快，青春也已不在。

王菲依然是歌后级的人物，歌声也是那样的超凡脱俗，看来婚后的她还是没有离开过音乐 。

其他的节目就没啥了。只是觉得变了味而己。黄宏没有啥合作对象了，巩汉林也在赵丽蓉老师走后，小品质量大为下降。而冯巩也从相声演员变成了小品演员。本山大叔在高秀敏老师走后，和范伟合作最后一次之后就开始带徒弟了。

春晚，已经变成了一个节日必看节目而己，不再让我有所期待。

Tags: 春晚, 赵本山, 刘谦, 实话实说, 魔术

Misc | 评论:0 | 阅读:16691

归来

Submitted by gouki on 2010, February 19, 9:44 AM

回家过年是一件让人快乐的事情，时间也安排的比较紧。而且是因为和孩子回去的，所以。。。

12号回家的。居然座位都没有坐满，很奇妙的事情啊。路上小孩一直在哭，但还好，半路就睡着了，车从沪嘉高速走的。绕了点路，居然还在2小时左右到家了。只是家里的“恒通”出租车居然不打表。而是直接报价，又回到十几年前了。。。。

年三十带小孩到城区逛了一圈，还是挺开心的。买了点饮料、零食等吃的。

大年初一在村里挨家挨户拜了点。临进中午时，相约的几个好友就过来玩了，下午他们打牌我在陪看。
初二去奶奶家了初三闲逛初四到我们家来玩，初五去舅舅那里吃点饭就回上海了。

值得一说的是，小孩在家里很乖，挺不错，值得表扬。。。。

Misc | 评论:0 | 阅读:16107

BUZZ

Submitted by gouki on 2010, February 11, 12:02 PM

buzz是什么？不知道了吧？我也不知道，不过看上去的感觉是和twitter差不多。
自从twitter流行后，国内各种各样的推啊拉啊围脖啊就如雨后春笋一样冒个不停

说白了，QQ应该会很开心，QQ签名就是最早的twitter了。哈哈，老马一定很兴奋自己走在世界前列，但也会很郁闷没有把握好机会。不过，总是这样的，外国的月亮比中国的圆，在中国流行的东西，没人记得住 ，如果从外国流行了再回来，那用的人就多了。

BUZZ这玩意真不错，至少，我手机可以buzz了。手机打开buzz.google.com，就可以象twitter一样写写心情了。【对于手机，暂时只支持几款OS，而Gphone必须要android OS 2.0+，郁闷啊，就在等啊兴更新了】

虽然我不是个完全的谷粉，但主要是google带给我很大方便。当然如果buzz可以follow twitter或者其他数据，我会更开心。

» 阅读全文

Tags: buzz, google, gmail

Misc | 评论:0 | 阅读:19481

Rel与CSS的联合使用

Submitted by gouki on 2010, February 10, 11:44 AM

说实话，rel在我眼里除了link CSS的时候用过，其他时候我还真没用过。根本不知道REL是用来干嘛 的。看了这篇文章才知道原来Rel还可以这么用。

原文是张经纬写的，他这么写道：

Rel-License 是微格式的开发标准之一，简单的说就是通过给引用标签（通常是链接）加上REL属性，来标明所引用链接/数据与文章的关系。

Wordpress很早就引入了rel标准，在我们添加新链接的时候就可以看到“关系”属性。

早期某些社交类搜索引擎可根据这个标签来判断人与人之间的关系，但它对网页开发来说并无意义，值得庆幸的是随着浏览器的逐渐升级，我们可以利用 CSS属性选择器以及REL来做一些有意思的功能。

这是一段带有REL属性的HTML结构。

XML/HTML代码
  1. <ul>  
  2. <li><a href="#" rel="civil">小李</a></li>  
  3. <li><a href="#" rel="party">局长</a></li>  
  4. </ul>  

页面中他呈现这个样子

大小: 3.47 K 尺寸: 238 x 148 浏览: 1928 次 点击打开新窗口浏览全图

因为局长和小李是两个不同的阶级，所以我们应该有区分他们，我打算在小李和局长后面增加两张图片让他表现出这个样式。

大小: 5.38 K 尺寸: 169 x 115 浏览: 1964 次 点击打开新窗口浏览全图

过去，我们需要在两个链接标签上增加不同的class来实现这种样式，并且我们需要针对不同的样式书写不同的CSS

XML/HTML代码
  1. <style>  
  2.  .c,.b {background:url(01.png) right center no-repeat;}  
  3.  .b {background-image:url(02.png);}  
  4. </style>  
  5. <ul>  
  6. <li><a href="#" rel="civil" class="c">小李</a></li>  
  7. <li><a href="#" rel="party" class="b">局长</a></li>  
  8. </ul>  
现在，我们可以利用REL属性以及属性选择器来完成这个工作。
CSS代码
  1. a[rel~="civil"]{background:url(01.png) rightright center no-repeat;}  
  2. a[rel~="party"]{background:url(02.png) rightright center no-repeat;}  
同时，我们的HTML结构也可以剔除那些多余的样式了。
XML/HTML代码
  1. <ul>  
  2. <li><a href="#" rel="civil">小李</a></li>  
  3. <li><a href="#" rel="party">局长</a></li>  
  4. </ul>  
另外:ie6不支持属性选择器，但我们可以用JS来修复这个问题。

--EOF--

最后一句话实在让人寒心，不过总算也可以这样的做了，再过一两年，还有IE6的存在吗？IE6的时间够长了吧？好象从02年开始到现在，都经历了8年左右的时间了，居然还没有被消亡。习惯这东西真害人。。。。

原文地址为：rel与CSS的联合使用，不过其实我更喜欢第二幅图后面的小图标

 

Tags: 前端, css, rel

Misc | 评论:2 | 阅读:26577

JavaScript单元测试工具 — QUnit

Submitted by gouki on 2010, February 10, 10:26 AM

好象这篇文章的原始链接来自cssrain，不记得了。。如果作者看到，请联系我一下，我加上链接，SORRY了。

文章来自google doc，内容如下：

QUnit是jQuery团队开发的 JavaScript单元测试工具，使用方便，界面美观。近期试用了一下并进一步了解了JavaScript单元测试，记录一下所思所得。

什么是单元测试

XML/HTML代码
  1. 单元测试又称为模块测试，是针对程序模块(软件设计的最小单位)来进行正确性检验的测试工作。单元测试主要是用来检验程式的内部逻辑，也称为个体测试、结构测试或逻辑驱动测试。通常由撰写程式码的程式设计师负责进行。  
  2.   
  3. 通常来说，程式設計師每修改一次程式就會進行最少一次單元測試，在編寫程式的過程中前後很可能要進行多次單元測試，以證實程式達到軟件規格書 (en:Specification)要求的工作目標，沒有臭蟲；雖然单元测试不是什么必须的，但也不坏，這牽涉到專案管理的政策決定。  
  4.   
  5. —— 维基百科 (中文，英文)  

 

为什么 JavaScript需要单元测试

由于存在浏览器解析环境、用户操作习惯等差异，前端程序的许多问题是无法捕捉或重现的，现在前端程序的测试多是黑盒测试，即靠点击点击点击来寻找程序bug。这种方式既费时费力，又无法保证测试的覆盖面。

同时，前端逻辑和交互越来越复杂，和其他编程语言一样，一 个函数，一个模块，在修改bug或添加新功能的过程中，很容易就产生新的bug，或使老的bug复活。这种情况下，反复进行黑盒测试，其工作量和测试质量 是可想而知的。

此外，浏览器兼容性测试是前 端程序测试的重要一环，在多个浏览器之间测试前端程序，上面说的工作量就会成n倍的增加。

为什么我们的前端程序如此脆弱？就是因为没用单元测试。。

假如使用了单元测试，上边的问题就变得很容易了，当然前提 是你要花时间去研究和编写测试用例。

根据函 数或模块的源代码，编写出包含各种情况的测试用例，每次解决bug或添加新功能，都随时更新这个用例然后进行测试，很容易就找出新bug和“复活”的老 bug。

测试兼容性，只需要在不同的浏览器 中分别运行这个测试，问题就一目了然了。

也 许白盒比黑盒要多费几倍的脑子，但想想我们那脆弱的程序，想想那些随时冒出来的烦人的老bug，费点脑子，值了！

使用QUnit

注：下面的内容主要参考了 QUnit文档 和 NetTuts+的这篇文章。

建立一个测试页面，引入 qunit.js 和 qunit.css 这 两个必需的文件，这两个文件是存放在github上的，鉴于目前操蛋的互联网环境，最好下载到本地调用。

注：body中的元素id命名必须依照如下形式，否则无法 正常显示。

XML/HTML代码
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  5.   <link rel="stylesheet"href="http://github.com/jquery/qunit/raw/master/qunit/qunit.css" type="text/css"media="screen" />  
  6.   <script type="text/javascript"src="http://github.com/jquery/qunit/raw/master/qunit/qunit.js"></script>  
  7. </head>  
  8. <body>  
  9.   <h1 id="qunit-header">QUnit example</h1>  
  10.   <h2 id="qunit-banner"></h2>  
  11.   <h2 id="qunit-userAgent"></h2>  
  12.   <ol id="qunit-tests"></ol>  
  13. </body>  
  14. </html>  

测试示例

下面是一个最简单的函数测试用例，解释请见程序注释。

JavaScript代码
  1. //定义测试模块  
  2. module( "测试示例" );  
  3. //定义一个简单的函数，判断参数是不是数字  
  4. function simpleTest(para) {  
  5.   if(typeof para == "number") {  
  6.     return true;  
  7.   }  
  8.   else{  
  9.     return false;  
  10.   }  
  11. }  
  12. //开始单元测试  
  13. test('simpleTest()', function() {  
  14.   //列举各种可能的情况，注意使用 ! 保证表达式符合应该的逻辑  
  15.   ok(simpleTest(2), '2 是一个数字');  
  16.   ok(!simpleTest("2"), '"2"不是一个数字');  
  17. });  

module( name, [lifecycle] ) 函数指定测试模块和周期。

ok( state, [message] ) 是QUnit中最常用的一个判断函数，只能判断true和false。

DEMO在这里，看一下测试结果：

大小: 19.15 K 尺寸: 326 x 221 浏览: 1821 次 点击打开新窗口浏览全图

结果都是绿的，说明两条测试语句都符合设定的规则。可以尝试修改下规则

JavaScript代码
  1. //...  
  2. ok(simpleTest("2"), '"2"是一个数字');  
  3. //...  

就可以看到爆红了。。

更多测试判断

除了ok()之外，QUnit还有如下几个判断函数：

相等判断equals( actual, expected, [message] )

示例：

JavaScript代码
  1. //定义一个简单的函数，返回数字和2的乘积  
  2. function simpleTest1(para) {  
  3.   return para * 2;  
  4. }  
  5. //开始单元测试  
  6. test('simpleTest1()', function() {  
  7.   //列举各种可能的情况  
  8.   equals(simpleTest1(2), 4, '2 * 2 等于 4');  
  9.   equals(simpleTest(2), 3, '2 * 2 等于 3');  
  10. });  

 

相同判断 (包含数组、对象等)same( actual, expected, [message] )

示例：

JavaScript代码
  1. //定义一个简单的函数，返回一个数组  
  2. function simpleTest2() {  
  3.   return [1, 2];  
  4. }  
  5. //开始单元测试  
  6. test('simpleTest2()', function() {  
  7.   //列举各种可能的情况  
  8.   equals(simpleTest2(), [1, 2], '函数返回数组[1, 2]');  
  9.   equals(simpleTest2(), [1, 1], '函数返回数组[1, 1]');  
  10. });  

same()和意思和equals()差不多，但 same()可以判断数组、对象等的相同，而equals不能。

异步与Ajax

对于异步程序的测试，如setTimeout、 setInterval、Ajax等情况，按照上面的方法，在异步调用执行之前，测试就已完成并输出了结果。这时，配合使用QUnit提供的两个函数：stop( [timeout] ) 和 start()，也可以轻松搞定。

直接看例子：

JavaScript代码
  1. //异步测试  
  2. module( "异步测试示例" );  
  3. //setTimeout  
  4. test('asynchronous test', function() {  
  5.   // 暂停测试  
  6.   stop();  
  7.    
  8.   setTimeout(function() {  
  9.     ok(true, '完成运行');  
  10.     //待测试完成后，恢复  
  11.     start();  
  12.   }, 100)  
  13. })  
  14. //另一种形式  
  15. asyncTest('asynchronous test', function() {  
  16.   setTimeout(function() {  
  17.     ok(true);  
  18.     //待测试完成后，恢复  
  19.     start();  
  20.   }, 100)  
  21. })  
Ajax也是类似的道理：
JavaScript代码
  1. //Ajax测试  
  2. function ajax(successCallback) {  
  3.   $.ajax({  
  4.     url: 'server.php',  
  5.     success: successCallback  
  6.   });  
  7. }  
  8.    
  9. test('asynchronous test', function() {  
  10.   // 暂停测试  
  11.   stop();  
  12.    
  13.   ajax(function() {  
  14.     // 异步调用判断  
  15.   })  
  16.    
  17.   setTimeout(function() {  
  18.     //异步测试完成后，恢复  
  19.     start();  
  20.   }, 2000);  
  21. })  

了解更多

 

 

Tags: 单元测试, qunit

Javascript | 评论:0 | 阅读:20563

Records:3137«‹403404405406407408409410411412›»