前端:初识html [问题点数:50分]

Bbs1
本版专家分:0
结帖率 0%
Bbs5
本版专家分:4294
Bbs1
本版专家分:0
Bbs10
本版专家分:186808
Blank
进士 2009年 总版技术专家分年内排行榜第七
Blank
金牌 2009年9月 总版技术专家分月排行榜第一
Blank
银牌 2009年8月 总版技术专家分月排行榜第二
Blank
红花 2011年11月 Web 开发大版内专家分月排行榜第一
2009年10月 Web 开发大版内专家分月排行榜第一
2009年9月 Web 开发大版内专家分月排行榜第一
2009年8月 Web 开发大版内专家分月排行榜第一
2009年7月 Web 开发大版内专家分月排行榜第一
2009年6月 Web 开发大版内专家分月排行榜第一
2007年7月 Web 开发大版内专家分月排行榜第一
2007年6月 Web 开发大版内专家分月排行榜第一
Bbs1
本版专家分:0
Bbs1
本版专家分:0
其他相关推荐
Html学习笔记8:初识CSS
标准格式:  选择符{   属性名:属性值;   属性名:属性值;   ……  } css颜色 1.颜色的英文单词 2.十六进制 #00 ff 00 红,绿,蓝 两两是一位,可以简写成三位 3.rgb 颜色  格式1:rgb(0,0,255) 三位都放数值,取值范围是0-255,红,绿,蓝  格式2:rgb(0%,100%,0%) 三位都放百分数,取值范围为0%-
web前端专题:day1--HTML初识
一,扩展     1,谷歌浏览器控制台调试程序:         鼠标右键-->检查-->console控制台     2,sublime扩展         1,创建文件方式              1)双击标题栏,ctrl+s保存              2)ctrl+n新建文件              3)左侧栏文件夹上鼠标右键-->新建文件(推荐使用)...
开心网页面,使用CSS3
最近学习了不少CSS3的相关知识,认识了CSS3的强大,一直有一本CSS3实战的书,经常也不断的翻阅,但总是看了就忘记了,完全没得了影响,所以一直没得效果,最近发现了一个很好的学习方法,那就是做HTML页面提高自己。每次做一个页面,再不会像以前在浩瀚的前台代码中乱飘,其实有针对的在实战中提高,更容易理解相关样式和标签,这个推荐大家试试咯,今天写的事开心网www.kaixin.com的首页,感觉比前
第一章课后简答题
第一题: 设计数据库的步骤: 1.收集信息 2.标识实体 3.标识每个实体的属性 4.标识实体之间的关系 第二题: 三大范式:    第一范式:其目标是确保每列的原子性。    第二范式:在第一范式的基础上更进一层,其目标是确保表中的每列都和主键相关。    第三范式:在第二范式的基础上更进一层,其目标是确保每列都和主键有直接相关,而不是间接相关。 第四题:
HTML初始化CSS总结
记录一下经常用到的淘宝的CSS初始化代码,以方便后续使用。 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } body, bu...
零基础HTML学习历程 (一) 初识HTML
首先我是拿着这本书开始我的HTML入门之旅的(如下图) 对这本书的评价在网上都有,我就不多说了哈。 先给HTML下个含义:HTML是超文本标记语言(HyperText Markup Language)的缩写,用来建立网页的结构。与它形影不离的一个好兄弟是css(这个同时在另外的文章里面专门会讲),他们两个好兄弟一起工作,是我么用来创建网页的语言。 初次见面
网页设计基础
初识网页设计,了解HTML和Dreamweaver,学习HTML代码
jQuery快速高效制作网页第五章上机4
shangji4.html .one{ width:600px; font-size:12px; } .one .top{ background-color:#fff; height:33px; line-height:33px; width:700px; padding-left:28px; color:#168750; font-weight:bo
3章 上机习题
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Threading.Tasks; using
第四章html上机练习4 开心餐厅介绍页面
开心餐厅介绍页面 h2{ font-size:18px; color:red; } p{ font-size:12px; color:red; } #a{ color:green; } #b{ font-size:24px; color:green; }
.net网页开发点击按钮回到初始设置
网页每次点击按钮会重新加载初始化值,所以要设置非第一次加载时不再刷新。使用关键字IsPostBack,将以下代码加到 xxx.aspx.cs 的Page_Load中即可。if (!IsPostBack) //第一次加载,执行初始值。IsPostBack默认为False { BindDate(); }如:...
前端历程(一)------初识前端
前言 ​ 刚刚接触前端这一概念和基础知识是大一下学期的时候,有一门课程叫做客户端技术。起初只是把它当做一门一般的非考试课对待,上课也不认真听,到最后结课让提交大作业时,也是因为巧合之下那学习选择了一门公选课——多媒体网页设计,学会了使用DW(Dreamweaver,不推荐使用),随随便便的做了个网页就叫上去了。到了大二开始学了新的课程就没有再写过网页。真正的了解前端,开始认真地写网页是在一次机缘下...
第一章 初识Java
什么是Java语言 Java是于 1995年 由Sun公司推出的 极富创造力的 面向对象程序设计语言 它由Java之父——Sun研究院院士 詹姆斯·高斯林(James Gosling)博士 亲手设计而成,并完成了Java技术的 原始编译器 和 虚拟机 Java是一种通过 解释方式 来执行的语言,是一种 跨平台 的程序设计语言,“一次编写,到处运行”。 与C++相比,J
Python初识第一课
Python 3.6.5   Python是什么类型的语言?Python是一种面向对象、解释型、动态类型计算机程序设计语言解释型:程序无需编译成二进制代码,而是在执行时对语句一条一条编译动态类型:在程序执行过程中,可以改变变量类型强类型的动态脚本语言强类型:不允许不同类型相加动态:不使用显示数据类型声明,且确定一个变量的类型是在第一次给它赋值时脚本语言:一般也是解释型语言,运行代码只需要一个解释器...
HTML上机练习3
北大青鸟网站 .text{ font-size:18px; line-height:40px; text-align:center; } .tet{font-size:12px; color:#666 tet-align:center;} .ddd{font-size:12px; color:#000; text-indent:2em;} .eee { font-size: 12
初识 windows 上机练习
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Threading.Tasks; using
html初识
http://www.codecademy.com/a5858545/codebits/QeIukb http://www.codecademy.com/a5858545/codebits/y4Gu2G http://www.codecademy.com/a5858545/codebits/j8LCDj http://www.codecademy.com/a5858545/codebits/
初识html
今天看了看html的视频,很短,但是感觉收获很大,因为这个视频解开了我很多在牛腩视频中的疑惑,所以看完之后很兴奋,虽然视频只是入门级别的,但是终于对bs中的这些"     看完之后,又自己做了个小demo,大家有兴趣的话可以粘下来看看,如果没兴趣,可以粘其中的href看看小说。。。
初识Html
1.1网页的基本架构: 内容:如文字,图像等,一般由Html代码负责实现。Html(展示图片、文字、多媒体信息的超文本语言) 样式:如颜色、字体大小等修饰,一般由css代码负责实现,css是层叠样式表的缩写。 行为(动作):如一些网页特效(横幅广告)、鼠标移过表颜色、单击弹出登录框或信息提示框等,这些一般由 J
初识HTML
rnrnrn rnrnrn Hellornrnrn请问,为什么我 view in browser的时候,前面没有"http://"rn我见教程都有"http://"?
HTML基础之初识HTML
什么是 HTML? HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 (markup language) 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页 HTML 标签 HTML 标记标签通常被称为
HTML 初识
HTML文档 HTML 文档也被称为网页 HTML 文档包含 HTML 标签和纯文本 Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML标签(相当于是隐藏的格式描述),而是使用标签来解释页面的内容: 下面我们具体来看一看对应的解释: html> body> h1>First Headingh1>
【HTML】-初识
前言 HTNL:Hyper Tezt Markup Language 超文本标签语言。 在记事本中就可以书写代码,也是最简单的工具,也可以在NotePad++编辑器中书写
HTML初识
HTML是超级文本语言,它是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页的各个部分。它本身是一种文本文件,可通过文本文档来编写。HTML语言比较简单,懂得一些基本的英语单词,理解起来也就很简单了,因为它就是一些简单英语的组合。     这一部分包括两个内容的学习,HTML视频和《HTML从入门到精通》,虽然后面那本书是辅助材料,不过讲的内容比视频
前端html js 调用相机识别二维码
前端html js 调用相机识别二维码,很给力 前端html js 调用相机识别二维码
template学习模版
template学习模版,html前端模版,template学习模版,html前端模版
Web前端开发规范
html css js 基础 前端学习的规范 html css js 基础 前端学习的规范
初识.net界面程序(11)--实现界面登陆
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Wi
html初识
这篇文章将给大家展现一个大致的html的世界,让大家心里对一个大致的方向以及格式有一个较为大概的了解,内容中可能会出现较为深入的代码知识,不必惊慌,这些代码知识以后都会持续在文中讲解,想要学习请持续关注我的文章。
语音识别初识
语音识别
HTML中定义CSS样式的三种方式
 1:在head标签中加载一个CSS文件示例: rel="stylesheet" type="text/css" href="style.css" />以下是style.css的内容,此例使用了link标签.abbr {     font-size:12px;}.text10pxwhite{     font-size:10px;
天猫静态 前端html
天猫静态 前端html
初识大数据
初识大数据大数据已经火了有两年了,第一篇相关的博客,实在是有些懒散,虽然工作中没有用到,但这是一个趋势,不仅仅是搞IT的,各行各业在未来都会与大数据有关系。去年已经读过《大数据时代》这本书,印象中比较深的还有几点: 1. 大数据时代人们不一定点找到因果关系,大数据会挖掘出事物之间的相关关系。这一点是思维方法的一个根本的转变,在一些情况下,只需要知道相关关系就能够创造价值。 2. 不是抽样调查,而
前端html特殊字符
前端html特殊字符
Html关于前端学习
Html关于前端学习
JavaScript对象及初识面向对象
JavaScript中的基本数据类型 number(数值类型)string(字符串类型)boolean(布尔类型)null(空类型)undefined(未定义类型)object  对象是什么 对象是包含相关属性和方法的集合体。在JavaScript中,对象是拥有属性和方法的数据,属性是与对象相关的值,方法是能够在对象上执行的动作。 什么是面向对象 面向对象仅仅是一个概念或者编程思想通过一种叫做原型...
80套html前端模板
80套html前端模板
初识SAP的ERP
刚开始接触SAP,记录个人的学习成长。 ERP(Enterprise Resource Planning)     ERP是建立在现代企业先进管理思想基础之上,利用信息技术为企业提供决策、计划、控制和业务评估的全方位、系统化的解决平台。     核心思想:将企业中的所有资源整合集成,将企业的三大流(物流、资金流、信息流)进行全面一体化管理,实现企业资源的调配和优化配置。
联动下拉框
前端数据交互,包含前端html,css样式的基础上进行的数据交互
初识前端之WEB】
关于W3C(World Wide Web Consortium):万维网联盟 W3CSchool 是因特网上最大的 WEB 开发者资源,其中包括了全面的教程和完善的参考手册以及庞大的代码库。当然它对于我们这种初级学习编程的人来说,是一个非常不错的网站! 先来了解什么是WEB? WEB其实就是无数网页文档的集合,也就是一个个网页所组成的,它能够将各类信息和服务进行无缝连接,并提供生动的图形用...
初识前端~css初始化
花了点时间,把一些门户及大型网站的样式初始化罗列了下来(仅供参考)腾讯QQ官网(http://www.qq.com)样式初始化body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea,select{margin:0;padding:0}body{font:12px"宋体","Arial Narrow...
初识前端gulp
本人是后台java&php 工程师,由于前端同事的离职,暂无人交接,项目工程交至本人手中。 对前端框架一窍不通,但是相信大部分人,都知道前端框架再丰富,无非就是html+css+js。 拿到项目后,发现项目使用了gulp,头蒙了,这是什么东西 查询后,发现是一个相当于针对自己已经写好的css及js文件等,构建目录及压缩文件为目的的一个框架(ps:我学习第二天,这是我理解的功能)。
HTML第四章 上机5
员工团队风采页面 北大青鸟始终以人才作为企业的核心资本。为了吸引、激励和保留优秀人才,公司为员工提供完善的培训与发展体系,关注员工成长,同时在兼顾市场竞争力和内部公平的基础上为员工提供全面、富有竞争力的薪酬福利体系。良好的企业发展前景、 广阔的个人发展平台、快乐向上的工作环境,是青鸟人一直秉承的核心要素 >我们的管理团队 北大青鸟始终以人才作为企业的核心资本。为了吸引、
网页制作上机练习题目
【第一章】 上机练习: 1、下载Dreamweaver 8的安装软件,练习Dreamweaver 8的安装、启动、关闭和卸载。 (从ftp://web@210.28.58.241网站下载) 2、启动Dreamweaver 8进入其工作界面,分别指出各个组件及其功能。 3、在本地计算机D盘建立一个文件夹,以本人姓名和学号命名,如“李明0701010101” 。 然后创建一个站点,站点的名称以本人的姓名的拼音小写字母来命名,如“李明”的站点名称为“liming”。 在站点根目录下新建images、photo、music、flash、main等5个文件夹, 在站点根目录下新建index.html、01.html、02.html、03.html、04.html、05.html、06.html、abc.html等8个页面文件。
第四章CSS3课后作业
1.制作北大青鸟总裁致辞页面<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>总裁致辞页面</title> <h2 style="font-size: 18px&qu
前端学习——标签初识
1.HTML的标签大部分元素都有一个开始标记和结束标记,如<h1></h1>在开始标记和结束标记之间可以填充Placeholder text<h>系标题 header的缩写,随着数字变大字体变小<p>段落<img>图片,自封闭元素<a> anchor 链接到外部或实现内部跳转,href为地址<ul><
前端gulp初识和入门
gulp的基本搭建流程。主要是搭建一个可用的gulp环境。在开发的时候遇到问题可以作为笔记翻阅。
初识前端模板
blog:[url=http://blog.csdn.net/zswang/article/details/6591272]http://blog.csdn.net/zswang/article/details/6591272[/url]rnwiki:[url=http://code.google.com/p/ace-engine/wiki/FrontTemplateAbc]http://code.google.com/p/ace-engine/wiki/FrontTemplateAbc[/url]rnrn作者:[url=http://weibo.com/zinkey]yaya[/url] [url=http://weibo.com/zswang]王集鹄[/url]rnrn[b]总述[/b]rnrn  “模板”这个词,可能很多人第一印象是后端的技术(Smarty,Velocity等),但本文要讲的却不是后端的概念,而是前端开发中所使用到的一种技术,也就是“前端模板”技术。rnrn  模板的工作原理可以简单地分成两个步骤:模板解析(翻译)和数据渲染。这两个步骤可分别部署在前端或后端来执行。如果都放在后端执行,则是像Smarty这样的后端模板,而如果都放在前端来执行,则是我们要探讨的前端模板。rnrn[b]问题[/b]rnrn  随着前端交互的复杂性不变提升,无刷新页面数据传输与渲染越发地频繁化,我们发现传统的前端开发方式在ajax数据渲染等方面存在着一个主要问题:繁琐的数据渲染。当前端从后台通过ajax等方式或许到数据后,如果要将这个数据渲染到指定的dom元素中,则需要进行各种字符串拼接工作或者一系列创建元素的工作,还不论细节的问题(单引号双引号问题等),不管是哪一种形式,都是繁琐且费时的。同时,在可读性与维护性上也存在问题。试想,各种循环操作的字符串拼接,元素创建插入,在需要修改时,都需要重新花费不少时间与精力。那有什么方法可以解决这个问题呢?rnrn[b]原理[/b]rnrn  当我们在JSP中写[code=HTML] [/code]的时候,其实就是在应用模板,在后台这句话会被转换成 [code=Java]out.print(" "+name+"") [/code]。模板的数据渲染就是把模板中的占位符(这里是“name”),替换成传入的值(比如替换成“yaya”)。而在前端开发中,这种方式依然具有很高实用价值。前端模板的核心是前端模板引擎,引擎将前端的模板语言转换成浏览器可以解析的html语言。当转换成功后,便可以很方便地将这段html代码放到我们希望的地方去。rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040518zzeK.gif][/img]rnrn  比如我们可以写一段循环的li标签的前端模板语言。通过前端模板引擎转换后成本一连串得li标签的html语言。这时候就可以直接采用innerHTML方法把html代码插入到ul对象中,那么就完成了生成ul列表的功能。rnrn[b]初识[/b]rnrn  前端的模板核心是模板解析引擎,而解析引擎的主要作用是将模板语言转换成html/xml格式。不同的前端模板有着不同的模板语言,解析引擎因此也各不相同。让我们先来认识几款前端模板,了解下它们各自的模板语言。rnrn  YayaTemplate?是一款轻量级的模板引擎,采用原生javascript语法,具有易学易用等特点。我们来看一段用YayaTemplate?渲染列表数据的实例:rnrn  模板语言(通用过for循环,输出“这是第n列”的li列表)rn[code=JScript]rnfor(var i=0;i这是第 % i % 列:% list[i] % $rn[/code]rnrn  有了模板语言后,我们只需要将数据“打入”模板语言中的“list”,就可以生成我们想要的html/xml格式了。如上例,我们只需要得到这个模板语言进行翻译,并调用对应的render方法,rn[code=JScript]rnvar list = ["红桃", "方块", "梅花", "黑桃"];rnvar html = YayaTemplate(templateText).render(list:list);[/code]rnrn  这个html则是模板引擎转换成的html/xml语言,在上例中,则为:rnrn[code=HTML] 这是第0列:红桃rn 这是第1列:方块rn 这是第2列:梅花rn 这是第3列:黑桃[/code]rnrn  从这个例子中,我们可以发现,$...$表示输出的html/xml片段,%...%表示输出javascript变量。得到的html,我们可以用直接作为dom的innerHTML或者其他用处。rnrn  这便是前端模板,它使得我们不必去处理字符串拼接等问题,用最直观的方式来渲染数据。我们再来看另外一款前端模板 EasyTemplate? 。还是之前的例子,用EasyTemplate?模板写法如下:rnrn[code=HTML]rn 这里是第$list_index 列:$listrnrn[/code]rn  同样,需要将实际数据替换模板变量,这里采用:rnrn[code=JScript]var list = ["红桃", "方块", "梅花", "黑桃"];rnvar html = easyTemplate.render(templateText, list); //templateText指模板语言[/code]rnrn  像EasyTemplate?这样的前端模板,是属于自定义模板语言的一种前端模板。我们可以从上例看出,“”就是EasyTemplate?自定义的循环条件。像这样EasyTemplate?模板一样采用自定义标签的前端模板还有LiteTemplate?:rnrn[code=XML]rn 这里是第$for.index列:$itemrn[/code]rnrn  渲染时采用:rnrn[code=JScript]var list = ["红桃", "方块", "梅花", "黑桃"];rnvar html = liteFunction(templateText, 'list')(list);[/code]rnrn  好了,我们再来看看jquery作者John Resig所写的一个前端模板jQuery Template。说真的,它如同jQuery一样,短小精悍。还是老例子:rnrn[code=HTML]< list.length; i++) %>rn 这是第 列:rn[/code]rnrn  渲染采用:rnrn[code=JScript]var list = ["红桃", "方块", "梅花", "黑桃"];rnvar html = tmpl("templateid", list);[/code]rnrn  我们可以看出,YayaTemplate?与jQueryTemplate在模板语言的写法上正好相反。前者将输出html语言做特殊标记$...$,而后者对javascript语言做特殊标记。这两种模板已经使得学习成本很低了,而接下来介绍的AceTemplate的写法将更加简单易懂。rn[code=JScript]rnfor (var i = 0; i < list.length; i++) rn 这是第 #i 列:#list[i]rn[/code]rnrn  渲染采用:rnrn[code=JScript]var list = ["红桃", "方块", "梅花", "黑桃"];rnvar html = AceTemplate.format("templateid", list:list);[/code]rnrn  AceTemplate采用了html与js语言直接混搭的风格,在两者间可以直接的书写,不用添加任何的标志用以区分不同的语言。而在html语言里面,使用js变量则采用[i]#[/i]的方式输出。AceTemplate之所以可以兼容html与js混合写法,是通过按行解析来实现的。所以,如果代码能够保证html语言与js按行划分,这样的用法其实是很方便的。并且AceTemplate值得说明的一点是支持自动编码防止xss漏洞,通过[i]#[/i]渲染出来的javascript变量,已经经过了编码处理,这一点是很方便的。而对于不需要这个功能,需要原文输出的时候,AceTemplate也提供了[i]!#[/i]方法来满足这种需求。rnrn  通过上面对四个前端模板的简单介绍,我们可以了解到不同前端模板的各种形态,这包括写法与用法等直观印象。但我们知道,前端模板的核心是代码的转换,这肯定是需要转换时间的,那就以上四个不同的前端模板,性能上会有怎样不同的表现呢。rnrn[b]性能[/b]rnrn  前端模板语言到html/xml语言,是通过模板引擎进行翻译的。而模板引擎的翻译性能在某种程度上决定了前端模板解决方案的可行性的高低。上诉四种前端模板,各自的性能会是怎么样的,我们对它们进行测试。分别对YayaTemplate?、EasyTemplate?、jQueryTemplate、AceTemplate、LiteTemplate?部署前端模板做同样的操作,比较模板引擎翻译时间代价。rnrn 各自的模板代码如下:rn YayaTemplate?rn[code=JScript]rn for (var i = 0; i < list.length; i++) rn if (irn < 100)>rn 小于100 这里是第$list_index 列:$listrn rn 不小于100 这里是第$list_index 列:$listrn rn [/code]rnrn jQueryTemplaternrn[code=HTML] rn 小于100 这里是第列:rn rn 不小于100 这里是第列:rn rn [/code]rnrn AceTemplaternrn[code=JScript] for (var i = 0; i < list.length; i++) rn if (i<100)rn 小于100 这里是第#i 列:#list[i]rn rn elsern 不小于100 这里是第#i 列:#list[i]rn rn [/code]rnrn LiteTemplate?rnrn[code=XML] rn rn 小 于100 这里是第 $!for.index 列:$!itemrn rn rn 不小于100 这里是第$!for.index 列:$!itemrn rn [/code]rnrn  然后我们改变list数组里面的元素个数,对各个模板翻译执行的时间进行记录。结果如下(xp+ie6/ie8/firefox/chrome运行环境):rnrn  [b]模板翻译时间对比表(第一次翻译并渲染数据 时间单位:毫秒)[/b]rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040534IE00.gif][/img]rnrn  通过第一次翻译后,如果前端模板可以缓存翻译后的中间代码,或者可以返回构建中间代码的函数,那么再次渲染数据的时候,就不需要再翻译。这样可以极大的缩小渲染数据的时间,提高速度。rnrn  [b]综合各种调研数据对比表如下:[/b]rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040541Wwjc.gif][/img]rnrn[b]兼容[/b]rnrn  前端模板的兼容性也是一个重要的问题。能够实现用户不同的前端模板需求,将前端模板语言正确翻译成html/xml语言,是优秀的前端模板所需要具备的特点。而通过对以上四款前端模板的测试,并没有发现严重的兼容性问题。但在一些细节上,还是发现了一些问题如下表:rnrn  [b]兼容性测试对比表[/b]rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040555PBu9.gif][/img]rnrn[b]流程[/b]rnrn  对于“什么是前端模板,它有什么特性,怎么使用”这样的问题已经通过上面的分析说明给出了答案。但前端模板既然是前端的范畴,就不可能独立存在,而是需要运用到前端开发的流程中的。而采用了前端模版的开发流程与传统的相比又会是怎么样的呢?rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040563bub5.gif][/img]rnrn  上图是传统的开发流程。首先将ui设计图转换成html的页面,其中的数据一般先用模拟数据代替。比如,ui设计有个列表,那么可能开发人员会先建立一些模拟的数据填充到节点中,来开发调整页面样式。最后一步,则将需要动态生成(ajax应用等)的地方,将模拟数据的节点变成空白节点,然后在javascript里面拼装这些html节点的字符串,最后再还原到原节点处(比如用innerHTML插入html)。rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040575UvOH.gif][/img]rnrn  上图是一个实例。当列表中的元素需要ajax动态加载的时候,在传统开发中可能按照先开发模拟数据的html页面,再将这些元素拼接成html字符串,之后再进行一系列处理的功能。rnrn  那么,它的问题是什么呢?很明显,“不可逆”是最大的问题。当开发者完成了开发,这时候如果需要修改,那么将是很头疼的事。由于是由字符串拼接出来的html片段,想直接修改这些字符串来改变结构或是修改样式什么的将是一个比重新开发一遍还要具有挑战的工作。所以,开发者往往选择再来一遍吧:html的模拟数据页面,然后再拼接字符串。除了“不可逆”,维护性差以及开发成本高都是采用传统方式开发富客户端应用的弊病。rnrn  好吧,我们试着改变这个局面。看看下图,采用前端模板开发的新方式,或许会找到某些答案。rnrn[img=http://hi.csdn.net/attachment/201107/7/0_1310040584Zc99.gif][/img]rnrn  “双向可逆”,是的,采用前端模板的开发方式,在开发好展示的html页面后,直接经过简单的修改即可生成html+template 页面,无需再拼接字符串,无需再反复重写展示模拟数据的html页面,一切都变得很轻松。我们来看看代码便知道原因了(以ace template为例)。rnrn[img=http://hi.csdn.net/attachment/201107/7/0_13100405909zS1.gif][/img]rnrn  如果调用模板引擎,当模板执行数据执行后,直接覆盖parentNode里面的内容。而如果想继续调整html结构等,则不调用模板引擎即可。而原有的调试数据,在需要发布的时候可以直接通过代码编译去掉debug start与debug end之间代码即可(这仅仅是前端模块开发的一种实例,实际开发中可以去掉模拟数据,不用编译)。rnrn[b]展望[/b]rnrn  前端模板技术其实还有很多的工作要做,比如模板的事件代理,模板的复用性,模板的组件库等等。本文仅对前端模板做了一个大致讲解。相信随着对于前端模板的探索,模板技术会被越来越多得运用的前端开发,特别是富客户端的前端开发中,进一步提高开发效率,为开发人员带来更多的惊喜!rn参考资料rnrn yaya templatern [url=http://uloveit.com.cn/template]http://uloveit.com.cn/template[/url] rn easy templatern [url=http://www.easyui.org.cn/easyTemplate.html]http://www.easyui.org.cn/easyTemplate.html[/url] rn query templatern [url=http://ejohn.org/blog/javascript-micro-templating/]http://ejohn.org/blog/javascript-micro-templating/[/url] rn ace templatern [url=http://code.google.com/p/ace-engine/wiki/AceTemplate]http://code.google.com/p/ace-engine/wiki/AceTemplate[/url]rn [url=http://blog.csdn.net/zswang/article/details/6582563]http://blog.csdn.net/zswang/article/details/6582563[/url] rn lite templatern [url=http://code.google.com/p/lite]http://code.google.com/p/lite[/url]rn [url=http://firekylin.my.baidu.com]http://firekylin.my.baidu.com[/url]
前端】Angular初识
什么是 为什么用 特点
前端程序员面试笔试宝典
前端
前端项目初识
前台vue项目前介 一、 运行环境: node:10.13.0 webpack:打包 二、工程使用的 vue-cli link less link axios link vue生态圈 (iview、vuex、vue-route) es6语法 link 三、初步 3.1 es6用法 1. 变量声明:let a = ‘sss’; 与java不同,js中的变量都是...
一.前端初识
一.前端开发语言介绍 html(Hypertext Markup Language)—— 结构                                超文本标记语言 css(Cascading Style Sheets)—— 样式    层叠样式表 js(javascript)—— 行为 二.html超文本标记语言 标签 标签对 声明文档类型
初识 weex(前端视角)
补充前面知识一点,打包出来的app怎么更换图片,改变下图的图片路径就好https://juejin.im/post/5939148f5c497d006b630d65 我们现在开始,讲讲weex的组件和模块,只讲weex关于前端的部分,因为时间问题,我会结合官网的一些可用的demo和指出一些坑,假如讲得不好,多多担待。 我们在html中,有非常多的标签,weex就是把这些标签编译
前端工程化初识
前端工程化是指把前端当做工程开发,不再把HTML、CSS、JS都写在一起,而是更注重复用。 前端工程化主要分为模块化和组件化。   个人认为模块化类似于封装,将能复用的前端代码进行模块化之后,如何模块化需要一定的技术,JS模块化方案很多有AMD/CommonJS/UMD/ES6Module等,CSS模块化开发大多是在less、sass、stylus等预处理器的import/mixin特性支持
初识css3
编写css3时针对不同的浏览器可能需要不同的前缀: css3能做什么: 选择器:使用css3选择器可以减少在标签中的class和ID的数量,更方便的维护样式表、更好的实现结构与表现的分离。 圆角效果:使用border-radius属性轻松实现圆角 实现块阴影与文字阴影 色彩:CSS3支持更多的颜色和更广泛的颜色定义。新颜色CSS3支持HSL , CMYK ,HSLA and RGBA。 ...
初识前端后端UI
1.定义前端后端 2。前后端开发任务量分析与比较 3.前后端开发模式探讨 4.web UI技术综述
前端基础知识之CSS初识
2.text-indent:用来设置首行缩进的 用法:text-indent:2em;em是一个文本的距离 Text-align:作用这是文本的位置    取值:center设置文本在容器的水平方向上居中,left设置文本容器的水平方向上靠左 right设置文本在容器的水平方向上靠右 Text-decoration:作用设置文本的装饰比日说a标签的下划线   取值 none:没有任何
前端】TypeScript初识
TypeScript概述 什么是TypeScript ​ TypeScript 是微软开发一款开源的编程语言,本质上是向 JavaScript 增加静态类型系统。它是 JavaScript 的超集,所有现有的 JavaScript 都可以不加改变就在其中使用。它是为大型软件开发而设计的,它最终编译产生 JavaScript,所以可以运行在浏览器、Node.js 等等的运行时环境。 ...
XHTML前端初识
对HTML入门初步认识
初识前端】div重叠
一、子绝父相  position:relative  position:absolute ================待添加================
MY_Web_初识前端(未完待续)
html 结构标准 相当于人的身体 css 表现标准 相当于给人化妆, 变得更漂亮 Js 行为标准 相当于人在唱歌, 页面更灵动 渲染引擎渲染引擎是出现兼容性的根本原因常用快捷键 tab 补全代码 ctrl + shift + d 快速复制一行 ctrl + shift + K 快速删除一行 alt + 鼠标左键单击 集体输入 ctrl + shift + ↑
初识前端模板引擎jade
1.什么是模板引擎?(我的理解)模板引擎:为了使用户界面与业务数据(内容)分离而产生的,根据特定的规则生成特定文档,各个领域都可以有自己的模板引擎。 web模板引擎:最终生成的文档是HTML类型。 而这种规则有五花八门,各种各样的规则就是不同的模板引擎。 本文主要讲jade2.jade的安装(windows)jade是基于nodeJs的,所以首先要安装运行环境 nodeJs,包管理工具npm
浅谈初识前端
以下是我对前端的一些个人感想:      前端工程师是一个比较新兴的 IT 职业,潜在的发展空间仍十分巨大,这方面的人才还是不多的,招聘网搜索一下,发现月薪有一万多,前景还不错。所谓前端,就是你在浏览器等终端所见的网页页面。然而仅仅是这么一个网站,当中的学问亦颇深,我们平时遇到的上网活动抽奖,在线支付,多媒体播放,在线小游戏等等都属于前端的工作范畴,其中的魅力不只如此。如果你开始心动于从事前端
HTML第四章上机练习4
上机练习4 开心餐厅,让你可以开心的烹饪美味佳肴,从一个简洁的小餐厅起步,逐步打造自己的餐饮大食代。 烹饪美食,雇佣好友帮忙,装修个性餐厅,获得顾客美誉。 步步精心经营,细心打理,我们都能成为餐饮大亨哦。 如何做菜?
前端文档,前端开发手册
前端文档,前端开发手册,包括整套前端开发手册,css xml ,html ,js...
第四章:javaScript对象及初识面向对象——课后作业:
1,显示学生信息 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;自我介绍&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &am
前端编码规范
前端 编码规范 , JS , CSS , HTML
HTML & CSS命名规范
HTML CSS 前端命名规范,docx
HTML第七章上机练习一
北大青鸟网站导航 #c{border-width:1px; border-style:solid; width:870px;margin:0px auto;} .a{float:left;} .b{float:right;} ul,li{float:left;list-style-type:none; background-color:black; color:white; font-weig
操作系统实验报告 实验一 WINDOWS进程初识
操作系统教程 实验指导书 实验一 WINDOWS进程初识 1、 实验目的 (1) 学会使用VC编写基本的Win32 Consol Application(控制台应用程序)。 (2) 掌握WINDOWS API的使用方法。 (3) 编写测试程序,理解用户态运行和核心态运行。
初识awk
1.awk简介 awk本身是一种编程语言,支持条件判断、数组和循环等,很高大上,但是我们最常用的是它的文本分析功能,通过查看/usr/bin/awk可以看到它链接到gawk,所以我们使用的实际上gawk 2.awk的基本格式 awk [-F field-separator] 'commands' input-file(s)
第四章 JavaScript对象及初识面向对象
1,显示学生信息 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;显示学生的信息&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &
第五章初识jQuery课后作业
1.使用css()方法添加图片边框,单击图片显示图片bian边框 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;/head&gt; &am
算法初识——概念
算法与数据结构是程序的两个重要方面,两者的有机结合构成程序。程序中数据结构和变量用来描述问题的对象,程序结构、函数、语句用来描述问题的算法。对算法分析,通常用执行算法时所占用的空间大小和消耗时间的多少来作为算法优劣的评判条件。算法的时间复杂度的估算常使用到频度,频度是指某一语句在算法运行过程中执行的次数记为F(n),时间复杂度就是使用频度最大的语句来衡量的,记为T(n)=O(F(n))。简单来说就...
第一章 初识java题
晨测 一、选择题: 1. Java语言是哪个公司开发的( )。 A、Oracle B、Sun C、 Adobe D、Microsoft   2. 下列说法正确的是( )。 A、Java程序中的main方法必须写到类里面。 B、Java程序中可以有多个main方法。 C、Java程序的类名必须与文件名一致。 D、Java程序的main方法里如果只有一条语句,可以不用{}括起来。 3
初识C++ 初识C++
初识C++ 初识C++ 初识C++初识C++初识C++初识C++初识C++
【C#】——C#初识
终于学习到C#和设计模式了,记得暑假在宿舍听丹姐和晓璐姐讨论设计模式的时候就觉得肯定很好玩,现在终于轮到我学习啦。虽然是先学C#,再学设计模式,不过有了C#做基础,设计模式才能学得更好嘛。 C# 什么是C# 以前经常听别人说C#,但是根本不了解什么是C#,接触到之后才发现,原来C#也是一门开发语言,就像VB一样。C#是微软公司发布的面向对象、基于.NET Framework基础之上的高级开发
管中窥豹--初识Linux
![linux](http://img5.imgtn.bdimg.com/it/u=3187908769,2597015174&amp;fm=27&amp;gp=0.jpg)#计算机的组成及其功能* 计算机的主要组成部分有硬件和软件; * `硬件`主要包含的有:处理器、控制器、I/O设备,输入设备,输出设备;          主要负责提供硬件性支撑(功能实现的基础设备) * `软件`主要包含的有...
初识HTML和WEB标准
初识HTML和WEB标准 什么是 HTML? HTML 超文本标记语言的缩写(**H**yper **T**ext **M**arkup **L**anguage) HTML 并不是编程语言,而是一种标记语言(markup language) 标记 &amp;amp;amp;amp;amp;lt;英文单词或者字母&amp;amp;amp;amp;amp;gt;称为标记,一个HTML页面都是由各种标记组成。 标记语言 一套标记标签(markup tag) 标记语言 ...
初识云计算.ppt
初识云计算初识云计算初识云计算初识云计算初识云计算初识云计算初识云计算初识云计算
第五章初识jQuery知识点
1.jQuery是一个优秀的JavaScript库,使用它可大大提高Web客户端的开发效率 2.要使用jQuery的功能,需要首先使用jQuery库文件 3.jQuery代码中常见的元素包括工厂函数,选择器和方法 4.$(Doument).ready()与window.onload的使用场合类似,但有差异 5.jQuery程序代码的特色:包含$符号和连綴操作 6.可以将DOM对象转换成j...
Spark学习(1)——初识spark
Spark是什么?   Spark是一种通用的大数据计算框架,就像传统的大数据技术Hadoop的MapReduce,Hive以及Storm流式实时计算引擎等。   Spark包含了大数据领域常见的各种计算框架;比如Spark Core勇于离线计算,Spark SQL用于交互式查询,Spark Streaming用于实时流式计算,Spark MLlib 用于机器学习,Spark GraphX用于...
前端--HTML
学习地址:http://www.shangzekai.xyz/2017/05/07/html基础目录/   一、HTML是什么? 1.超文本标记语言(Hypertext Markup Language,HTML)通过标记符号来标记要显示的网页中的内容。 2.其实就是一套规则,浏览器认识的规则。 3.浏览器按顺序渲染网页文件,然后根据标记符解释和显示内容。 4.对于不同的浏览器,对同一标...
HTML前端
1.JS函数 function getTDtext()         {             var arr = new Array();             var rows = document.getElementById("resourcetable2").rows;             var a = document.getElementsByName("r")
前端】-HTML
前言: 最近开始学前端了,这篇博客主要介绍html的一些主要标签,写完这篇博客,我会用刚学的html做一个简单的登陆界面~~   一、HTML介绍 HTML(Hyper Text Mark-up Language)超文本标记语言,是一种制作万维网页面标准语言。相当于定义一套规则,大家都来遵守它。这样就可以让浏览器根据标记语言的规则去解释它。 浏览器(客户端)向服务端发出请求,服务端会返回字
前端:HTML
 1. 什么是html hyper 超级 text 文本 markup 标记 language 语言 超文本标记语言,俗称网页 2. html 文件结构 以 *.html 或 *.htm 结尾的文本文件 1) 标签一般成对出现:`&lt;标签名&gt; &lt;/标签名&gt;` 2) 最外层的标 3) doctype 用来说明html的版本 例如: &lt;!DOCTYPE ht...
前端——html
1、创建XHTML的快捷键:html:xt+tab键 2、创建HTML5的快捷键:!+tab键 3规范:a.所有的标签小写    b.属性用 “ ” 括起来    c.标签要闭合   d. img标签加上alt属性 4、注释:&lt;!-- ************  --&gt; 5、&lt;h1&gt;——&lt;h6&gt;  :一级标签到六级标签      &lt;br /&gt...
前端-html
大纲: 1.html基础知识 2.html标签讲解
前端——HTML()
占位
前端】HTML
语法和规范 1、所有的html文件后缀名都是以.html或者.htm结尾的,建议使用.html结尾。 2、整个html文件分别有头部分&lt;head&gt;&lt;/head&gt;和体部分&lt;body&gt;&lt;/body&gt;组成。 3、html标签都是由开始标签和结束标签组成(&lt;br /&gt;)。 4、html忽略大小写,建议大家使用小写。 标题标签 标题标签...
前端html
1.常见命名规则总结 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center
我们是很有底线的