前端开发实习总结五篇

第一篇：前端开发实习总结

多种多样的Web应用跟随互联网Web2。0时代的兴起不断出现，Web前端出现了翻天覆地的变化，今天小编给大家整理了前端开发实习总结，谢谢大家对小编的支持。

前端开发实习总结篇一

今天就简单聊聊上面的Struts+Spring+Hibernate吧。

Struts 代表：表示层；Spring代表：业务逻辑层；Hibernate则代表持久层。他们是目前在Java Web编程开发中用得最多的框架，其实这样区分是为了适应软件开发过程中各个分工部门之间保持一致性的需要。说得简单点就是大家都在一个模式下写代码，这样就能保证写出来的程序能被每一个人都能够读懂，而且有些基本的东西它可以自动帮你生成，不用你自己一个一个的敲了，达到了代码复用。这样保证可读性的同时也提高了开发效率，从而降低了成本。Struts这个框架其实就是Java MVC设计模式中（简称Model1与Model2）Model2的一个具体实现，Spring 则通过提供ICO（控制反转，也称依赖注入）实现了对对象甚至事务（如声明式事务）的集中管理，此外还引入了AOP（对向切面编程），当然也完全兼容其它框架。Hibernate吗，就是一个实现对象与关系映射的中间件，大家知道，现在的主流数据库还是关系型的，但编程却已经采用了面向对象的思想，如何让编程人员能像操作对象一样，操纵数据库里的数据呢？Hibernate就是这样一种框架。以前Java程序员与数据库打交道都是通过JDBC，还要写 SQL语句，不过Hibernate彻底改变了这一切，它在JDBC之上又作了一次封装，从而实现了不用写SQL语句就可以实现操作数据库。

值得提醒的是，这三个框架都是轻量级的，没有侵入性或者侵入性很低，不像EJB这样的重量级框架，它们都能最大限度的实现代码的可复用。

前端开发实习总结篇二

以前在校很少自己做程序，对软件工程更是一无所知。来到公司，开始接触“大规模”（其实现在看来实习的项目其实还是很小的）软件开发，一时真的有些迷茫。比起VSS，MVC，QA，CMMI，我对JAVA，JSP，XML的一窍不通根本不值一提。大家都不想输在“起点”，所以都默契地在加班，这样一直持续了实习的两个月。

刚来的时候“始业教育”显得慢吞吞，我们还经常盘算去哪哪玩之类的。我和FLYSKY（20个新生里唯一一个南区的兄弟，软件学院的）还经常出去吃各种小吃，每到一处都尝尝本地的风味，这是他的习惯。之后开始的培训还不是很难过，JAVA，C++，ORACLE，老师们讲的很“好”，可以说是非常好，好得我们没有几个人能听懂。大家开始发愁，我也是每天晚上都基本看书到10点。

“我心说得亏哥们我还练过”，来之前的2月份我就自己买了一本THINKING IN JAVA，看懂看不懂怎么说也算是准备了一下JAVA，C++虽说没去上过课，但凭我的直觉我就一下看中这东西很有用，自己也看过一阵。至于ORACLE，虽然不了解，但毕竟因为佩服“云飞扬”的性格和敬业精神，咱SQL选修也不是白混的。专业倒还有点“基础”，再加上咱这自学能力也不是吹的，基本维持。可等到后来的日语课就全迷糊了：本就没有语言天赋，再加上记忆严重欠缺，总是特别害怕去上日语课。不过特别喜欢那个老师说话的感觉，加上她一直对我都很好，所以还是很用心的学着。

随着培训的收尾，我们开始正式进入项目。从需求分析，概要设计到详细设计，我们一步一步的开始接触软件开发的每个细节。最受不了的就是每天都要记“周报”，填写自己的劳动成果。因为这个我还被QA通报了好几次呢，真的很郁闷。其实现在我很感谢这种制度化的东西，某些情况下好习惯的养成是要靠强制来确保的。详细设计之后就是企盼已久的编码，我心想终于可以做点“正事”了。现在回头一看才知道，其实编码只占软件开发的整个过程劳动量的1/4左右，而且其他的环节也不是想象中的那么无足轻重。

编码我其实做的很不好，主要是因为需求分析阶段就没有认真仔细的理解需求和规格说明，加上编码时一个关键时段我回校和老同学叙旧。那阵项目经理（PM）就经常和我们说，“有问题自己想办法，不要经常问我”。PM其实是在叫我们自己酝酿，遇到难题只有“憋”一“憋”才能有真的收获。而我不在的那三天正好是大家技术/思路上的一个“跃迁”，很多难题的解决方法都基本成熟，大家的编码也接近50%了，所以回来时我感觉已经掉队很多。再一个就是编码中期时机器出问题，环境搭不上了，这使我更加紧张和急躁，大大影响了我的士气。后来利用五一其间的加班我终于赶完了自己的模块，达到了第一个里程碑。其实从发现落后到加班赶完这段经历，对我来说也具有里程碑的意义。不仅考验了我自己的能力和心理素质，也证明了我对集体的责任感和合作意识。我可以叫别人来帮我做赶上进度，但那样我会错过自己学习的机会，以后再遇到难题我还是不行；我也可以硬着头皮导致项目延期，那样我以后的日子保证不好过，而且这么做也不符合我的性格。事实证明我顶住压力独立完成任务不管是对集体还是对我个人都是一件大好事。

第二篇：web前端开发知识点总结

HTML知识总结

span

行级元素，多个

同行块级元素，独占

一行块级元素，前后

保留一行

标题标签，h1~h6表6个等级，加粗，前后保留一行width：设置宽

度height：设置高

度alt：图片加载失败显示的文本

div

文本类

p

h

图片标签img

color：颜色

水平线常用标签

hr

size：高度（粗

细）width：宽度（长度）herf：超链接转到的地址

超链接a

target

_self:默认值，在当前页面打开_blank:在新窗口

打开

带标题的框fieldsetlegend设置标题

disc：实心圆

无序列表

列表标签

有序列表

ul

square：小方块

olcircle：空心圆

tr表示行

th

表示标题单元格，居中、加粗

td

表格标签

caption

表示一个单元格

表示标题，定义在第一行，居中

rowspan

设置单元格占的行

数

colspan

设置单元格占的列

数

action表单提交地址

get：显示提交参数，将参数用?和&拼接到url上

带到服务器端

method

post：隐式提交参

数optgroup 表示分组,分组不能选,只能选分组中的option

下拉菜单

selected默认选中

multiple 设置下拉菜单为多选模式

表单项

rows: 显示文本的行数(高度)

