全国咨询热线:400-009-1906

全国24小时免费热线

400-009-1906

一篇文章带你解析常见web技术间的关系

时间:2017-10-25 17:25:46   来源:尚学堂   阅读:
  经过程序员培训,往往就能参加并胜任工作了,但是如果你是一个Web开发初学者,在实际工作中还是难免会在网上搜索查询HTML, CSS, XML, JS(Javascript), DOM, XSL等相关知识,然而,随着深入,当你把他们搅在一起,你又糊涂了,你会不停的问,HTML是什么?CSS是什么?XML是什么?JS是什么?它们到底有什么用?无论是网络百科,还是一些IT专题网站,又或者一些牛人博客,他们都会告诉你,某个单一的东西是什么,这类文章很多,但很少有涉及,它们组合起来是什么,有什么用。我想,我写这篇文章,就是为了说明一下这个他们很少涉及的问题。
  归纳、总结、提炼能力是我们进步的发动机,这种能力是可以有意识地培养的,很多时候,用三条说清楚任何问题就是一种能力训练,任何问题如果不能用三条说清楚说明你还没想透。
  在这里,我争取用最根本的语言向大家分别说明HTML, CSS, XML, JS到底是什么,有什么用。然后我们再来看把他们组合起来是什么,有什么用。当然参加过程序员培训的通常都对HTML, CSS, XML, JS有足够了解,可以直接跳过前面的部分看后面的部分。
  1. HTML超文本标记语言 (Hyper Text Markup Language) ,是用来描述网页的一种标记语言。如:Hello World! I'm HTML
  网页文件本身是一种文本文件,通过在文本文件中添加标记,可以告诉浏览器如何显示其中的内容(如:文字如何处理,画面如何安排,图片如何显示等)。
  HTML之所以称为超文本标记语言,是因为文本中包含了所谓“超链接”点。超文本(Hypertext)是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。
  概括,HTML就是整合网页结构和内容显示的一种语言。浏览器按顺序阅读网页文件,然后根据标记符解释和显示其标记的内容。
  2. CSS 层叠样式表单(Cascading StyleSheet)。是将样式信息与网页内容分离的一种标记性语言。程序员培训通常也都会涉及到css的知识,作为网站开发者,你能够为每个HTML元素定义样式,并将之应用于你希望的任意多的页面中。如需进行全局的更新,只需简单地改变样式,然后网站中的所有元素均会自动地更新。这样,即设计人员能够将更多的时间用在设计方面,而不是费力克服HTML的限制。说白了,CSS就是设置网页上HTML元素属性的语言。
  3. Javascript,首先说明JavaScript和Java无关,JavaScript 是属于网络的脚本语言!那么为什么名字如此相似?这是典型的市场营销方面的成功,它的推广成功,也是借了Java的东风。当微软开始意识到Javascript在Web开发人员中流行起来时,微软还是一贯风格,建立了自己的脚本语言,JScript。
  Javascript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象,与Web客户交互作用。例如可以设置鼠标悬停效果,在客户端验证表单,创建定制的HTML页面,显示警告框,设置cookie等等。
  网页中所有的对数据进行判断、操作以及向浏览者反馈信息的本地代码实现部分均是Javascript(当然也有其他的),这样既可以使网页更具交互性,给用户提供更令人兴奋的体验,同时减轻了服务器负担。
  4. Xml可扩展标记语言 (Extensible MarkupLanguage),是一套定义语义标记的规则,这些标记将文档分成许多部件并对这些部件加以标识。它也是元标记语言,即定义了用于定义其他与特定领域有关的、语义的、结构化的标记语言的句法语言。你可以把XML理解为一种数据库,例如rss就是xml的一种变体。
  铺垫终于完了,在进入正题之前,建议大家对比着图来理解后边的内容,废话不多说,开始进入正题。
说明:
  这里的DOM指的是HTML DOM。HTML DOM是W3C的标准,同时它也是HTML的文档对象模型的缩写(the Document Object Model for HTML)。HTML DOM定义了用于HTML的一系列标准的对象,以及访问和处理HTML文档的标准方法。通过DOM,可以访问所有的HTML元素,连同它们所包含的文本和属性。其中的内容可以修改和删除,同时也可以创建新的元素。HTML DOM独立于平台和编程语言。它可被任何编程语言诸如Java、Javascript和VBScript所使用。HTML DOM就是HTML语言对外界开通的接口,以便其他语言能够访问或修改HTML内部的元素。
  当js需要对html元素进行操作时,DOM是一个很必要的对象。
  你便可以通过利用DOM对象构造代码并插入到HTML代码中的任何位置来实现。
