利用DHTML技术我们可以改变网页中的任何效果
(原理:首行读html页面,然将原有元素隐藏,然后将读得的数据显示)
1,得到HTML元素
2,改变HTML元素
本例是用javaScript脚本来取csdnblog的页头统计,然后改变其位置,(注:本例中只没有将原位置隐藏,大家可以再用javaScript控制display的方法将其隐藏,这里就不再说了)
<script language="JavaScript">
var h3_array=new Array();
var li_array=new Array();
h3_array=document.body.getElementsByTagName("h3");//取网页中的h3元素对象
li_array=document.body.getElementsByTagName("li");//取网页中的li元素对象
for (var i = 0; i < h3_array.length; i++)
{
var ite_h3_value =h3_array[i].innerHTML;//将元素对象的值取出并放入数组中
}
for (var j=0;j<li_array.length;j++)
{
var ite_li_value =li_array[j].innerHTML;
}
var h3_m1=h3_array[1].innerHTML;//取出数组中的值
var li_m0=li_array[4].innerHTML;
var li_m1=li_array[5].innerHTML;
var li_m2=li_array[6].innerHTML;
var li_m3=li_array[7].innerHTML;
//以下是显示部分
document.writeln("<div id='leftmenu' style='position:absolute; left:-3px; top:800px; width:146px; height:86px; z-index:1; background-color: #102E48; layer-background-color: 102E48; border: 1px none #000000;'>");
document.writeln(" <table width='165' border='0'>");
document.writeln(" <tr>");
document.writeln(" <td>"+h3_m1+"</td>");
document.writeln(" </tr>");
document.writeln(" <tr>");
document.writeln(" <td>"+li_m0+"</td>");
document.writeln(" </tr>");
document.writeln(" <tr>");
document.writeln(" <td>"+li_m1+"</td>");
document.writeln(" </tr>");
document.writeln(" <tr>");
document.writeln(" <td>"+li_m2+"</td>");
document.writeln(" </tr>");
document.writeln(" <tr>");
document.writeln(" <td>"+li_m3+"</td>");
document.writeln(" </tr>");
document.writeln(" </table>");
document.writeln("</div> ");
</script>
这只是DHTML技术中的一个上小应用,如感兴趣的朋友可以和我联系共同探讨。