JScript中innerHTML的例子

最新推荐文章于 2021-07-26 11:21:45 发布

earl86

最新推荐文章于 2021-07-26 11:21:45 发布

阅读量131

点赞数

分类专栏： Javascript 文章标签： ASP HTML

本文链接：https://blog.csdn.net/earl86/article/details/83325690

版权

Javascript 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

JScript中innerHTML的例子

Ghost 发表于 [2005-12-16 11:33]

使用JScript的innerHTML属性，可以获取或设置位于指定的 HTML 服务器控件的开始标记和结束标记之间的内容。这个属性现在在页面设计中很流行，因为它可以让静态的页面也能实现动态的效果。

如你可以让静态的页面也实现像ASP页面中的将顶部和底部分别存成一个文件再用include包含到页面中，实现模版的功能。下面看看如何实现：

先做好顶部和底部，如下：
-----------------------------顶部 top.html-------------------------------
<table width="100%" height="100" border="0" cellpadding="0" cellspacing="0" bgcolor="blue">
<tr>
<td>这是顶部</td>
</tr>
</table>
-----------------------------------------------------------------

-----------------------------底部 bottom.html-------------------------------
<table width="100%" height="22" border="0" cellpadding="0" cellspacing="0" bgcolor="red">
<tr>
<td>这是底部</td>
</tr>
</table>
-----------------------------------------------------------------

然后将这两部分的代码分别用下面的格式存成JS文件：
-----------------------------顶部 top.js-------------------------------
var str;
str='<table width="100%" height="22" border="0" cellpadding="0" cellspacing="0" bgcolor="blue">';
str=str+' <tr>';
str=str+' <td>这是顶部</td>';
str=str+' </tr>';
str=str+'</table>';
top.innerHTML=str;
-----------------------------------------------------------------

-----------------------------底部 bottom.js-------------------------------
var str;
str='<table width="100%" height="22" border="0" cellpadding="0" cellspacing="0" bgcolor="red">';
str=str+' <tr>';
str=str+' <td>这是底部</td>';
str=str+' </tr>';
str=str+'</table>';
bottom.innerHTML=str;
-----------------------------------------------------------------

下面我们看看要调用这两个部分的文件：

---------------------------------try.html--------------------------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JScript中innerHTML的例子</title>
</head>
<body>

<div id="top"></div>


页面主要内容


<div id="bottom"></div>

<script language="javascript" src="top.js"></script>
<script language="javascript" src="bottom.js"></script>
</body>
</html>
-----------------------------------------------------------------

这样当你打开try.html的时候，就可看到顶部和底部都已经自动加进来了。

需要注意的是，在JS文件中的innerHTML前面的id名与要调用的页面中的id名要一至。例子中的top和bottom。

earl86

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JScript中innerHTML的例子

JScript中innerHTML的例子Ghost 发表于 [2005-12-16 11:33]使用JScript的innerHTML属性，可以获取或设置位于指定的 HTML 服务器控件的开始标记和结束标记之间的内容。这个属性现在在页面设计中很流行，因为它可以让静态的页面也能实现动态的效果。如你可以让静态的页面也实现像ASP页面中的将顶部和底部分别存成一个文件再用inclu...
复制链接

扫一扫

专栏目录