Chesanqi's Web World

1. Firebug
对于网页开发人员来说，Firebug是Firefox浏览器中最好的插件之一。它可以对已有的样式进行修改或者添加新的样式，并且直接在页面上预览效果。详细应用情况可以参看一峰同学的这篇文章。

2. IE8
对于网页开发人员来说，IE系列一直是个挥之不去的噩梦。IE6/7见最后“IETester”的介绍，IE8原生了开发者工具，虽然跟Firebug相比差点，但也有它自己的特色，比如集成了Firefox下Web Developer插件的功能；新的标尺和取色工具；设置IE7标准/IE8标准/怪癖模式三种兼容模式等等。请看：教程一、教程二。

3. Safari
Safari的开发者工具默认安装的时候没有启用，可以通过“偏好设置” -> “高级” -> 勾选 “在菜单中显示‘开发’菜单”启用，启用后即可通过菜单栏打开，也可以单击鼠标右键然后“检查元素”。Safari的开发者工具与Firebug基本差不多但也有区别，比如不能新建一个样式，只能修改已有样式的值。Safari有个特点就是可以改变用户代理，从而将自己识别为另一个浏览器，看来Safari还在缅怀上个世纪的浏览器检测大战。网上对Safari的介绍不多，官网应该是比较详尽的。

4. Chrome
Google Chrome与Apple Safari同为Webkit内核，开发者工具长的一个样。右击鼠标“审查元素”即可打开，需要知道的是Chrome3.0的开发者工具还是英文版。

5. Opera
Opera的开发者工具叫做Opera 蜻蜓，与Firebug一样的大同小异，Opera 9.5 及以上版本通过“工具”->”高级”->”开发者工具”启用。可以下载 Opera 调试菜单来配合 Opera 蜻蜓。在我的工作中对Opera的接触不多，所以详细情况还是看看官网的介绍，发烧友级别的可以去论坛逛逛。

6. IETester
IETester是没有装虚拟机的朋友测试IE兼容性的必备软件。而IETester的团队之前是做IE浏览器的网页开发插件DebugBar的，自然DebugBar插件也可以整合进IETester。追求代码完美，被IE烤的焦头烂额的朋友可以在这里下载，使用请点这里。

一直想写点关于前端开发职位本身的文字，但写了好几次都没发。最近又在持续的招聘，对应聘和招聘有些感想，零散的写多少算多少吧。

关于“前端开发工程师”这个职位
当一个词开始泛滥，就会被人忘记它的本意。我只讲我认为的解释。首先，它是“开发工程师”，也就是程序员。其工作内容的本质，就是写代码。所以，程序员应该具备的素质，比如逻辑能力，写代码的水平等等，算是它最最基础的要求。

在此之上，则是另一个要求：“界面开发”。对“看得见”的东西的感觉要敏锐。这偏偏是大多数重于理性思维的普通开发工程师，所无法具备的一项能力。坦率的说，这也是前端开发工程师与众不同，可以引以为傲的地方。前端开发职位，正是一个将看不见的逻辑转化为看得见的图形的重要角色，也可以说，一个优秀的网站产品，“最终”的成败系于前端开发这一环。

如何入行前端开发
由于现在这个劣币驱逐良币的年代，前端行业里滥竽充数太多，真正优秀的又都各占着坑不大挪窝，所以有必要仔细回答一下这个问题，以期更多有潜质的人能加入我们。我按当前状态来分类：

如果，你正在从事“网页设计”、“网页制作”方面的工作。我得先说明一下，“会做网页”不等于“前端开发”。再重复一遍：前端开发是写代码的，是用代码来构建网页界面和交互。如果还不明白，我举个例子。在宜家买个电脑桌，带回来需要自己把几块板拼成电脑桌。这个过程你会做，但绝对不会有人把你称作家具木匠。这只不过是有现成的材料，按照图纸把成品拼装起来而已。前端开发，就相当于给一块木头，要从刨木头弹墨线开始做。也不要以为今后WYSIWYG工具发达了，就没前端堆代码这碗饭。但凡纯手工打造的都是上乘精品，再过一百年，这个道理都会在的。（这样说，感觉自己好像深山里的老师傅，hoho）

如果，你正在从事“软件开发工程师”方面的工作。那你遇到的就是另一个问题了：对于界面的敏锐度。其实前端开发也不用做设计，所以不需要知道该如何“做菜”，但一定要知道好吃不好吃。能够知道什么界面的是好看，什么界面是不好，这其实并不容易。我其实也很困惑，为什么大多数人对界面好看不好看没有什么感觉。但苹果告诉我们，界面好看到极致，确实是可以比一般的产品多出一些价值的。

如果，你正在从事“前端开发”方面的工作。那就需要问问自己几个问题了：对于前端开发所必须的技术，你掌握多少？“够用就行”的知识量，是无法胜任“真正的前端开发”的。这里有一个很重要的问题：我接到的很多简历，确实可以看到对方过去一直在从事前端开发工作，但给我的案例都是非常糟糕的。如果说，过去的工作环境让你无法做出自己想做的东西，我认为这不是值得体谅的借口。我也面试过很多来自不好的公司的人，他们同样给了我他们自己平时做的实验性作品。诚然工作环境局限会让一个人很容易止步，但我真正欣赏的其实是对前端开发本身充满热情的人。之前的“堆代码”，只是我的一种戏称。如果你真的觉得前端是无聊的堆代码，那其实也无法指望在将来有不断的进步。其实，任何一份工作都是这个样子的，只有热情才能将人推向完美。

