大家一起来讨论下"动态HTML网页" - JavaScript论坛

楼主

问题点数：0 回复次数：3

大家一起来讨论下"动态HTML网页"

我所认为的动态HTML

1 动态HTML网页的优越性

在动态HTML网页中,我们可以使用串接样式表编写网页并利用Javascript给网页加入动画。如果某些用户认为在网页中加入满天飞的动画实在是无益的劳动，那么还有一些只有动态HTML才能做到的非常实用的动态用户界面。我们将充分结合我们大脑两个半球的优势编写动态的事件驱动的动画，这种动画可以根据用户的指令进行变化，如果这些还不足够吸引你，我们还将应用结构、数组循环、对象引用以及更多的串接样式表使你拥有编写可以令任何梦想都变成现实的结构化网页编程能力。

2 制作动态HTML网页必须具备的知识

你必须熟悉3中不同的技术：HTML、样式表和JavaScript。动态HTML网页实际上就是这3种技术的集成。

搜索更多相关主题的帖子: 网页　动态　 HTML　

第 2 楼

得分:0

从下面这个例子足以体现出动态网页制作的一般过程，也说明了HTML,层叠样式表,javascript三种技术在动态网页制作中的互相依赖及各自的重要性，更说明了javascript是动态网页的核心和灵魂下面这个是font_effect.htc文件(可用记事本来编辑） ////////////////////////////“行为”文档开始/////////////////////////////////// //给“行为”增加四个鼠标事件 <PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="glowit()"/> <PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="noglow()"/> <PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2yellow()"/> <PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2blue()"/> //给“行为”定义二个方法 <PUBLIC:METHOD NAME="move_down"/> <PUBLIC:METHOD NAME="move_right"/> <SCRIPT LANGUAGE="JScript"> //定义一个保存字体颜色的变量 var font_color; //定义向下移动文字的方法 function move_down() { element.style.posTop+=2; } //定义向右移动文字的方法 function move_right() { element.style.posLeft +=6; } //定义鼠标onmouseup事件的调用函数 function font2blue(){ if (event.srcElement == element) { element.style.color='blue'; } } //定义鼠标onmousedown事件的调用函数 function font2yellow(){ if (event.srcElement == element) { element.style.color='yellow'; } }

//定义鼠标onmouseover事件的调用函数 function glowit() { if (event.srcElement == element) { font_color=style.color; element.style.color='pink'; element.style.filter="glow(color=red,strength=2)"; } }

//定义鼠标onmouseout事件的调用函数 function noglow() { if (event.srcElement == element) { element.style.filter=""; element.style.color=font_color; } } </SCRIPT> 下面这个是演示文件（普通网页文件） <html> <HEAD> <TITLE>行为效果演示</TITLE> <STYLE> .myfilter{behavior:url(font_effect.htc);position:relative;font-weight:bold;width=180;left:0;} </STYLE> </HEAD> <BODY> <span id="myspan" class='myfilter'>行为产生的文字效果</span><br> <span class='myfilter'>鼠标指向后产生辉光</span><br> <span class='myfilter'>同时文字变白</span><br> <span class='myfilter'>按下鼠标后文字变黄</span><br> <span class='myfilter'>抬起鼠标后文字变蓝</span><br> <span class='myfilter'>鼠标离开后文字恢复原状</span><br> <button onclick="myspan.move_right();">向右移动第一行文字</button><br> <button onclick="myspan.move_down();">向下移动第一行文字</button> </BODY> </html>

第 3 楼

得分:0

以下引用WebCrazy: 楼上的例子我测试失败啊这是什么，不象脚本内容啊，是不是微软的东东，和别的浏览器不兼容的 "行为"确实是microsoft的技术,W3C没有此标准

第 4 楼

得分:0

“行为”是一个简单易用的组件！它封装了页面上特定的功能或动作。当把一个“行为”附到WEB页面中的一个元件上时，这个元件的原有行为就会有所改变。因此，网页编程者可以开发通用的DHTML指令，并改变原有对象的一些属性，用“行为”来增强一个对象的功能，同时也简化了页面的HTML代码。再看下面这个简单例子： //保存为beha1.htc <component> <attach for="element" event="onmouseover" handler="high_lite" /> <attach for="element" event="onmouseout" handler="low_lite" /> <script type="text/javascript"> function high_lite() {element.style.color=255;} function low_lite() {element.style.color=0;} </script> </component> //测试文件test.htm <html> <head> <style> h1{behavior:url(beha1.htc)} </style> <body> <h1>请将鼠标移到我这</h1> </body> </html> “行为”是一个CSS属性选择器，它指向一个包含了特殊代码并且能够改变HTML页面元素的XML文件（htc) “行为”是一个新的CSS属性，行为属性可以指向一个分离的XML文件，这个XML文件包含了能够改变XML或者HTML页面的元素或显示样式的脚本代码。呵，说这么多，只是希望通过一些讨论，能起到点抛砖引玉的效果。另外，有些事也许能在讨论中越辨越清晰，如能这样也就很好。