好久没写过博客了,之所以没写。一则是因为刚刚毕业,做什么都是手忙脚乱的,跟不上节奏,所以就没空写了;二是自己太懒,不想写。
个人从事移动电子互联网的前端开发工作,经过几个月的工作学习,还是有点成就的,部门给下的任务没有一个没有拿下的(当然这里就不说时间的长短了,刚开始完成一个专题的输出要3~4天左右,不带测试的。后来就2天搞定,带上测试的时间)。但随着工作学习的深入,觉得自己无论是在css这块还是在js这块,缺陷和漏洞还是挺多的。主要是没有一个清晰的思路,也就是没有一个标准,导致无论在做什么专题的时候,就只是自己在做,而不是很有思路(这个思路是说对于技术没有在大脑中形成概念,导致在做专题的时候就是试下这个属性,再试下那个属性,直至试到自己满意为止),一下就做好的。我想还是要有准则的,于是我就想到了w3c。(当然在大学未毕业前,个人对w3c从头学到尾,代码也是从头到尾敲了一遍,后来又学了一遍,才“敢”出来找工作)
我想该是有计划有步骤地学习了,特别是基础部分,特别要大牢固,这就是你前端的准则。于是决定,在毕业后的半年内,每个月甚至是每周都要对w3c的基础标准做一下学习,做一个测试。下面就是对我的10月份测试的总结:
1.HTML测试
HTML测试总结:记得在第一次测试的时候,自己是错了两个的,一个是如果在HTML中把字体设置为斜体,该怎么设置?我答了<italic>,正确答案是<i>。当然这也只是失误,谁会想到经常用的<i>标签,在测试时还有犯浑的时候,没法安慰自己了。第二个错的是在HTML中如何展现一个文本域?我答了<input type="textarea"/>,这真是不可原谅的,因为前面有两个测试,是测文本框和复选框的,接着就测试文本域。唉,就这么脑残地跟着就选了<input/>了。人心不细致,真的会死的。
2.HTML5测试
HTML5测试总结:对于HTML5,只能说算是了解过,主要是在其语义化方面,如定义网页的头部就用<header>标签;定义网页导航就用<nav>标签;定义网页主体部分就用<section>标签;定义文章就用<article>标签;定义页面内容之外的内容就用<aside>标签;定义网页底部就用<footer>标签等。而且就我个人对网页语义化的了解,网页语义化,一方面是让网页看起来层次更清晰一点,以利于后期维护,让人看起来一目了然;另一方面在SEO优化方面起到很大作用,可以让网络爬虫更有目的性和准确地获取信息。
以上是谈了自己对HTML5的初步认识,针对上面的测试,自己也做下总结:<hgroup>标签是对网页或区段(section)的标题进行组合,具体万维网联盟为什么要搞这个标签,我不得而知。但就我个人理解,也应该是在语义化方面做的努力吧。之前的标题有<h1>~<h6>这六种类型,用<hgroup>将其组合起来,看起来也会更清晰吧。
还有HTML5摒弃了一些标签,像<basefont>,<font>,<center>,<s>,<u>等等。样式与内容分离,这也是万维网联盟一直推崇的原则。以上的这些在页面文档中定义字体,文字居中,删除线和下划线的标签,都可以在样式中呈现。如此以来,样式和内容便有了分离,结构性也便好了起来。
另外,HTML5也新增添了一些属性,如conteditable,contextmenu等的全局属性。就我个人认为,contenteditable属性可能是在用户说明方面做的努力;而contextmenu则是为了应对更加复杂的状况吧,但contextmenu属性在各个浏览器中的支持倒不怎么样。
至于能在HTML中嵌入SVG格式的图片,这也是在图片处理方面做的一个全面的考虑。与其它图片格式(jpg,jpeg,gif)不同的是,SVG类型的图片能在网页中高保真的显示,但其呈现的色彩很单一,其它的图片格式都能添加多层,使其色彩更艳丽,SVG也就跟素描图差不多吧。以后图片处理的方向,大概也就是将两者结合地呈现吧,不过好像已经有了尝试了。
HTML5的canvas标签,实话说,到现在也就用了那么几次。倒是看过用HTML5的canvas画布做出来的游戏。看起来很给力的,它能让你在页面中绘制图形,不必像img标签那样从外部引入图片。是不是很给力的?这样有时你就不用担心网络问题,图片就可以直接在浏览器中显示了。由于这方面自己接触的也不是很多,这里就不多谈了,但据说它在游戏方面表现很强劲。
好像说了好多了,但最后还有三个错题啊!这都是自己对HTML5用的不够多和不够深入造成的,以后看来真的要加强对HTML5方面的实践了。
3.XHTML测试
XHTML测试总结:之前对于XHTML的认识只是停留在了解上。XHTML是一种格式良好的语言,与HTML不同的是XHTML每个标签都必须是闭合的,且是格式良好的。看网上的回答,HTML是一种基本的web网页设计语言,XHTML是一个基于XML的置标语言,看起来与HTML有些相像,但有一些小的但很重要的区别。XHTML就是一个扮演着类似HTML角色的XML。所以,本质上说,XHTML是一个过渡技术,借鉴了XML的强大功能和吸收了HTML的简单特性。
XHTML可以认为是HTML版本的XML,它与HTML有几大区别:
1.XHTML要求正确嵌套;
2.XHTML要求所有元素都必须闭合;
3.XHTML对大小写敏感;
4.XHTML属性要用双引号;
5.XHTML用id属性代替name属性;
6.特殊字符的处理;
我想HTML最终会被XHTML取代,这也只是之前的一些说法,现在是HTML5大行其道的时代,其在交互性和标准制定上有无可比拟的优势。现在通用的说法是:XHTML1.0是HTML4.01到HTML5的过渡。如果想了解更多,请看以下博文:http://playkid.blog.163.com/blog/static/56287260201242632241634/
4.CSS测试
css测试总结:对于CSS我想是我最熟悉的了吧。在做专题的时候,在前端输出的时候CSS也是用的最多,因为本人从事的工作是电子商务行业,以销售为主。在功能上也就没那么地重视,所以,js用的还是比较少的(但随着公司的发展,我想逐渐会加强在功能方面的实现的)。基本上都是用CSS做一些布局方面的工作,但这也足以考验一个人的CSS功底。
做了这个测试,发现自己对CSS的基础掌握的还是不太全的,特别是CSS3方面的。像text-transform属性capitilize属性值和ul标签的list-style-type属性等。平时在做专题的时候,text-transform属性也不是没有用,但用的属性值也基本是uppercase和lowercase等,对capitilize还是较陌生的。还有ul的list-style-type属性,平时都是list-style:none;的。也根本没在乎还有list-style-type这个属性的。
w3c的测试也仅仅是对css2的测试,而本人在做专题的时候,又因为本人做的是移动端的项目,所以对css3的一些属性用的还是比较多的。像css3的border-radius属性,渐变属性。本人也经常用-webkit-animation属性来做一些动画效果。另外,css3的-webkit-transition属性和-webkit-transform属性的运用都能给你的网页添加很多动态效果。但个人对于css3的认识现在也还只是在于浮表,还需进一步学习,本人也将多买一些关于css方面的书籍,对css做一个全面而深入地学习。后续也将陆续推出自己在css3方面做的一些实践,以促进交流学习。
另外,对css的选择器的应用也是重头戏,这也将在后续单独做一个总结。
5.XML测试
XML测试总结:对于XML的测试,是自己做的最差的一个。在实际的开发中,对于XML的应用几乎为零。但还是有一点的,因为公司用的后台管理软件是动易的。动易有自己的一整套服务方案,也有自己的数据解析引擎,以实现数据库与XML的无缝连接。这里就有用到XML,动易后台将从数据库得到的数据,通过它的内部引擎转化为XML文档,然后再通过xslt将其转化为HTML文档。最后,在浏览器中展现。自己在实际项目中接触的也只是xslt,就是将XML文档转化为HTML的语言。如经常用到的<xsl:foreach></xsl:foreach>,<xsl:element name="img"></xsl:element>等等。对XML接触的是少之又少。
但对于XML自己了解的也有百分之八九十吧,只是对于一些东东还是有些含糊不清。第一题,对于XML就是使用dtd(document type definition)来描述数据的。当时,不知怎么脑残地就选了用节点类来描述数据。还有XML的版本声明,自己真的是记混了。
还有,1.XML可以保留空白字符;2.XML的属性值都必须用引号包围;3.供XML解析器忽略XML的特定部分的正确语法是:<![CDATA[Text to be ignored ]]>。
另外,个人对XML的理解是:XML是一种数据传输格式,能用来存储小型的数据文件,且格式严格,在中小型项目中运用的较多。一旦数据量过大,就会显得臃肿,变得不宜维护。这时,就要用到数据库了。
6.javascript测试
javascript测试总结:终于到了js了,js可是前端的生存必备啊!js在手,前程无忧啊!哈哈,说多了,继续总结吧。
以我对前端工作性质的认识,前端工作就是利用css,js来对HTML页面进行样式修饰和做一些与用户的交互动作。这里的css是对页面的呈现方式进行修饰,而js就是做前台页面的交互。来公司已经四个多月了,刚开始也就做了那么几个一般性的专题页面,js根本都用不上。随着后来公司的发展,以及业务需求,对js的应用也越来越多了。这四个月来,有对jQuery库的应用,也有对js插件的应用,对js的方方面面的应用也是多之又多了。自己比较满意的几个应用有对手机滑屏插件的应用,秒杀专题的开发(设置在定点进行产品的秒杀活动)等。这些插件的应用及个人开发的秒杀应用将会在以后陆续总结。
下面来说说我的w3c测试结果吧。说说在js中常犯的几个错误吧,也是自己常犯的错误:
1.js的if语句判断:如正确的if判断是if(i==0){//do something},错误的写法是if(i=0){//do something}。我想这是初学者常犯的错误,有两个等号的是做判断的,而只有一个等号的就等于是赋值了。那么后者将永远是"true"。
2.另一点,也是自己一直以来都忽略的,就是在js中有两种不同的循环:for循环和while循环;而自己一直以来都认为只有for循环,也许是因为自己经常用for循环,而将while循环忽略了的缘故吧。
3.另外,对于clearInterval()函数和setInterval()函数的应用,也是易错点。
暂时先总结这三点,以后在实践中将会有更多地总结。
本人最近也搞了基本js方面的书籍,打算潜心修炼,立志成为一名前端大牛,哈哈。
7.jQuery测试
jQuery测试总结: jQuery,做前端开发没有人不知道jQuery的,jQuery是javascript的一个库,封装了很多函数,让前端开发变得不再那么的难(ps:前端开发确实不难,相对于其它的Java,c的软件开发之类的)。
根据互联网上给的数据,jQuery是一套跨浏览器的javascript库,简化HTML和javascript之间的操作。它是轻量级的js库,兼容css3,还兼容各种浏览器,jQuery2.0及后续版本不再支持IE/6/7/8浏览器。有John resig在2006年1月的barCamp nyc上发布第一个版本。目前由Dave Methvin领导的开发团队进行开发。jQuery是一个比较成熟的javascript库,利用jQuery能方便地操作HTML dom,实现动画,并能方便地进行Ajax交互。并有很完整的文档和很多成熟的插件可以选择。
jQuery的宗旨是“write less,do more”。由于现在对于jQuery的认识也只是皮毛,对于它的什么宗旨“写得少,做的多”,我现在的体会也不是很深。但jQuery总有一些东西会吸引着你,如简单的一个调用$('.theclass').hide();就可以实现隐藏效果,而一个简单的$('.theclass').show();就是实现显示的效果,是不是特别方便啊。还有Ajax操作,jQuery.ajax(function(){url:theurl,content://这里是一些参数,cache://false或true,dataType://如jsonp,success:function(data){//do something}});function里面定义请求的地址url,发送的内容参数content等,请求的数据格式dataType,是否使用缓存cache,请求成功后返回的数据success:function(data){//do something}。通过这样的一个请求来完成与后台的交互。通过以上的介绍,jQuery是不是很简单呢?不过jQuery的一些动画效果,我还真没怎么用过,自从有了css3后,什么动画过渡什么的,都用css3实现了,不过在以后工作学习中还是要加强对jQuery的运用的。探其精髓才是我的最终目的。也希望自己能够坚持下去。
不说那么多了,回过头再看下我的测试结果吧。恩,测试结果还是不错的,只错了一道。是自己的理解有偏差,jQuery使用css的选择器来选取元素。这绝对是自己的失误!另外,自己之前在设置css的一些属性时,由于刚开始,就特傻逼哈!一个元素的多个css属性,我就用多个$('.theclass').css();来设置。真的是耗费了我很多精力,又耗费了很多空间啊!其实可以这样来设置的,$('theclass').css({属性1:属性值1,属性2:属性值2,属性3:属性值3});好了,对于jQuery的测试总结就先到这里吧。之后,随着工作学习的深入还会有更多内容哦!
8.sql测试
sql测试总结:对于sql的测试,自己是满分的,但这只代表本项测试你是合格的,并不代表你就真的会sql的。之所以sql测试会满分,也得益于自己曾苦学过Java,也曾全面地学习过sql。什么sql注入,千年虫问题,我都有过“研究”,但现在也忘得差不多了,看来抽空还得复习一下sql方面的知识的。
虽然本人从事的是移动前端的开发工作,但有时还是有和sql的接触的。如之前说的动易后台,就有写数据查询语句来查询后台数据库文件的。在这里,也真为我自己捏了一把汗,不得不说,即使你再怎么懂sql,如果不能将之运用到实际项目中,那还是等于0。看着那些大牛们,熟练地写着sql语句,自己也只有羡慕的份了。在这里,自己也将数据库的内连接,左连接,右连接复习了一下,真的是特别有感觉啊!就像是重获新生的感觉,我终于对sql的连接开窍了啊!写到这里,还得告诉自己一句话“多学一点,对自己绝对没有坏处”。
好了,sql的总结就到这里吧!在这一轮w3c的学习过后,接下来还真的要复习一下Java了,还有这可爱的sql查询语句。
9.asp测试
asp测试总结:说起asp,自己还是有点骄傲的。由于本人之前是学的Java,对什么jsp,ssh框架之类的就很熟悉,jsp的一些基本特性,自己也都熟练地掌握了。而ssh框架之类的,自己也只是做了一个注册登录系统而已。这么说来,自己对Java,jsp也只能算是熟悉了。但这跟asp有什么关系呢?jsp之于Java,就像asp之于c#。只要你Java,jsp会了,asp对于你来说,还陌生吗?哈哈!
说到这里,就再谈下我对asp的认识有多深吧!基本的iis配置,ftp配置自己都有接触过。曾在学校帮助学弟在iis上发布了一个程序。也帮助过一个同学用asp和c#写毕业论文,虽然自己没有深入地做一个什么系统之类的,但基本的什么mvc框架我还是懂的。在这里我也只是能给他们一个思路,至于代码什么的,还是不太懂的,说到底就是用的不太多吧。
从测试结果来看,估计是做的最差的了。这就是为什么我只能给他们一些思路了,一门语言如果没用过就等于0。在这里,我也不深入探究错的原因了,因为本人着重学习的Java方面的知识,对于c#也只是粗略地了解了一下,不打算做深入学习的。但我想把w3c上的asp知识掌握了还是没什么问题的。
10.php测试
php测试总结:如果说asp,自己只是熟悉,那么PHP也只能算是了解了。这里也只说一下php的特点吧:
1.开放源代码;
2.和其它技术相比,php本身免费且是开源代码;
3.程序开发快,运行快,学习也快,嵌入于HTML;
4.跨平台性强,可以在linux、unix、windows和mac os下运行;
5.效率高,php消耗相当少的系统资源;
6.面向对象,在php4和php5中,在面向对象方面有了很大改进,php完全可以用来开发大型商业应用程序;
7.专业专注,php支持脚本语言,同为类c语言。
最后,对于asp和php,我想自己还是停留在熟悉的层次比较好,不打算深入学习。对在w3c上的基础知识,我还是要掌握的。
到这里,已经对我的10月份w3c测试做了一个较为完整的总结,希望通过这次学习后,自己能够完全通过w3c的测试。当然,测试不是目的,关键是熟悉规则,以让自己在以后的前端路上顺畅点,再自信点。