如果，你只是一个“前端开发爱好者”，比如，只是一名学生，还没有工作经验。其实我经常会遇到这个来自菜鸟的问题：怎么学CSS或JS。那，如果认真的打算作为职业来学习，有几个简单的忠告：

1. 通读权威指南。不要瞎读，外面烂书太多。倒不是说烂书学不到知识，它们之所以是烂书，是因为它们缺乏一种“正确的价值观”。什么是卓越的方法，什么是优雅的代码，这些都是有“品味”和“格调”的。由于我近期看的书不多，也不想为别人打广告，所以我只能给出一个简单但绝对不会错的答案：看《权威指南》。

2. 多做自己想做的练习。比如自己做一个简历网站或是博客，把想用的技术都用上去，做了一版再做一版。不要指望通过接外包项目之类的能给你带来技术上的提高，替他人做嫁衣其实让你很难很好的发挥的。

3. 多向他人学习。这不是说你得缠着个高手整天帮你解答问题。但凡技术高手，都是自学、google、自己琢磨+和人讨论的。计算机技术，向来不存在“教会（呃，第一个字念一声）”这一说。多和别人交流，共同提高，这才是正确的做法。

我还会其他的技能
我也时常会接到简历，声称会设计，会flash，会PHP或.NET。淘宝倒是一直要求应聘的前端开发一定要会一门非前端编程语言。我想他们的本意或许是在强调我开篇的第一点：前端开发是开发工程师。回到开初的问题，会一些周边的技能，对前端开发是否有帮助？答案当然是肯定的。但我在面试时从来对这些方面只字不问。对于一个优秀的前端开发，最重要的仍然是对前端技能本身的精通，而我相信，当你全身心投入在前端技能上时，是不大可能将其他的技能也同样做到精通的。既然不精通，我也没必要测试了。如果来者说会这些，我知道了，我也相信，就可以了。反过来，如果你真是对前端技能精通，是不可能对这些周边知识一无所知的。其实，它们都是和前端开发工作紧密结合的，很容易触类旁通。就像一个优秀的网页UI设计师，是不可能对HTML一窍不通的。

只会CSS或只会JS
一般而言，前一种情况比较多：CSS简单嘛。aoao同学说，百度是愿意要的，当前前提是“足够精通”。而淘宝的招聘广告则是狠狠的说：两者都要好。我个人是觉得，可以容许在前端开发中再细分为界面工程师和JS工程师的。但前提是，这个team已经有足够的钱来养一个大大的前端开发团队。至少对于小公司（比如偶们公司），仍然希望来者身上有足够多的剩余价值可以被榨取（hoho）。

先写这么些吧。其实，还有一些关于前端开发职业发展的想法，等我下次无事可做时再说吧。

本文来源:小麦的自习教室

虽说iframe对seo不够友好，但也不失为一种没有办法的方法。记得以前从哪里看过一篇文章说Google AdSense就是利用iframe插入到各种各样千奇百怪的网页中去的。
—————————————————-
iframe生成文档中的浮动帧。浮动帧与普通帧不同，是另一HTML文档中可以独立操作的元素。

代码示例：
<IFRAME    border=0   frameborder=0   framespacing=0 marginheight=0 marginwidth=0 width=774   height=60  scrolling=no  src=”http://WWW.chesanqi.COM”>
</IFRAME>

属性：
order=”n”                  //指定浮动帧的边框厚度(像素);

BorderColor=”#ccc”    //指定浮动帧的边框颜色(可以是颜色名和16进制代码);

FrameBorder=0   //指定浮动帧是否显示边框,0为不显示,1为显示;

FrameSpacing=”n”       //表示相同浮动帧之间的间距(像素);

Height=”n”                 //指定浮动帧竖直方向的尺寸(像素);

HSpace=”n”               //指定浮动帧内左右边界的大小(像素);

ID=”…”                     //指定<IFRAME>标志实例的唯一ID选择符,可以此ID为它指定样式;

MarginHeight=”n”       //指定浮动帧上下边界的大小(像素);

MarginWidth=”n”        //指定浮动帧左右边界的大小(像素);

Name=”…”            //指定帧的唯一名称,可以在其它帧中向这个帧名装入新文档或操作其属性;

NoreSize           //指定浮动帧不可调整其尺寸,此属性只在IE中有用;

Scrolling=no     //指定浮动帧是否有滚动条;yes为有，no为没有。

Src=”url”           // 指定装入浮动帧的文档文件的相对或绝对路径;

Style=”…”         //指定浮动帧中内容所采用的样式单命令;

Width=”n”         //指定浮动帧的水平尺寸(像素);

VSpale=”n”       //指定浮动帧中上下边界的尺寸(像素);

IFRAME 元素也就是文档中的文档，或者好像浮动的框架(FRAME)。frames 集合提供了对 IFRAME 内容的访问。

使用 frames 集合读写 IFRAME 内包含的元素。例如，如果要访问 iframe 内 body 对象的 backgroundColor 样式，语法应为:

sColor = document.frames(“sFrameName”).document.body.style.backgroundColor;

通过 iframe 对象所在页面的对象模型，你可以访问 iframe 对象的属性，但不能访问其内容。例如，访问 iframe 对象的 border 样式的语法应为:

sBorderValue = document.all.oFrame.style.border;

注意 iframe 的属性必须使用前缀 document.all 访问，例如

document.all.iframeId.marginWidth。