文本域</p><p>cols: 显示文本的列</p><p>数(宽度)</p><p>name：参数名</p><p>size：显示字符长度（控制文本框长</p><p>度）maxlength：最大可</p><p>输入字符数</p><p>input文本框type=“text”</p><p>placeholder：提示</p><p>内容</p><p>disabled：不会被提交到服务器readonly：只读（会被提交到服务</p><p>器）</p><p>value：默认值</p><p>密码框</p><p>type=“password”单选按钮type=“radio”复选框</p><p>type=“checkbox”文件选择框type=“file”</p><p>按钮</p><p>type=“button”提交</p><p>type=“submit”checked：默认选</p><p>中</p><p>input</p><p>按钮</p><p>重置type=“reset”</p><p>noresize：不能改变框架大小</p><p>frame：表示框架</p><p>scolling：是否显示滚动条（yes、no、auto）设置框架集在纵向上的拆分策略设置框架集在横向上的拆分策略</p><p>rows</p><p>cols</p><p>border</p><p>框架集<frameset></p><p>框架边框的宽度</p><p>borderColor框架边框颜色</p><p>frameBorder</p><p>设置框架是否有边框(yes|no)_blank:新窗口中</p><p>打开_self:在当前窗口</p><p>打开</p><p>框架集中的超链接打开方式target_parent:父窗口</p><p>中打开_top在最顶层窗口中打开frameName：在对应name框架打</p><p>开</p><p>ifame</p><p>在页面中嵌入框架</p><p>dl、dt、dd其他标签</p><p><dl></p><p><dt>数码</dt> <!--dt不会缩进--><dd>手机</dd> <!--dd会缩进--></dl></p><p>marquee：滚动标签</p><p><img src=“usemap_img.jpg” usemap=“#yifuMap”></p><p><map name=“yifuMap” id=“yifuMap”><area</p><p>shape=“circle”</p><p>coords=“309,257,20”target=“_blank”</p><p>href=“http://5新标签</p><p>number：数字输入</p><p>date picker：日期选择</p><p>datalist：自动提示</p><p><datalist id=”arealist“><option>sichuan</option><option>chongqing</option><option>guangzhou</option><option>shanghai</option><option>beijing</option><option>tianjin</option></datalist></p><p><input type=”text“ list=”arealist“></p><p>video：动画</p><p>媒体</p><p>radio：音频</p><p>autocomplete：是否关闭自动提示（off |</p><p>on）html5新标签</p><p>autofocus: 自动获得</p><p>焦点</p><p>required: 表示控件</p><p>必须输入内容</p><p>controls : 播放控制条</p><p>autoplay ：自动播放</p><p>loop ：循环播放preload ：预加载，如果设置了autoplay，就可以不用设置preload</p><p>CSS知识点总结</p><p>内联：直接在标签的style属性上编写</p><p>样式<input type=”text“ style=”color: blue;background-color: #eeeeff;“>样式定义方式</p><p>样式块：在style标签中编写样式块，并通过一定规则（选择器）应用到对应的那些标签上(通常写在head中)</p><p><style>span {</p><p>color: green;</p><p>background-color: #eeffee;}</p><p></style></p><p>外部样式文件：将样式块编写在外部的css文件中(不用写style标签)* 在需要使用样式的页面通过link标签引入样式文件(通常写在head中)</p><p><link href=”hehe.css“ rel=”stylesheet“></p><p>id选择器#xxx 针对id为xxx的标签</p><p>类选择器.xxx 针对class属性为xxx的标</p><p>签</p><p>标签选择xxx 针对标签名为xxx的标签</p><p>*选择器选择所有元素选择器</p><p>后代元素关系选择selector1 selector2 {...} 针对selector1下的所有的selector2</p><p>子元素关系选择selector1 > selector2 {...} 只针对selector1的selector2子元素(如果有后代selector2元素则不会应用)</p><p>紧邻兄弟关系选择selector1 + selector2 {...} 只针对紧接在selector1后的selector2元素</p><p>所有随后的兄弟关系selector1 ~ selector2 {...} 针对selector1后的所有的selector2兄弟元素</p><p>color：字体颜色</p><p>font-size：字体大小</p><p>font-family：字体样式</p><p>字体</p><p>font-weight: bolder(加粗)| normal(不加粗)font-style: 设置字体倾斜(normal | italic | oblique)*italic和oblique实际显示效果</p><p>几乎一致font-variant: 设置字体显示为小型大写字母</p><p>text-align: 水平对齐方式(left | center | right)常用属性</p><p>vertical-align: 垂直对齐方式(top | middle |</p><p>bottom)</p><p>line-height: 设置行高(通常用于设置文本居</p><p>中)</p><p>white-space: nowrap 不换行, pre 当做pre标签</p><p>border: 边框(1px solid</p><p>red)</p><p>文本</p><p>width: 宽度</p><p>underline 下划线</p><p>height: 高度</p><p>overline 上划线</p><p>text-decoration: 文本装</p><p>饰</p><p>line-through 贯穿线(删</p><p>除线)</p><p>blink 闪烁</p><p>none 无</p><p>dtext-shadow: 3px 3px 5px red;第一个参数: 阴影水平位置(x轴上的偏移量)</p><p>text-shadow: 文本阴影</p><p>第二个参数: 阴影垂直位置(y轴上的偏移量)</p><p>第三个参数: 模糊程度第四个参数: 阴影颜色</p><p>padding：内边距</p><p>padding: xxpx;</p><p>padding: xxpx xxpx;</p><p>padding: xxpx xxpx xxpx;</p><p>padding: xxpx xxpx xxpx xxpx;padding: auto;</p><p>padding: xxpx auto;padding-toppadding-leftpadding-rightpadding-bottom盒子模型</p><p>margin：外边距</p><p>margin: xxpx;</p><p>margin: xxpx xxpx;</p><p>margin: xxpx xxpx xxpx;</p><p>margin: xxpx xxpx xxpx xxpx;margin: auto;</p><p>margin: xxpx auto;margin-topmargin-leftmargin-rightmargin-bottom</p><p>border：边框</p><p>color：颜色；width：宽度；</p><p>style：outset|inset|solid|double|dottedborder-radius: 10px;/* 同时设置4个角*/</p><p>background-color: 背景颜色</p><p>background-image: 背景图片</p><p>background-repeat: no-repeat | repeat-x |</p><p>repeat-y | repeat背景</p><p>background-position: xxxpx xxpx | xx%</p><p>xx%;(可以为负数)</p><p>background-size: xxxpx xxpx | xx% xx% |</p><p>cover | contain;(不能为负数)</p><p>cover: 拉伸,可以超出contain: 拉伸不能超出</p><p>background-attachment: scroll(随着内容</p><p>一起滚动)| fixed(不滚动)</p><p>hidden：隐藏</p><p>scroll：滚动</p><p>overflow：当内容溢出</p><p>时的处理方式</p><p>visible：直接显示</p><p>auto：如果溢出就滚动，否则不显示滚动条</p><p>visible 显示</p><p>visibility：设置元素是</p><p>否显示</p><p>hidden 隐藏，保留占位</p><p>none：隐藏，不保留占</p><p>位</p><p>block：设置为块级元</p><p>素</p><p>display：设置元素是否</p><p>显示</p><p>inline：设置为行级元</p><p>素</p><p>布局</p><p>inline-block：设置为行</p><p>内块元素</p><p>left 左浮动</p><p>float: 浮动right 右浮动</p><p>none 不浮动</p><p>left 不允许左边有浮动</p><p>clear: 清除浮动right 不允许右边有浮动</p><p>both 不允许两边有浮动</p><p>ul或ol 自带样式：</p><p>列表样式</p><p>list-style-type: 列表项的样式</p><p>margin: 16px 0px;padding: 0px 0px 0px</p><p>40px;</p><p>absolute：如果有父元素被定位按照父元素的原点进行定位，否则按照浏览器原点进行定位</p><p>position</p><p>定位</p><p>z-index: 设置z轴的值，越大越在最前</p><p>relative：相对定位参照元素本身的位置</p><p>fixed：固定位置，不</p><p>会滚动</p><p>link 超链接默认样式</p><p>hover 鼠标悬停样式</p><p>active 鼠标点击样式</p><p>visited 访问之后的样式（主要控制颜色）</p><p>伪类</p><p>focus 获得输入焦点的样式</p><p>first-child 第一个元素</p><p>last-child 最后一个元素</p><p>:not 不包含指定的选</p><p>择器</p><p>:noly-child 是父元素的唯</p><p>一子元素</p><p>cursor 鼠标样式</p><p>其他样式</p><p>box-shadow 阴影</p><p>translate:平移</p><p>rotate：旋转transform：变换</p><p>scale：缩放</p><p>skew：扭曲</p><p>matrix：以变换矩阵变换</p><p>第一个值表示需要过渡的样式属性transition 过渡</p><p>transition:transform2s,background-color.5s;</p><p>第二个值表示整个过渡过程需要的时间第三个值表示过渡时的贝塞尔曲线第四个值表示延迟多久才开始过渡animation 动画</p><p>@keyfarmes 关键帧用于定义动画的细节（每一帧如何显示）</p><p>@keyframes myanimation {0% { background-color: #cfc;}30% {</p><p>background-color: #ccf;border-radius: 50px;}80% {</p><p>width: 300px;</p><p>background-color: #fcc;}</p><p>100% {</p><p>width: 300px;height: 300px;</p><p>background-color: #000;}}</p><p>@-o-keyframes myanimation {}@-ms-keyframes myanimation {}@-moz-keyframes myanimation {}@-webkit-keyframes myanimation {}</p><p>需要显示动画的地方通过animation属性来使用声明的关键帧</p><p>.ac:active {</p><p>animation: myanimation 5s;-o-animation: myanimation 5s;-ms-animation: myanimation 5s;-moz-animation: myanimation 5s;-webkit-animation: myanimation 5s;}opacity透明度从0.0 ~ 1.0 0.0完全透明，1.0 完全不透明浏览器兼容前缀</p><p>-webkit-chrome，safari, opera-o-opera</p><p>-moz-firefox</p><p>-ms-ie（ie9以上）</p><p>JavaScript</p><p>javascript代码必须包含在<script></script>标签中</p><p>也可以书写到外部的.js文件中,通过<script src=”xxx.js“></script>来引入</p><p>script标签只能同时做一件事情.如果既有src属性也包含代码则只会执行外部文件的代码</p><p>通过alert来弹出提示框</p><p>通过document.write来输入文本到页面上(可以输入标签)Number: 数值型整数和小数Boolean: 布尔型(true |</p><p>false)</p><p>String: 字符串</p><p>字符串必须被”“或''包含必须对称</p><p>如果字符串中包含引号可以单引号中包含双引号或者是双引号中包含单引号</p><p>也可以使用'来表示一个单引号”来表示一个双引号</p><p>n 表示换行数据类型</p><p>t 表示制表符表示书写方式</p><p>NaN: Not A Number 当使用非数字来进行运算时的值</p><p>undefied: 未定义</p><p>null: 空值</p><p>substring 截取子串, 从start到end-1处,如果</p><p>没指定end则取到最后一个字符</p><p>toUpperCase 将所有字符变成大写</p><p>toLowerCase 将所有字符变成小写</p><p>indexOf 查找子串首次出现的位置, 如果找不到则</p><p>返回-1字符串处理</p><p>lastIndexOf 查找子串最后一次出现的位置, 如果找不到则返回-1charAt 取指定位置上的字符slice 也是取子串,效果和substring一样可以用-1,-2,-3...从末尾</p><p>开始计数split 将字符串按照指定的字符进行拆分成为数组</p><p>获取当前时间var now = new Date()</p><p>获取指定时间的日期对象</p><p>var date = new Date(yyyy,MM,dd,HH,mm,ss)</p><p>设置指定时间(将时间对象设置为一个指定时间)</p><p>now.setFullYear(yyyy,MM,dd,HH,mm,ss)</p><p>now.setMonth日期Date</p><p>now.setDatenow.setHours</p><p>...获取指定时间信息</p><p>now.getFullYear()// 年只能取出年份,如: 2015</p><p>now.getMonth // 月0-11月</p><p>now.getDate // 日</p><p>now.getDay // 星期0-6(0表示星期天)</p><p>now.getHours // 时24小时制</p><p>now.getMinutes // 分now.getSeconds // 秒now.getMilliseconds// 毫秒</p><p>通过new Array()来创建数组var names = new Array();</p><p>var names = new Array(“小王”, “大王”, “炸弹”);// 创建时给数组设置默认值</p><p>//用json格式表示数组</p><p>var names = [];</p><p>var names = [“小王”, “大王”, “炸弹”];数组Array</p><p>可以通过length来设置或获取数组的长度</p><p>push : 往数组末尾添加元素</p><p>pop: 删除并返回数组的最后一个元素unshift: 往数组的开头添加元素shift: 删除并返回数组的第一个元素reverse: 颠倒数组顺序</p><p>sort: 按“字符串”的自然排序规则进行升序</p><p>splice: 删除指定位置处的指定个数元素并将第三个参数之后的参数添加到被删除位置(设置第二个参数为0则实现只添加不删除, 之传入两个参数实现只删除不添加)</p><p>slice: 获取start到end处的子数组</p><p>join: 将数组元素以指定分隔符进行连接成为字符串</p><p>function xxx(....){</p><p>声明函数</p><p>....}</p><p>var xxx = function(...){</p><p>...函数变量</p><p>}var ooo = xxx;</p><p>ooo();函数</p><p>function fn(fx){</p><p>fx();</p><p>将函数作为参数</p><p>}fn(function(){</p><p>...});（function(...){</p><p>立即执行函数</p><p>....})(...);</p><p>getElementById 根据id获取唯一的元素var xx = document.getElementById(“xx”);DOM(Document Object Model)文档对象模型</p><p>获取元素</p><p>getElementsByTagName 根据标签名获取元</p><p>素数组</p><p>onclick 鼠标点击事件</p><p>getElementsByClassName 根据类获取元素数组(如果元素被改变了class值将会从数组</p><p>中删除)</p><p>onmouseover 鼠标进入事件</p><p>onmouseout 鼠标离开事件</p><p>onmousemove 鼠标被移动</p><p>onmousedown 鼠标按钮被按下事件机制</p><p>onmouseup 鼠标按钮被松开</p><p>onkeydown 某个键盘按键被按下</p><p>onkeyup某个键盘按键被松开</p><p>onload 一张页面或图像被完成加载</p><p>onchange 域的内容被改变</p><p>onfocus 元素获得焦点</p><p>onblur 元素失去焦点</p><p>setTimeout: 延迟执行(只会执</p><p>行一次)var xx = setTimeout(xxx, 1000);setTimeout(“fn();”, 3000);BOM(Browser Object Model)</p><p>window</p><p>清除使用clearTimeout(xx);setInterval: 定时执行(间隔指</p><p>定时间循环执行)</p><p>xx.offsetLeft获取元素的位置和尺寸(只读)</p><p>xx.offsetTopxx.offsetWidthxx.offsetHeight</p><p>var xx = setInterval(xxx,1000);</p><p>清除使用clearInterval(xx);</p><p>[] 表示[]中的字符任意取一个</p><p>在[] 中的^ 表示非不包含该字符</p><p>()表示将多个表达式合并为一个表达式</p><p>在()中的|表示将两个匹配条件进行逻辑“或”（Or）运算。+ 前一个表达式出现至少一次1~n {1,}* 前一个表达式出现任意次0~n {0,}? 前一个表达式出现0~1次{0,1}{n} 前一个表达式出现n次</p><p>{n,} 前一个表达式出现至少n次{n,m} 前一个表达式出现n~m次.任意字符(不包含rn)正则表达式</p><p>^ 匹配字符串的开头$ 匹配字符串的结尾</p><p>w 表示一个任意的单词字符包括_ [a-zA-Z0-9_] * 不包含破折号</p><p>W 对w取反(不包含单词字符)[^a-zA-Z0-9_]d 表示一个数字字符[0-9]D 对d取反[^0-9]s 表示一个任意空白字符空格中文状态的空格制表符全角空格</p><p>S 对s取反非空格n 换行符b 单词边界</p><p>B 不是单词边界(对b取反)</p><p>eval</p><p>执行字符串形式的代码。</p><p>for(var i in array){var item = array[i];</p><p>}</p><p>for(var key in obj){var value = obj[key];</p><p>}</p><p>迭代数组迭代出的值为数组的下标</p><p>for...in</p><p>迭代对象迭代出的值为对象的属性名其他</p><p>with</p><p>设置以某个对象为代码块作用域对象</p><p>delete attribute删除属性</p><p>isNaN</p><p>如果被判断值不是一个数字则返回true，否则为false</p><h2><a name="3" >第三篇：前端开发心得</a></h2><p>web前端核心技术</p><p>从事前端开发工作1年多了，从最初的DIV+CSS学起，到现在学到html5、css3、javascript，jquery等等，我觉得前端要学的技术太多了，很多人认为前端开发要掌握的技能简单，就是网页制作，其实不然，前端开发是网站的前台代码实现，包括基本的HTML和CSS以及JavaScript/ajax，现在最新的高级版本是HTML5、CSS3，以及SVG等。JavaScript作为最难的语言之一，许多编程高手也不敢妄自菲薄、自封精通。</p><p>关于兼容性的问题我相信对于每个做前端开发的人来讲是一个很头疼的问题，互联网目前主流浏览器有IE6789，Firefox，Chrome，Opera，Safari，遨游，包括国内主流的搜狗，腾讯 TT，360等等；从内核上讲主要有IE的，遨游版IE，safari，firefox以及opera的，这些都是大家常见的。所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，用户用什么浏览器来查看同一网站，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。这个时候就需要针对不同的浏览器写不同的CSS，这个过程叫CSS hack。虽然我们写代码都要求按照标准，不写hack代码，但实际工作中为了兼容主流浏览器，hack代码是免不了的，所以这也应该是每个前端开发人员必备的技能。</p><p>前端的开发工具很多，比较常见的有Dreamweaver，Notepad，webstrom，Sublime Text等等，我现在在使用webstorm，强大的提示功能可以帮助我们很快的熟悉并掌握网页布局,检查错误等。调试代码的工具我使用的Firebug。Firebug是网页浏览器Mozilla firefox 下的一款开发类插件，它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体，是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀，从各个不同的角度剖析Web页面内部的细节层面，给Web开发者带来很大的便利。Firebug也是一个除错工具。用户可以利用它除错、编辑、甚至删改任何网站的CSS、HTML、Dom 以及Javascript代码。</p><p>以上是自己做前端开发的一点心得，它所涵盖的知识面远远不止这些，我也在不断的学习，不断地丰富自己，希望自己能在前端这个职位上开阔自己的一片天地！</p><h2><a name="4" >第四篇：WEB前端开发经验总结</a></h2><p>ASP.NET前端开发经验总结</p><p>通过此次大作业的设计到完成，我负责的是web前端的开发，经过此次作业和结合W3C上的自学，我渐渐有了一些对前端开发的小小经验（仅为个人意见）。WEB标准是什么？</p><p>说是WEB标准，不过我这里主要是对HTML5 和 CSS3.0的一些经验总结。因为WEB含盖的内容实在是太多了，“WEB标准”是一系列标准的总称，包括HTML5.0、HTML4.0、XHTML1.1、CSS3.0、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0等等。所以这里要跟大家指出来一下，WEB标准不是我们所说的DIV+CSS。刚刚上面提到了――DIV+CSS，这里要说明下，这样说其实是不正确的。DIV+CSS准确的说法（个人的理解）应该是：采用W3C推荐的WEB标准中的HTML5结合CSS3.0样式表制作页面的方法，DIV应该指的是HTML标签，而CSS显示是指的CSS样式表了。</p><p>采用WEB标准开发的好处</p><p>那么W3C为什么会推荐这样的页面制作方法呢？下面我们就简单的看看采用WEB标准开发（个人理解的）相对以前TABLE布局的优势有哪些？</p><p>1、节约运营成本</p><p>看看我们的WEB标准制作方法是如何做到的？</p><p>采用WEB标准制作，我们可以做到表现很形式的分离，我们用XHTML来表现（数据），用CSS来控制（页面元素呈现的）形式。写的好的页面，XHTML代码中基本上都是用户要看的数据，还其他修饰性的东西，全部由我们的CSS来控制。这样一来我们的（XHTML）页面的体积就大大减小了，这样你在带宽上的费用就会大家降低了，这个怎么降低的，你可以想象一下，YAHOO的首页小1K，100W个人一起访问，那么带宽节约了多少？而且可以更充分的利用带宽。</p><p>而我们的CSS控制了，所有的页面元素的样式，现在想改网站的整体风格，你只需要花几分钟修改一下一个CSS文件，就可以轻松搞定了。维护的成本也下来了，省了不少钱了吧？还有，你开这个页面的速度会快很多啊，一个让你等半分钟的页面，除非里面的信息对你很有用，不然我们大家基本都没有太多的时间去用来等待的。</p><p>2、对用户友好更友好，且有机会获得更多的用户 现在来说说用户友好。首先我想把我们的用户来分下类。第一类：普通用户（每个访问我们网站的人）； 第二类：搜索引擎；</p><p>采用WEB标准开发的页面，结构清晰，页面体积小，浏览器兼容性好。普通用户访问的时候，页面打开速度快，而且不管用户使用那种浏览器，都能够正常访问（显示）页面，且页面的结构清晰，要找的数据可以很方便的浏览到。</p><p>而对搜索引擎来说，一个好的采用WEB标准开发的页面，都是做过SEO优化的，它访问起来很友好，很容易理解你的页面中哪里是标题（H1~H6标签），哪里是段落（p标签），哪里是段落里要强调的内容（strong标签）等，它可以很容易的分析出来。而一个SEO好的站点，大家都知道，被搜索引擎收录的机会更多，这个也意味着您的网站会被更多的普通用户访问到，给你的站点带来更多的用户。</p><p>一个能帮我们省下大笔费用，提高工作效率。同时又能够提高页面浏览速度，对用户友好，甚至能够不花钱宣传，就能给你带来更多用户的技术。你说你会不会去使用它？这个也正式我们的W3C推荐使用WEB标准开放网站的原因啊。而这个技术也得到了我们广大用户的认可，所以现在需要学习WEB标准啊。合理的布局</p><p>前面我提到了一些知识点――“结构清晰、SEO优化、页面体积小、HTML代码中基本上都是用户要看的数据”。这些东西，都是我做了合理布局的结果。而且我个人觉得，我们采用WEB标准制作的一切都是从这个知识点开始的，所以我这里就先来说这个话题。</p><p>也许有人会问，怎样的一个页面，才算是合理的布局的呢？这个问题问题问得好，也是我们大家刚开始学用WEB标准的问得最多的问题之一，我也曾经常被这个问题所困扰，这里就说说我对合理布局的一些理解。</p><p>在开始讲合理布局的页面要达到的要素前，我们还是用个实例来讲解会更直观些。先来看看这个图片：</p><p>不错，这个是一个文章详细页，没有左右两栏布局，不过这里我重点要讲的是合理的布局。</p><p>这是此次实验中customer（前端的一项）部分的完整代码：</p><p><%@ Page Language=“C#” AutoEventWireup=“true” CodeFile=“Customer.aspx.cs” Inherits=“Customer” %> <%@ Register Src=“Controllers/Bottom.ascx” TagName=“Bottom” TagPrefix=“uc4” %> <%@ Register Src=“Controllers/Top.ascx” TagName=“Top” TagPrefix=“uc1” %> <%@ Register Src=“Controllers/Left.ascx” TagName=“Left” TagPrefix=“uc2” %> <html> <head></p><p><title><%=Titlep %></title></p><p><meta http-equiv=“Content-Type” content=“text/html;charset=gb2312” /> <meta content=“<%= Descriptionp%>” name=“description”/> <meta content=“<%=Keywordsp %>” name=“keywords” /></p><p><link href=“Images/css.css” rel=“stylesheet” type=“text/css” /> </head></p><p><body style=“text-align: center”> <form id=form1 runat=server></p><p><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px”></p><p><tr></p><p><td style=“width: 100px”></p><p><uc1:Top ID=“Top1” runat=“server” /></p><p></td></p><p></tr> </table></p><p><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px;background-color: #ffffff;”></p><p><tr></p><p><td style=“height: 395px”></p><p><table border=“0” cellpadding=“0” cellspacing=“0” style=“width: 778px”> <tr> <td width=“183” align=“left” valign=“top”><table width=“183” border=“0” cellspacing=“0” cellpadding=“0”></p><p><tr></p><p><td><div align=“left”></p><p><uc2:Left ID=“Left1” runat=“server” /></p><p><h2><a name="5" >第五篇：WEB前端开发经验总结</a></h2><p>WEB前端开发经验总结</p><p>发布时间：2009-04-20 09:05:33来源：作者：shengman点击：21015</p><p>这里跟大家谈谈个人对WEB前端开发的一些经验（当然都是个人的一些理解，有什么地方说的欠妥或不对的地方还请包含和指正），这里我就从WEB标准开始吧。</p><p>WEB标准是什么？</p><p>说是WEB标准，不过我这里主要是对XHTML1.1 和 CSS2.1的一些经验总结。因为WEB含盖的内容实在是太多了，“WEB标准”是一系列标准的总称，包括HTML4.0、XHTML1.1、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0等等。所以这里要跟大家指出来一下，WEB标准不是我们所说的DIV+CSS。刚刚上面提到了――DIV+CSS，这里要说明下，这样说其实是不正确的。DIV+CSS准确的说法（个人的理解）应该是：采用W3C推荐的WEB标准中的XHTML1.1结合CSS2.0样式表制作页面的方法，DIV应该指的是XHTML标签，而CSS显示是指的CSS样式表了。</p><p>采用WEB标准开发的好处</p><p>那么W3C为什么会推荐这样的页面制作方法呢？下面我们就简单的看看采用WEB标准开发（个人理解的）相对以前TABLE布局的优势有哪些？</p><p>1、节约运营成本</p><p>看看我们的WEB标准制作方法是如何做到的？</p><p>采用WEB标准制作，我们可以做到表现很形式的分离，我们用XHTML来表现（数据），用CSS来控制（页面元素呈现的）形式。写的好的页面，XHTML代码中基本上都是用户要看的数据，还其他修饰性的东西，全部由我们的CSS来控制。这样一来我们的（XHTML）页面的体积就大大减小了，这样你在带宽上的费用就会大家降低了，这个怎么降低的，你可以想象一下，YAHOO的首页小1K，100W个人一起访问，那么带宽节约了多少？而且可以更充分的利用带宽。</p><p>而我们的CSS控制了，所有的页面元素的样式，现在想改网站的整体风格，你只需要花几分钟修改一下一个CSS文件，就可以轻松搞定了。维护的成本也下来了，省了不少钱了吧？还有，你开这个页面的速度会快很多啊，一个让你等半分钟的页面，除非里面的信息对你很有用，不然我们大家基本都没有太多的时间去用来等待的。</p><p>2、对用户友好更友好，且有机会获得更多的用户</p><p>现在来说说用户友好。首先我想把我们的用户来分下类。</p><p>第一类：普通用户（每个访问我们网站的人）；</p><p>第二类：搜索引擎；</p><p>采用WEB标准开发的页面，结构清晰，页面体积小，浏览器兼容性好。普通用户访问的时候，页面打开速度快，而且不管用户使用那种浏览器，都能够正常访问（显示）页面，且页面的结构清晰，要找的数据可以很方便的浏览到。</p><p>而对搜索引擎来说，一个好的采用WEB标准开发的页面，都是做过SEO优化的，它访问起来很友好，很容易理解你的页面中哪里是标题（H1~H6标签），哪里是段落（p标签），哪里是段落里要强调的内容（strong标签）等，它可以很容易的分析出来。而一个SEO好的站点，大家都知道，被搜索引擎收录的机会更多，这个也意味着您的网站会被更多的普通用户访问到，给你的站点带来更多的用户。</p><p>一个能帮我们省下大笔费用，提高工作效率。同时又能够提高页面浏览速度，对用户友好，甚至能够不花钱宣传，就能给你带来更多用户的技术。你说你会不会去使用它？这个也正式我们的W3C推荐使用WEB标准开放网站的原因啊。而这个技术也得到了我们广大用户的认可，所以您现在需要学习WEB标准啊。温习完了基础课程，现在正式开始讲XHTML和CSS的技巧了。</p><p>合理的布局</p><p>有朋友会开始问了，怎么一开始就开始讲合理的布局了呢?前面我们提到了一些知识点――“结构清晰、SEO优化、页面体积小、XHTML代码中基本上都是用户要看的数据”。这些东西，都是我们做了合理布局的结果。而且我个人觉得，我们采用WEB标准制作的一切都是从这个知识点开始的，所以我这里就先来说这个话题。</p><p>那么大家又会开始问，怎样的一个页面，才算是合理的布局的呢？这个问题问题问得好，也是我们大家刚开始学用WEB标准的问得最多的问题之一，我也曾经常被这个问题所困扰，这里就说说我对合理布局的一些理解。</p><p>在开始讲合理布局的页面要达到的要素前，我们还是用个实例来讲解会更直观些。先来看看这个图片： 不错，这个是一个文章详细页，没有左右两栏布局，不过这里我重点要讲的是合理的布局，在稍后的文章中我会详细的介绍浮动元素。好，回到刚才的话题，大家看到了这个页面了。</p><p>我这里先把代码写给大家看看（省略了部分代码）：</p><p><!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” <html xmlns=“http://.cn”>domain</a>来源：<a href=“http://” target=“_blank”>domain.com</a>发布时间：2008年4月28日</div></p><p>代码篇</p><p>之前整理发表了《XMLHTTPRequest的属性和方法简介》</a>,它Ajax要使用的核心的技术之一，现在就来实际运用它。这个Ajax标签导航，是我很久前就写的一个脚本，很实用的（还被很多网站收录了哦），现在拿它来做实例讲解吧！当然个人能力有限，有什么不对的地方还请多包含!</p><p>效果大家看到了，核心功能有：<br /></p><p>1、将当前选中标签以特殊的样式显示<br /></p><p>2、将异步加载的页面信息显示到指定的DOM节点中</p><p>我们来看看处理脚本的代码吧：</p><p><div class=“code-title”>程序代码：ajaxtab.js</div></p><p><div class=“js code” name=“code” id=“js-code”></p><p><!--<br /></p><p>// 判断是否支持ActiveX<br /></p><p>var useActiveX=(typeof ActiveXObject!= “undefined”);<br /></p><p>// 判断是否支持DOM<br /></p><p>var useDom=document.implementation && document.implementation.createDocument;<br /></p><p>// 判断是否支持XMLHttpRequest对象<br /></p><p>var useXmlHttp=(typeof XMLHttpRequest!= “undefined”);<br /></p><p>// XMLHttpRequest对象版本<br /></p><p>var ARR_XMLHTTP_VERS = [“MSXML2.XmlHttp.6.0”,“MSXML2.XmlHttp.3.0”];<br /></p><p>// DOM对象版本 <br /></p><p>var ARR_DOM_VERS = [“MSXML2.DOMDocument.6.0”,“MSXML2.DOMDocument.3.0”];<br /> /* =============<br /></p><p>* 函数名称：$(i)<br /></p><p>* 参数说明：i超链接<br /></p><p><span></span>-标签间的分割线<br /></p><p>我罗列的这些东西，相信大家开始看出了些头绪了，呵呵，不过别急！在我们看处理的脚本之前，先让我们来看看导航标签的样式，主要是看看我们对分割线的处理(一点CSS处理的技巧)。</p><p>本来想偷个懒，让大家看我上边说的那篇文章，想想也就是Ctrl+C&Ctrl+V,都贴出来吧！呵呵！！</p><p>不过还没有完，最后要说的就是innerHTML这个特性，这里我们还要感谢微软啊，innerHTML就是它的专利，我们就是用它来改变指定DOM内的HTML字符串的，而不用刷新页面。详细的信息大家还是google</p><p>一下吧，我也要休息下啊！喝口茶先！^-^！</p><p>以上讲了这么多，我们最后来看看，我们这个ajax标签导航都用到了那些技术吧：</p><p><ol></p><p><li>XHTML</li></p><p><li>CSS</li></p><p><li>Javascript</li></p><p><li>DOM</li></p><p><li>XMLHttpRequest对象</li></p><p><li>innerHTML</li></p><p></ol></p><p>还有XML，我们这个例子没有涉及到。东西虽小，包含的（web前端开发）知识可是都用到了啊，我把我会的点东西都端出来了（要失业了），呵呵！</p><p>当然我很喜欢跟大家多交流，以后有时间，我们在来谈谈CSS的HACKS技巧，Javascript DOM编程等等的，今天就收工了，谢谢捧场先！！</p><p></div></p><p>Copyright ©2007-2008 <a</p><p>href=“domain.comhttp://”>domain.com</a>, All rights reserved.Powered By: <a href=“domainmailto:haixiao_yao@yahoo.com.cn”>domain</a></p><p></body></p><p></html></p><p>看出来什么没有？（代码是很多）可能大家已经发现，整个页面里基本上都是用户要看的数据，其中只包含了很少（必要）的布局(XHTML)标签（请允许我这么说）。整个页面基本都是由最基础的h1~h6、p、ul、ol、li、form、div标签来实现的。</p><p>说到这里就要讲到我在前面提到的“结构清晰、SEO优化、页面体积小、XHTML代码中基本上都是用户要看的数据”，看看我的这个例子做到了没有？</p><p>结构清晰--也就是我们常说的，XHTML标签要结构化（语意化）。</p><p>什么叫结构化？</p><p>由于个人认为这个知识点是十分重要的，所以请允许我在这里多罗嗦几句，我们采用WEB标准的方法制作页面的优势就体现在页面结构清晰。我们以前用table布局的时候，我们的表现（数据）和形式（布局样式）是混在一起的，有很多冗余的数据混杂在一起，而大家再看看我上面给大家展示的代码，很明显，结构十分清晰。</p><p>说了半天，还是没有说什么是结构化，什么才是结构清晰啊？不要急。还记得我刚才提到的那几个标签吗？</p><p>h1~h6--如果你要显示的数据是作为标题显示的时候，就用这些标签，因为这个标签的意思就是说，这个是一个标题，不仅我们的用户很容易理解h-head的英文字母缩写，我们的另外一个用户搜索引擎也可以很容易理解它。呵呵，看到了吧，一个充分结构化的页面，对用户是十分友好的。</p><p>p--Paragraph（段落）</p><p>ul--unorglized list(无序的列表)</p><p>ol--orglized list(有序的列表)</p><p>li--list item(列表项)</p><p>form--表单</p><p>div--division(区域)</p><p>我这么一写，大家估计开始明白了，原来XHTML标签是有着自己的意义的（至于其他的标签的语意义，大家可以自己到W3C看看它的解释，也可以查看语义化你的HTML标签和属性），所以我们讲要语意化的意思，就是用合理的标签来显示数据，比如前面提到的，是标题，就应该用h1~h6标签，如果是一个段落的介绍文字，那么就应该使用p标签，如果是显示的一个没有顺序的列表，就应该用ul标签，如此...所以看这个例子里</p><p><p><strong>Ajax标签导航实例详解</strong></p></p><p>这么写就是很合理的，h2标签就说明这里是个标题。而这么写：</p><p>复制内容到剪贴板代码:</p><p>.title{</p><p>font-size:18px;</p><p>...}</p><p><div class=“title”>Ajax标签导航实例详解</div></p><p>虽然你用了strong来强调说明这部分文字，但是还是没有h2标签来的直接明了。</p><p>还有这么写</p><p><div class=“ariticle-title”><p><strong>Ajax标签导航实例详解</strong></p></div></p><p>也不是我们推荐的，可以不用嵌套层的地方，我们尽量不要去过多的嵌套层，减少嵌套会让我们的浏览器解析起来会更容易，速度更快。</p><p>所我们使用WEB标准开发页面，绝对不是单纯的把以前的table换成DIV就OK了。而采用标准制作页面，也不意味着我们就不使用table。只要把握我刚才说的原则，使用合理的标签显示相应特征的数据。其实我们的table标签是一个很好的用来显示二维数据的标签，而table标签也确实是设计出来用来显示数据的，而不是用来布局的，只是我们当时的设计师们都用table标签来布局了。</p> </div> </article> <a href="#" tpid="25" target="_self" class="download_card jhcdown" rel="nofollow"> <img class="download_card_pic" src="//static.xiexiebang.com/skin/default/images/icon_word.png" alt="下载前端开发实习总结五篇word格式文档"> <div class="download_card_msg"> <div class="download_card_title" style="text-decoration:none;">下载前端开发实习总结五篇.doc</div> <div class="download_card_tip">将本文档下载到自己电脑，方便修改和收藏，请勿使用迅雷等下载。</div> </div> <div class="download_card_btn"> <img src="//static.xiexiebang.com/skin/default/images/icon_download.png"> <div class="downlod_btn_right"> <div>点此处下载文档</div> <p>文档为doc格式</p> </div> </div> </a> <div class="post-tags mt20 mb30"><span>相关专题</span> <a href="/tag/qdkfsxthzj/" target="_blank">前端开发实训体会总结</a> <a href="/tag/qdkfsxzj83/" target="_blank">前端开发实训总结</a> <a href="/tag/webqdkfsxzj71/" target="_blank">web前端开发实习总结</a> </div> <div class="single-info mb40"><span class="hidden-xs ">网址：https://www.xiexiebang.com/a15/2019051512/e04890fdd8418b04.html</span><br>声明：本文内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：645879355@qq.com 进行举报，并提供相关证据，工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。 </div> <div class="single-xg mb40"> <div class="con-title"> <h3><a name="6"></a>相关范文推荐</h3> </div> <div class="sticky mb20"> <ul><h2 class="mb20"><a href="/a1/2019051214/aa46f6be7c0a9052.html" target="_blank">前端开发中一些常用技巧总结</a></h2><p>前端开发中一些常用技巧总结 自己前端开发中常用到的一些技巧及问题解决方法,会常更新,希望对前端路上的朋友有帮助. 1.文章标题列表中日期居右显示的两种方法,方法A相对方......</p><h2 class="mb20"><a href="/a6/2019051513/b88b4e7826bc5152.html" target="_blank">Web前端开发笔试题</a></h2><p>Web前端开发笔试题 一．单选题 1. div.box{color:red;} #box{color:blue;} div{ color: yellow !important;} 华章汉辰 Div里的字体的颜色是：（） A:红色B:蓝色 C:绿色 D:黄色 2.......</p><h2 class="mb20"><a href="/a1/201905123/439b1bac5d4afbcb.html" target="_blank">什么是前端开发工程师</a></h2><p>www.xiexiebang.com 什么是前端开发工程师 前端开发工程师是Web前端开发工程师的简称，是近五年才真正开始受到重视的一个新兴职业。Web前端开发技术是一个先易后难的过程，主要......</p><h2 class="mb20"><a href="/a9/2019051420/2f70b7045e283bfe.html" target="_blank">前端开发命名规范范文</a></h2><p>前端开发工作规范 为提高团队协作效率，便于后台人员添加功能及前端后期优化维护，输出高质量的文档，特制订此文档。本规范文档一经确认，前端开发人员必须按本文档规范进行前台页......</p><h2 class="mb20"><a href="/a15/2019051513/100d80379c60323e.html" target="_blank">前端开发面试题及答案</a></h2><p>想要应聘前端开发的求职者，要做好完成面试题的准备。下面是由小编分享的前端开发面试题及答案，希望对你有用。前端开发面试题及答案1、对Web标准以及W3C的理解与认识?答：标签闭......</p><h2 class="mb20"><a href="/a1/2019051215/8bedfb12bd8b5bcd.html" target="_blank">Web前端开发学习笔记分享</a></h2><p>www.xiexiebang.com免费试学/ 一对一辅导/项目实训/就业保障 Web前端开发学习笔记 对于Web前端初学者而言，前人的学习经验及总结，能让自己的学习事半功倍；我在泛艺学苑学习Web......</p><h2 class="mb20"><a href="/a1/2019051215/5599684434896db4.html" target="_blank">一些前端开发优化的经验总结</a></h2><p>一些前端开发优化的经验总结 发现的一篇关于前端优化的文章，总结的很全面，要做到面面俱到很难，往往是想优化而没有时间去优化，就像我们公司，一个项目连着一个项目~新员工的培训都......</p><h2 class="mb20"><a href="/a1/2019051215/03392d54bf8fb3ad.html" target="_blank">web项目前端开发经验总结（大全）</a></h2><p>web项目前端开发经验总结 最近这一个月完成了自己的第一个java web项目，是给某杂志社做的在线投稿系统，虽然进度很慢，但是中间确实学到了不少东西，深刻体会到了自己看几个月书都......</p></ul> </div> </div> </div> </div> <div class="right-content-box wow fadeInRight delay300 right-content"> <script src="/e/member/login/loginjs.php"></script> <div class="sidebar"> <div id="sidebar" role="complementary"> <aside id="recent-posts-3" class="widget widget_recent_entries"> <h3 class="widget-title">猜你喜欢</h3> <ul class="new-list"><li><a href="/a12/2019051420/c8748cadf2733c86.html" title="2017年前端开发面试题(含答案)5篇" target="_blank">2017年前端开发面试题(含答案)5篇</a></li><li><a href="/a1/2019051215/e622727dade0f71c.html" title="前端实习周记" target="_blank">前端实习周记</a></li><li><a href="/a3/2019051211/c1cdc64f63497a0c.html" title="web前端实习经验" target="_blank">web前端实习经验</a></li><li><a href="/a10/201905147/89261fed7bac3b16.html" title="Web前端开发技术人才培养模式研究" target="_blank">Web前端开发技术人才培养模式研究</a></li><li><a href="/a1/2019051215/9f4bcca624c725cb.html" title="web前端面试总结" target="_blank">web前端面试总结</a></li><li><a href="/a1/2019051215/6ca6f49899da528b.html" title="前端课程阶段总结[★]" target="_blank">前端课程阶段总结[★]</a></li><li><a href="/a1/201905123/de1492cf1830a618.html" title="网站开发实习总结" target="_blank">网站开发实习总结</a></li><li><a href="/a1/2019051215/3ef300ef805c4ad6.html" title="Web前端开发培训中es5与es6语法知识点总结" target="_blank">Web前端开发培训中es5与es6语法知识点总结</a></li><li><a href="/a1/2019051123/2bc3c60d716d950d.html" title="WEB前端开发经验总结1（写写帮推荐）" target="_blank">WEB前端开发经验总结1（写写帮推荐）</a></li><li><a href="/a6/2019051514/a74d73e74120263c.html" title="2017年web前端开发学习路线规划小结" target="_blank">2017年web前端开发学习路线规划小结</a></li></ul> </aside> </div> </div> </div> </div> </div> </section> <section id="footer" class="p30"> <div class="container"> <div class="footer-top clearfix"> <div class="copyr"> <div class="footer-menu clearfix mb10"> <ul class="footer-menu-con"> <li><a href="/a1/">1号文库</a></li><li><a href="/a2/">2号文库</a></li><li><a href="/a3/">3号文库</a></li><li><a href="/a4/">4号文库</a></li><li><a href="/a5/">5号文库</a></li><li><a href="/a6/">6号文库</a></li><li><a href="/a7/">7号文库</a></li><li><a href="/a8/">8号文库</a></li><li><a href="/a9/">9号文库</a></li><li><a href="/a10/">10号文库</a></li><li><a href="/a11/">11号文库</a></li><li><a href="/a12/">12号文库</a></li><li><a href="/a13/">13号文库</a></li><li><a href="/a14/">14号文库</a></li><li><a href="/a15/">15号文库</a></li> </ul> </div> <p>Copyright © 2018 <a href="/">写写帮文库</a> All Rights Reserved   <a target="_blank" href="http://www.beian.miit.gov.cn" rel="nofollow"> 云ICP备11051236号</a>   <script type="text/javascript" src="//static.xiexiebang.com/skin/default/js/tj.js"></script></p> </div> </div> </div> </section> <script type='text/javascript' src='//static.xiexiebang.com/skin/default/js/superfish.js'></script> <script type='text/javascript' src='//static.xiexiebang.com/skin/default/js/jquery.slicknav.js'></script> <script type='text/javascript' src='//static.xiexiebang.com/skin/default/js/xs.js'></script> <div class="right_bar hidden-xs "> <ul> <li class="rtbar_li1" style="left: 0px;"><a><img src="//static.xiexiebang.com/skin/default/images/rtbar_liicon3.png"><span id="call_tel"></span></a></li> <li class="rtbar_li2"> <a href="javascript:void(0);"> <img src="//static.xiexiebang.com/skin/default/images/rtbar_liicon4.png"> </a> <div class="rtbar_shwx" style="display: none;"> <img width="188" height="188" alt="微信二维码" src="//static.xiexiebang.com/skin/default/images/wechat.png"> </div> </li> <li class="rtbar_li3" style="left: 0px;"> <a href="tencent://message/?uin=8524560123&Menu=yes"> <img src="//static.xiexiebang.com/skin/default/images/rtbar_liicon2.png"> 点击咨询 </a> </li> <li class="rtbar_li5"><a href="#1">第一篇</a></li> <li class="rtbar_li6"><a href="#2">第二篇</a></li> <li class="rtbar_li7"><a href="#3">第三篇</a></li> <li class="rtbar_li8"><a href="#4">第四篇</a></li> <li class="rtbar_li9"><a href="#5">第五篇</a></li> <li class="rtbar_li10"><a href="#6">更 多</a></li> <li class="rtbar_li4 gotop"> <a href=""><img src="//static.xiexiebang.com/skin/default/images/rtbar_liicon1.png"> </a></li> </ul> </div> </body> </html>