CSS、HTML、JS、XML的关系.docVIP

CSS、HTML、JS、XML的关系 CSS、HTML、JS、XML的关系2010-04-11 22：54CSS、HTML、JS、XML的关系这是一篇低中等难度的文章。如果你是高手或被认为是高手，那么请pass掉这篇文章；如果你是新手，甚至不知道什么是css(譬如百度模版)等，那么请pass掉这篇文章。谢谢合作！ 在网上有告诉你CSS是什么、HTML是什么、JS是什么、XML是什么之类的文章，并且多如牛毛。但是他们一般都没有具体告诉你，它们之中的任意一个或几个结合起来用会是什么或什么效果(请注意：我所指的是它们具体说是以一种什么样的方式结合，并不一定是结合的新产物新名词)。所以出于这种目的，Monyer手写了这篇文章，虽然我参考并综合了诸多文献资料，但仍免不了由于个人偏见及学术问题所引起的诸多谬误，所以如果您有任何问题欢迎批评指教，以便Monyer对文章进行及时更正，以免混淆视听。谢谢！ 在文章开始，我认为有必要先分别说说这四项技术都是什么，都能干什么。 HTML是什么：HTML是Hypertext Markup Language的缩写，即超文本标记语言。它是用于创建可从一个平台移植到另一平台的超文本文档的一种简单标记语言，经常用来创建Web页面。HTML文件是带有格式标识符和超文本链接的内嵌代码的ASCII文本文件。用Monyer的话说，HTML就是做网页结构及内容实现的一门语言。 下面这段代码是HTML的基本结构，在中的为HTML标记，一般一个xxx标记出现，则必需要一个相应的/xxx对其标示范围进行结束；除非该标记为自关闭标记，一般以xxx/的形式出现。 html head title Monyers Example/title/head body div id=firstHello World！/div div id=secondHello Monyer！/div/body/html 代码一 如果把网页(html./html)看成是人的话，那么head./head是他的头，但这部分内容通常不会在网页正文中显示；body./body是他的身体，也是一个网页内容显示部分。所以将以下代码保存为*.html后并双击在网页浏览器中运行，显示的仅仅是： Hello World！ Hello Monyer！ 但所有的HTML标记均是被浏览器执行的对象，并不会显示出来。需要注意的是，在上段代码中承载Hello World！和Hello Monyer！的两个div/容器内部均有一个id标识，id中的内容是可以随便定制的，但请务必保证id中内容的唯一性--因为它是使别人找到它所在的门牌号。 CSS是什么：CSS是Cascading Style Sheet的缩写。译作「层叠样式表单」。是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言(节选自《css2.0中文手册》)。如果用|\/|0|\|YE|2的话说，CSS就是定制一个网页上HTML元素属性的语言。 CSS的大概模样如下： #first{color：red；}#second{color：green；font-size：50px；} 代码二 当把以上代码放进HTML中，它会去尝试找ID(门牌号)为first的HTML标签，如果找到，就把该标签内的文字以红色在浏览器中显示出来；当它继续寻找ID为second的标签，并找到后，它会把该标签内部的文字以绿色在浏览器中显示出来，但同时该段文字的大小为50像素。具体的插入HTML的方法后文会提到。 JS是什么：JS是Javascript的缩写。JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象，与Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。用|\/|0|\|YE|2的话说，网页中所有的对数据进行判断、操作以及向浏览者反馈信息的本地代码实现部分均是javascript(当然，由于我们仅仅局限于目前的这四种语言，所以在狭义的角度上，我们不考虑vbs或Java Applet等脚本语言。请不要总是钻别人的牛角尖哦！呵呵) JS的大概样子如下： function a(){alert(example)；}a()； 代码三 当把以上代码放进HTML代码中，它会在你的HTML载入时，弹出一个内容为example的对话框。同样，具体的插入方法会在后文给出。 XML是什么：XML代表Extensible Markup Language(eXtensible Markup Language的缩写，意为可扩展的标记语言)