大作翻译—Interviewing the front-end engineer By Nicholas C. Zakas

发表于 由
2

Nicholas Zakas是高效率javascript这本书的作者，这篇文章写的是怎样面试前端工程师 其实他里面提到了很多基础知识 也是我自己需要强化和巩固的 过一阵我会对里面每个提到的知识点做一个总结和提炼 每一个知识点写一篇博客

所以我在这里之翻译基础只是这一部分（好久不翻译了 肯定很差 以后可以让刘老板帮忙改进一下）

原文链接

基础知识

我们生活在一个通过互联网可以快速汲取知识的时代，但是 之了解一些知识的皮毛并不代表已经已经掌握了它们并可以熟练应用，我这里有一些基础的知识点，我希望所有的前端工程师都了然于胸。你不能在有时间限制的时候还需要每次都停下来上网去查。如果有些人面对这些问题说：我不知道 但是我可以上网去查。 听到这话 我立刻给他灭灯，下面就是这些基础，我希望所有前端er都可以不依靠外部的帮助掌握它们。

1.DOM结构 节点之间的相互关系 和 怎样从一个节点到下一个节点
2.DOM修改 怎样 增加 删除 克隆 移动 查找 节点
3.事件 怎样使用事件 在IE和标准dom下的事件对象的主要区别
4.XMLHttpRequest 是什么 怎样发起一个完整的XML请求 怎样检测其中的错误
5.Strict Mode 和 Quirks Mode 怎样触发这两种格式 有什么区别
6.The Box Model(盒模型) margin padding border怎样工作 还有在ie浏览器下会有什么问题
7.Block vs Inline Elements(块级元素 内联元素) 有什么区别，怎样用css转换，对旁边的元素有什么影响
8.浮动元素 怎样使用 会出现什么问题 怎样解决出现的问题
9.JSON 是什么，为什么会使用他，怎样使用

重申一遍，这些知识点必须是你熟知的，我之前的问题都是要测试对在所有这些领域的知识水平。这个清单并不是非常的彻底，但是我相信这些都是你要成功于我们合作必备的技能和素质。

待续

写的两个豆瓣的油猴脚本 – douban quickview 和douban live

发表于 由
回复

平时无聊的时候逛豆瓣发现有很多不方便的地方 有个叫豆瓣助手的东西又超级大 很不爽

所以写了两个常用的功能

第一个就是在豆瓣广播里面的图片 每次看都会跳到相册那一页 不方便 所以写了一个像微博可以放大 然后点击可以缩小的脚本 douban quickview

没有点击的时候

点击后 

第二个是 小组看淫荡直播的时候直接看楼主的帖子 将其他灌水的帖子都隐藏 这个很方便实用

没有点击的时候

点击过后

下面的帖子只显示楼主的帖子

两个插件的下载地址：

quickview ： http://userscripts.org/scripts/show/97647

live ：http://userscripts.org/scripts/show/118037

PHP处理xml的方法

发表于 由
回复

好久不用php了 这几天用php做一个小东西 处理xml是一个很基本的常识  总结了一下 以后用的时候找起来方便

其实就是利用了一个php内置的方法simplexml_load_string();下面用直接上代码说的清楚，我用了dict.cn的辞典API，准备做一个简单的辞典小应用~ 嘻嘻

	function object_to_array($object){
        $result = array();
        $object = is_object($object) ? get_object_vars($object) : $object;
        if(empty($object) || (!is_object($object) && !is_array($object))){
			return false;
		}
		foreach ($object as $key => $val) {
		    $val = (is_object($val) || is_array($val)) ? object_to_array($val) : $val;
		    if(is_numeric($val) || is_string($val))
    		{
				$val = mb_convert_encoding($val,"GB2312","UTF-8");
    		}
    		$result[$key] = $val;
        }
        return $result;
    }

        $word = $_GET['word'];
	$str = file_get_contents('http://api.dict.cn/ws.php?utf8=true&q='.$word);
	$obj = simplexml_load_string($str);
	$arr = object_to_array($obj);
	var_dump($arr);

过程就是先把字符串读过来 然后把字符串用内置方法转成对象 然后再把对象 用自定义的函数 转成数组
我们来看一下他的结果把~

xml to array

linux下面的编码转换

发表于 由
回复

由于最近工作中 同事从windows系统传给我的文件大多都是gbk编码的 每次用的时候都要转码 把转码的知识总结了一下
这张图显示了转码的过程

第一步 察看编码 发现乱码以后 要先看看目标文件是什么编码 有两种方法
vim对gb2312支持不太好 有时候显示为latin 不知道为什么

//使用enca来 这是很好很方便的
sudo apt-get install enca
enca filename

//使用vim
vim filename
:set fileencoding

 

第二步 发现编码了以后 开始转码 两种方法 enconv 和 iconv
enconv比较方便 不用新建一个文件

//enconv
enconv -L zh_CN -x UTF-8 filename

//iconv
iconv -f GB2312 -t UTF-8 file1 -o file2

自己写的焦点图插件 vslide

发表于 由
回复

其实早就写好了 一直放在那里 前几天往github里面又传了一个东西 发现还有这么个东西 改了改 就先放出来 一开始本来设想要加好几中动画效果的 后来想想先这样 越简单越好只要实现功能即可  使用也比较简单 现在动画效果只有一种向右滑动 本来设想添加了一个动画组件 里面有多种效果 根据用户需要来添加

效果请看   DEMO

用法 很简单 看下面说明

//两个参数 一个是数据 一个是配置参数 css可以自己按照喜好填写
//第一个是图片的数组 包括图片地址 链接 和下面的说明
var data =[{img:'1.jpg',link:'#',desc:'there you go bitch'},
{img:'2.jpg',link:'#',desc:'this is not cool'},
{img:'3.jpg',link:'#',desc:'under attack'},
{img:'4.jpg',link:'#',desc:'fuck this shit, fuck you all'},
{img:'http://www.wallcoo.com/flower/Amazing_Color_Flowers_2560x1600_II/wallpapers/1280x1024/Amazing_Flowers_Wallpapers_53.jpg',link:'#',desc:'u\'er going down bro'}
];

//默认的配置参数
var settings = {
		pagnation:true,//是否显示下面的页码
		autoPlay:true,//是否自动播放
		speed:3000,//播放速度
		event:'click',//切换事件
		height:327,//高度
		width:960//宽度
	}

//可以用你想要的配置覆盖他
var opts = {speed:2000,event:'mouseover'};

//最后~
$('.test2').vslide(opts,data);

配置很简单 焦点图还算好用 中意的可以在这里fork

DOWNLOAD&FORK