说明:
  当用CSS去修饰HTML中的元素,这一过程可以称为声明HTML元素样式的过程。
说明:
  SGML标准通用标记语言(standardgeneralized markup language)。由于SGML的复杂,导致难以普及。SGML有非常强大的适应性,也正是因为同样的原因,导致在小型的应用中难以普及。HTML 和 XML同样衍生于SGML:XML可以被认为是SGML的一个子集,而HTML是SGML的一个应用。XML的产生就是为了简化SGML,以便用于更加通用的目的。比如语义Web,它已经应用于大量的场合,比较著名的有XHTML、RSS 、XML-RPC 和SOAP 。
  XHTML是可扩展超文本标识语言(TheExtensible HyperText MarkupLanguage)。HTML是一种基本的Web网页设计语言,XHTML是一个基于XML的置标语言,看起来与HTML有些相象,只有一些小的但重要的区别,XHTML就是一个扮演着类似HTML的角色的XML,所以,本质上说,XHTML是一个过渡技术,结合了部分XML的强大功能及大多数HTML的简单特性。
  简单的说,XHTML比HTML要严谨些,但又没像XML那么严重——譬如所有的XHTML标签以及属性必须要小写,属性性必须要加双引号(当然如今的浏览器不管是IE还是FF,对HTML和XHTML采取兼容措施,这也是XSS产生的根本原因),而且也可以像XML一样自定义部分标签,因此有了极大的灵活性。
  而且进入了XHTML时代,大家倡导的是CSS+DIV,这也是web2.0的基础。
  DHTML只是一种制作网页的概念,实际上没有一个组织或机构推出过所谓的DHTML标准或技术规范之类的。DHTML不是一种技术、标准或规范,DHTML只是一种将目前已有的网页技术、语言标准整和运用,制作出能在下载后仍然能实时变换页面元素效果的网页的设计概念。DHTML就是动态的html,Dynamic HTML。传统的html页面是静态的,Dhtml就是在html页面上加入了javascript脚本,使其能根据用户的动作作出一定的响应,如鼠标移动到图片上,图片改变颜色,移动到导航栏,弹出一个动态菜单等等。
说明:
  Expression是微软为了使样式表能够在修饰HTML样式的同时执行javascript脚本而在IE浏览器中增加的一个功能,这样你可以做譬如:图片的自适应宽度,表格的隔行换色等等。  
  XMLHTTP最通用的定义为:XmlHttp是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API。XmlHttp最大的用处是可以更新网页的部分内容而不需要刷新整个页面。
  来自MSDN的解释:XmlHttp提供客户端同http服务器通讯的协议。客户端可以通过XmlHttp对象向http服务器发送请求并使用微软XML文档对象模型Microsoft® XML Document Object Model (DOM)处理回应。
  现在的绝对多数浏览器都增加了对XmlHttp的支持,IE中使用ActiveXObject方式创建XmlHttp对象,其他浏览器如:Firefox、Opera等通过window.XMLHttpRequest来创建XmlHttp对象。
说明:
  XSLT(eXtensibleStylesheet LanguageTransformation)最早设计XSLT的用意是帮助XML文档(document)转换为其它文档。但是随着发展,XSLT已不仅仅用于将XML转换为HTML或其它文本格式,更全面的定义应该是:XSLT是一种用来转换XML文档结构的语言。
  XSL-FO:XSL在转换XML文档时分为明显的两个过程,第一转换文档结构;其次将文档格式化输出。这两步可以分离开来并单独处理,因此XSL在发展过程中逐渐分裂为XSLT(结构转换)和XSL-FO(formattingobjects)(格式化输出)两种分支语言,其中XSL-FO的作用就类似CSS在HTML中的作用。
