熟悉html标签的innerHTML属性

innerHTML属性往往有不小的应用，那么就让我们来看一下吧：

1：最简单的innerHTML应用莫过如此，在html代码如下所示：

这是测试的div

</div>

<p>

</p>

相应的javascript如下：

function ShowWord()

{

var target=document.getElementById("show");

target.innerHTML="我被点了";

}

</script>

之后我们就会看到效果：

点了超链接后：

2：我们可以用此属性来进行一次添加多个文本框或进行多个文件的上传操作

例如，多个文本框：

Html代码还是"1"所示，相应的javasccript为：

var num=1;

function Add()

{

var addMember=document.getElementById("show");

addMember.innerHTML+="<p></p><input id='"+num+"' name='"+num+"' type='text' />";

num++;

}

function document.onkeydown()

{

//此行代码说明按tab键也可以实现文本框的增加

if(event.keyCode==9)

{

Add();

}

</script>

运行后，效果如下：

这样我们在客户端就可以用Reguest[“”]来获得每个文本框的值了；

3.多文件上传：

与文本框一样，多文件上传只需用html的file控件就好了，js代码如下：

function AddFiles()

{

var addFiles=document.getElementById("show");

addFiles.innerHTML+="<p><input id='File1' type='file' name='File1'/>";

}

</script>

效果图：

之后就可以在客户端用Request.Files[i]来获得每个file控件的各个属性了。

最后还有一点很重要，就是一定不要忘了html控件的name属性，如果没有写在客户端很可能就接受不到该控件的值！

还有以上效果也完全可以用js来写一个控件，再指定他的各个属性值，最后再添到某个div的子节点，这样效果会好一些，但要麻烦很多，如果只是一般的用途，用innerHTML就足够啦~~

html中的innerHTML的用法相关推荐

javascript 中的innerHTML的用法
javascript中innerHtml用法 2009-04-21 22:52 <html> <head> <script language="javascri ...
javascript 中innerHTML的用法
javascript 中innerHTML的用法语法 Object.innerHTML = "HTML";//设置其内容 var html = Object.innerHTML; ...
JavaScript中textContent、innerText和innerHTML的用法以及区别
目录 0.码仙励志 1.textContent的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 2.innerText的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 3.inne ...
innerHTML连接指定HTML文件,js中innerhtml的用法
js中innerHTML与innerText的用法与区别 js中innerHTML的用法: innerHTML可获取或设置指定元素标签内的 html内容,从该元素标签的起始位置到终止位置的全部内容(包 ...
详解 javascript中offsetleft属性的用法（转）
详解 javascript中offsetleft属性的用法转载 2015-11-11 投稿:mrr 我要评论本章节通过代码实例介绍一下offsetleft属性的用法,需要的朋友可以做一 ...
关于innerHTML的用法,以及数据覆盖问题
关于innerHTML的用法 innerHTML用于在HTML节点中插入一段HTML,需要注意的是使用innerHTML后该节点原来的html会被被覆盖出现的问题: 代码 <!DOCTYPE ...
PHP中魔术方法的用法
PHP中魔术方法的用法 /** PHP把所有以__(两个下划线)开头的类方法当成魔术方法.所以你定义自己的类方法时,不要以 __为前缀. * */// __toString.__set.__get__ ...
简单介绍SQLserver中的declare变量用法
这篇文章主要介绍了SQLserver中的declare变量用法,sql中declare是声明的意思,就是声明变量的,这个一般是用在函数和存储过程中的.感兴趣的可以来了解一下平时写SQL查询.存储过程 ...
python的继承用法_【后端开发】python中继承有什么用法？python继承的用法详解
本篇文章给大家带来的内容是关于python中继承有什么用法?python继承的用法详解,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 面向对象三大特征 1.封装:根据职责将属性和方法 ...

html中的innerHTML的用法

熟悉html标签的innerHTML属性

html中的innerHTML的用法相关推荐

最新文章

热门文章