定义和用法

innerHTML 属性用于设置或返回指定标签之间的 HTML 内容。

语法

Object.innerHTML = "HTML";// 设置

var html = Object.innerHTML;// 获取

例子 1

获取段落p的 innerHTML（html内容）

<html>

<head>

<script type="text/javascript">

function getInnerHTML(){

    alert(document.getElementById("test").innerHTML);

}

</script>

</head><body>

<p id="test"><font color="#000">嗨豆壳 www.hi-docs.com</font></p>

<input type="button" onclick="getInnerHTML()" value="点击" />

</body>

</html>

例子 2

设置段落p的 innerHTML（html内容）

<html>

<head>

<script type="text/javascript">

function setInnerHTML(){

    document.getElementById("test").innerHTML = "<strong>设置标签的html内容</strong>";

}

</script>

</head><body>

<p id="test"><font color="#000">嗨豆壳 www.hi-docs.com</font></p>

<input type="button" onclick="setInnerHTML()" value="点击" />

</body>

</html>

例子3 ：document.body.innerHTML

<htmL>

<head>

<meta content="text/html;charset=utf-8" http-equiv="content-type">

    <script type="text/javascript">

    window.onload = function(){

        var arrLi = {我的朋友:['哇哈哈','乐百氏','农夫山泉'],同学:['咖啡','果汁','果酒']};

        var n = -1

        for(var i in arrLi){

            n++;

            document.body.innerHTML += '<ul>'+i+'</ul>';

            var ul = document.getElementsByTagName('ul');

            for (var j = 0; j < arrLi[i].length; j++) {

                ul[n].innerHTML += '<li>'+arrLi[i][j]+'</li>';

            };

        }

    }

    </script>

</head>

<body>

</body>

</htmL>

JS 之 innerHTML的更多相关文章

  1. (转)JS中innerHTML，innerText，value

    原文:http://holysonll.blog.163.com/blog/static/21413909320134111054352/ JS中innerHTML,innerText,value 2 ...

  2. js中innerHTML、outerHTML与innerText的用法与区别

    ____________________________________________________________________________________________________ ...

  3. JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系？jQuery中的text()、html()和val()

    一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...

  4. JS中innerHTML，innerText，value

    一·.JS初学者易混淆的问题:innerHTML,innerText,value(他们和JQ的区别:JS→value,JQ→value()) 1.getElementById("a" ...

  5. js中innerHTML与innerText的用法与区别

    用法: <div id="test">    <span style="color:red">test1</span> te ...

  6. js td innerHTML

    用value不好使,用innerHTML可以.JS:document.getElementById("aa").innerHTML="单元格"; body:&l ...

  7. js中innerHTML和innerText的用法

    <div id="test"> <span style="color:red">test1</span> test2 < ...

  8. JS中innerHTML 和innerText和value的区别

    (1)innerHTML 和innerText和value的区别: innerHTML innerText是对非表单元素进行操作的. value是对表单元素进行操作的. (2)innerHTML 和i ...

  9. 如何解决链入js，innerHTML中文乱码问题呢？

    描述:发生在做suhuotong网站的时候,添加在线客服代码的时候三个地方1.将js以UTF-8无BOM编码:VS修改或者使用NotePad++修改2.<meta http-equiv=&quo ...

随机推荐

  1. Spark2.0编译

    Spark2.0编译 1 前言 Spark2.0正式版于今天正式发布,本文基于CDH5.0.2的Spark编译. 2 编译步骤 #2.1 下载源码 wget https://github.com/ap ...

  2. OpenSSl编译

    1.下载openssl代码,下载地址:http://www.openssl.org/source/ ,如果使用winrar解压失败的话(提示不能创建符号链接),可以关闭UAC.2.下载安装Active ...

  3. 再谈c++中的引用

    在<从汇编看c++的引用和指针>一文中,虽然谈到了引用,但是只是为了将两者进行比较.这里将对引用做进一步的分析. 1 引用的实现方式 在介绍有关引用的c++书中,很多都说引用只是其引用变量 ...

  4. MYSQL操作的一些知识点，持续更新中····

    基本概念——库 1.数据库服务器:库——>表——>行/列 2.cmd下链接: mysql – uroot –proot 3.创建库:create database  php; 3.看数据库 ...

  5. ES6新特性-------解构、参数、模块和记号（续）

    六.解构 解构提供了一个方便的地从对象或数组中提取数据的方法,请看下面的例子: //ES6 let [x,y]=[1,2];//x=1,y=2 //ES5 var arr=[1,2]; var x=a ...

  6. Blog透视镜

    Blog透视镜,提供了Blog代码示例,文章和教程,可以帮助你建置博客. 网站名称:Blog透视镜 网站地址:http://blog.openyu.org

  7. 电子工程师名片——SPI NOR Flash

    使用了MX25L512的SPI接口的Flash 电路连接图: 总的大小512kb,即64kB,sector的大小为256 Bytes,block的大小为4k Bytes 调试时出现的问题: 1.Fla ...

  8. 认识IL代码---从开始到现在 <第二篇>

    ·IL代码分析方法 ·IL命令解析 ·.NET学习方法论 1.引言 自从『你必须知道.NET』系列开篇以来,受到大家很多的关注和支持,给予了anytao巨大的鼓励和动力.俱往昔,我发现很多的园友都把目 ...

  9. [ ArcGIS Server技术版]如何得到本机上的所有的REST服务？

    http://server.arcgisonline.com/ArcGIS/rest/services?f=json得到的字符串 {"currentVersion":10.01,& ...

  10. jQuery中的选择器《思维导图》

    学习jQuery的课程中,我对jQuery中的选择器有了更深的认识,它的简洁写法,完美的兼容性,可靠的处理机制,都让我们省了很多事, 下面是我在学习过程中对jQuery选择器写的思维导图(全屏查看:& ...