说明:
  AJAX:异步JavaScript和XML(AsynchronousJavaScript and XML)。
  最后一个东东,它算得上是web2.0思想的心。AJAX=CSS+HTML+JS+XML+DOM+XSLT+XMLHTTP。是指一种创建交互式网页应用的网页开发技术。AJAX不是一种单一的新技术,而是有机地利用了一系列相关的技术。
  在 2005年,Google 通过其 Google Suggest 使 AJAX 变得流行起来。
  Google Suggest 使用 AJAX 创造出动态性极强的 web 界面:当您在谷歌的搜索框输入关键字时,Javascript会把这些字符发送到服务器,然后服务器会返回一个搜索建议的列表。
  在AJAX中,XmlHttp用来在不改变页面的情况下传输数据,其中传输的数据即是XML,然后通过XSLT将其格式化,利用js通过dom对象将其显示到HTML中,同时利用CSS确定数据的显示及位置。
  这项技术在网络上的应用无处不在,如你的微博,你的邮箱,你的QQ空间,再如搜索引擎,电子商务平台,网络地图等等。
  总结:终于讲述完了,本文主要探讨了Web开发技术之间的关系,以及他们组合起来到底有什么用的问题,通过程序员培训的朋友相信会理解的更加深刻。这篇文章总结期间参考了不少别人的东西,在此非常感谢。
分享:0
  • 北京校区
  • 上海校区
  • 广州校区
  • 深圳校区
  • 长沙校区
  • 四川校区
  • 武汉校区
  • 郑州校区
  • 山西校区
北京海淀区校区(总部):北京市海淀区西三旗桥东建材城西路85号神州科技园B座尚学堂
北京京南校区:北京亦庄经济开发区科创十四街6号院1号楼 赛蒂国际工业园
咨询电话:400-009-1906 / 010-56233821
面授课程: JavaEE培训大数据就业班培训大数据云计算周末班培训零基础大数据连读班培训大数据云计算高手班培训人工智能周末班培训
人工智能+Python全栈培训H5+PHP全栈工程师培训视觉设计培训
上海尚学堂松江校区地址:上海市松江区荣乐东路2369弄45号绿地伯顿大厦2层
咨询电话:021-67690939
面授课程: JavaEE培训人工智能+Python全栈大数据培训云计算&大数据培训前端培训PHP培训全栈工程师培训
广州校区地址:广州市天河区元岗横路31号慧通产业广场B区B1栋6楼尚学堂(地铁3号线或6号线到“天河客运站”D出口,右拐直走约800米)
咨询电话:020-2989 6995
面授课程: JavaEE培训人工智能+Python全栈大数据培训云计算&大数据培训PHP培训全栈工程师培训
深圳校区地址:深圳市宝安区航城街道航城大道航城创新创业园A4栋210(固戍地铁站C出口)
咨询电话:0755-23061965 / 18898413781
面授课程: JavaEE培训人工智能+Python全栈大数据培训PHP全栈工程师培训产品经理培训
长沙学区地址:长沙市岳麓区麓源路湖南电子商务基地5楼(公交车站:六沟垅)
咨询电话:0731-83072091
面授课程: JavaEE培训人工智能+Python全栈大数据培训全栈工程师培训产品经理培训
四川学区地址:成都市高新区锦晖西一街99号布鲁明顿大厦2栋1003室
咨询电话:028-65176856 / 13880900114
面授课程: JavaEE培训大数据培训全栈工程师培训产品经理培训
武汉学区地址:湖北省武汉市江夏区江夏大道26号 宏信悦谷创业园4楼
咨询电话:027-87989193
面授课程: JavaEE培训大数据培训全栈工程师培训产品经理培训
郑州学区地址:金水区东风路经三路北100米注协大厦10楼
咨询电话:0371-55177956
面授课程: JavaEE培训大数据培训全栈工程师培训产品经理培训
山西学区地址:山西省晋中市榆次区大学城大学生活广场万科商业A1座702
咨询电话:0354-3052381 / 18903441162
面授课程: JavaEE培训大数据培训全栈工程师培训产品经理培训
Java培训 - Android培训 - ios培训 - hadoop培训 - 专业IT培训机构
Copyright 2006-2018 技术支持:太原市正觉教育科技有限公司  京ICP备13018289号-19  京公网安备11010802015183  
媒体联系:18610174079 闫老师