innerHTML属性

最新推荐文章于 2023-10-18 22:51:26 发布

原创最新推荐文章于 2023-10-18 22:51:26 发布 · 403 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#innerHTML属性

js 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了HTML中innerHTML属性的两个主要用途：一是获取指定元素内的文本内容；二是为元素设置新的内容，包括HTML代码。通过实例展示了如何使用此属性来动态更新页面元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

innerHTML属性

第一个作用：获取文本的内容(通过getElementById获得标签的id,然后通过innerHTML属性赋值)

                         <span id="sid">哈哈</span>
                                        //获取span标签
                            var span1=document.getElementById("sid");
                            alert(span1.innerHTML);

         第二个内容：向标签里面设置内容（可以是html代码）
                            <div id="div1"></div>
                            //获取div
                            var div1=document.getElementById("div1");
                            //设置内容
                            div1.innerHTML="<h1>AAA</h1>";

                        向div里面添加一个表格
                    <style type="text/css">
        #div1{
        width: 400px;
        height: 400px;
        border: 1px solid red;
    }
      </style>
<div id="div1"></div>
//获取div
var div1=document.getElementById("div1");

var tab="<table border='1'><tr><td>aaa</td></tr><tr><td>bbb</td></tr><tr><td>ccc</td></tr>";

div1.innerHTML=tab;