innerHTML的作用及用法。

2023-10-26

对innerHTML的用法有些模糊,今天来总结一下:
1、innerHTML有两个作用: (1)获取对象的内容;
(2)向对象插入内容;

例:

这是内容
,由于id是唯一的,我们可以不获取id。通过 a.innerHTML 来获取id为a的对象的内嵌内容;

也可以通过b.innerHTML = "这是被插入的内容";在id为b的对象中插入内容。

例子1(获取对象的内容):

<body>
     <p id="test">内容</p>
     <input type="button" "getInnerHTML()" value="点击" />
</body>
<script type="text/javascript">
     function getInnerHTML(){
         alert(test.innerHTML); //将获取的内容弹出!
     } 
</script> 

例子2(向对象插入内容):

<body>
    <p id="test"></p>
    <input type="button" "setInnerHTML()" value="点击" />
</body>
<script type="text/javascript">
    function setInnerHTML(){
        test.innerHTML = "这是插入的内容!"; //点击按钮将内容插入到p标签内!
    }
    </script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

innerHTML的作用及用法。 的相关文章

  • 将 HTML 实体分配给 innerHTML 时出现 DOM 异常

    在本页http blog zacharyvoase com 2010 11 11 sockets and nodes i 在 javascript 控制台中运行以下代码将抛出异常 var div document createElement
  • 添加到 HTML 表单而不丢失 Javascript 中当前表单输入信息

    我有一个下拉菜单 它根据所选的选择构建一个表单 因此 如果有人选择 foobar 它会显示一个文本字段 如果他们选择 cheese 它会显示单选按钮 然后 用户可以在这些表单中输入数据 唯一的问题是 当他们添加新的表单元素时 所有其余信息都
  • innerHTML 适用于 IE 和 Firefox,但不适用于 Chrome

    数据不会在 Chrome 中显示 除非我在 Chrome 中打开 IE 选项卡 转到该网站 然后将其关闭回 Chrome 抱歉 如果这没有多大意义 window onload function var url http freeiz com
  • 修改innerHTML后保存/恢复内容可编辑的选择

    我知道在 contentEditable 中获取 设置光标位置几乎是不可能的 我不在乎知道这些信息 我需要能够保存当前选择 修改 div 的innerHTML 然后恢复选择 我一直在尝试提供的答案contenteditable 选定的文本保
  • 输出消失Javascript简单innerHTML

    我对 javascript 很陌生 在每一个简单的事情上我都会遇到一些问题 但这对我来说似乎无法解决 我用谷歌搜索了一下 没有类似的东西 当我将数据输入文本框并将其存储到变量中后 我打印出段落中的变量 问题是我打印出来的输出在不到一秒的时间
  • 如何使用 Angular 2 组件动态添加innerHTML

    我正在为组件库创建文档 我想要 1 个 html 字符串来生成页面上的组件及其文档 我想要的是 我拥有的 当我检查 HTML 时 my button 标签不存在 当我使用innerHTML 时 它们被删除 我的组件代码 private fl
  • Angular2在for循环中加载动态内容/html

    我有一个 json 数组 它可以包含我想要加载的组件的组件或 html 选择器 我正在尝试在 for 循环中加载这些数据 当我尝试插入值 d html 时 它显示为计划文本 当我使用下面的innerHTML方法并检查dom时 我在那里看到h
  • svg insideHTML在firefox中无法显示

    我使用innerHTML添加svg元素 它在chrome中工作正常 但在firefox中无法显示 非常感谢您的回答
  • 如何获取脚本标签的innerHTML

    好吧 我已经搜索了一小时了 如何获取脚本标签的innerHTML 这就是我一直在做的事情 我一直在尝试寻找一种使用脚本标记调用另一个域的页面源的方法 我见过一个有效的例子 但我一生都找不到它 你不能那样做 没有innerHTML 您所能做的
  • 如何使用 javascript 将数据显示为 HTML

    我在使用 javascript 将数据显示为 HTML 时遇到问题 我创建的代码仅显示最新数据而不是整个数据 我在开发中使用phonegap 这是代码 var oldHtml document getElementById favorite
  • createElement 相对于innerHTML 的优点?

    在实践中 使用createElement相对于innerHTML有什么优势 我这样问是因为我确信使用innerHTML 在性能和代码可读性 可维护性方面更有效 但我的队友已经决定使用createElement 作为编码方法 我只是想了解 c
  • 没有html的innerHTML,只有文本[重复]

    这个问题在这里已经有答案了 我创建了一个电子邮件链接 它会自动填充正文中的必要信息 但是 当我执行 innerHTML 时 我得到的比我预想的要多一些 我想要 2012 年 3 月 12 16 我得到什么 b March 2012 b fo
  • 使用 javascript 或 jQuery 隐藏所有带有与数字“0”或自定义值匹配的文本或innerHTML的“a”元素

    我需要隐藏全部 a 带有文本或的元素innerHTML匹配数字 foo 或使用 javascript 或 jQuery 的自定义值 li a href class dir foo a li 我努力了 jQuery document read
  • innerHTML 返回 NaN 和文本

    我遇到一个问题 我尝试返回一个值innerHTML但我得到了一个 NaN 我知道我的变量不是数字 但为什么他一直告诉我这个 function checkWord id nameOutput var pattern new RegExp b
  • JavaScript 中的 DOM 解析

    一些背景 我正在使用 JavaScript 开发一个基于 Web 的移动应用程序 HTML 渲染基于 Safari 跨域策略已禁用 因此我可以使用 XmlHttpRequests 调用其他域 这个想法是解析外部 HTML 并获取特定元素的文
  • jQuery 如何处理注释元素?

    我一直以为jQuery只能操作DOMelements 即那些具有nodeType 1 然而令我震惊的是 在创建 HTML 时 p p 结果是 p Comment data comment length 21 nodeName comment
  • 使用 INPUT 标签的 VALUE 属性(及其值)读取 HTML 表单的innerHTML

    我有一个html form与一些输入字段 而不是读取和发送值input字段由document ipForm userName value 我需要将整个 html 内容发送到 html 解析器并提取
  • 为什么“element.innerHTML=”是错误的代码?

    我被告知不要使用附加内容element innerHTML 像这样 var str div hello world div var elm document getElementById targetID elm innerHTML str
  • Mutation Observer不检测通过innerHTML、appendChild添加的节点

    当我们尝试使用appendChild或innerHTML在DOM中添加嵌套节点时 嵌套节点不会出现在突变的addedNodes中 初始 HTML 设置 div div 这是我的突变观察者代码 var observer new Mutatio
  • 将输入字段添加到 div 容器 (javascript)

    我想将一些 html 数据添加到 div 容器的末尾 目前 我使用innerHtml来做到这一点

随机推荐

  • 【解决报错】c#使用ManagedWifi报错出现“不能作为非托管结构进行封送处理;无法计算有意义的大小或偏移量。”

    最近在做C 上位机wifi通信的时候使用了MangedWifi库 但这个库并没有想象中好用 遇到了不少问题 首先网上流传的例程又不能运行 再接着当wifi断开或连接时会异常退出的bug 通过反反复复的调试后 我最终确认了错误的来源 发现是M
  • 微信公众号 config:fail,Error: 系统错误,错误码:1

    微信公众号开发 微信开发者工具 打开调试模式 出现config fail Error 系统错误 错误码 1 查看一下wx config是否成功渲染了 重新赋值 修改后的代码如下 chooseImage var this this 新增代码块
  • 生产环境lvm磁盘扩容!!!

    一次就好 亲身体验生产环境lvm磁盘扩容 这一天体验了真正的生产环境 三急 中午客户打电话说报表几个小时没更新了 是不是你们系统有问题啊 于是开始排除发现磁盘空间满了 需要进行扩容 咱又没有扩容经验潜心研究一下午 终于得出结论 以下将描述我
  • 如何将计算机的硬盘分割,电脑硬盘如何快速分区

    电脑硬盘一般有2个盘或者4个盘 怎样自己增添一个硬盘 或者来均分电脑那300G或者500G的硬盘空间呢 今天学习啦小编给大家介绍下电脑硬盘如何快速分区吧 电脑硬盘快速分区方法一 1 点击我的电脑 点击鼠标右键 选择管理项 2 打开后选择磁盘
  • Python基础教程,Python入门教程(非常详细)

    Python 英文本意为 蟒蛇 直到 1989 年荷兰人 Guido van Rossum 简称 Guido 发明了一种面向对象的解释型编程语言 后续会介绍 并将其命名为 Python 才赋予了它表示一门编程语言的含义 图 1 Python
  • C# TCPclient 服务器保持长连接的一种办法(变相的心跳包功能)

    本文章向大家介绍C TCPclient 服务器保持长连接的一种办法 变相的心跳包功能 主要包括C TCPclient 服务器保持长连接的一种办法 变相的心跳包功能 使用实例 应用技巧 基本知识点总结和需要注意事项 具有一定的参考价值 需要的
  • neo4j从安装到远程访问一气呵成

    从安装到远程访问配置 安装Java JDK JDK下载 JDK配置环境 安装Neo4j Neo4j下载 系统变量设置 通过控制台启动 Neo4j 注册 Neo4j 服务 启动 Neo4j 服务 停止 Neo4j 服务 重启 Neo4j 服务
  • 【千律】C++基础:类的派生与继承

    include
  • postman环境设置

    本来是想在另一篇博客基础上接着写的 但是考虑到不想搞太长 干脆分开写 看起来更直接清楚一下 使用postman调接口 经常会遇到不同的的环境 但是接口是一样的 不想添加太多没用的请求 因为除了同一个接口请求要写多遍 更重要的是环境地址和端口
  • gprmax3.0安装、GPU加速(cuda)配置、通过python使用gprmax的问题

    gprmax3 0安装 GPU加速 cuda 配置 通过python使用gprmax的问题 一 安装过程 二 通过NVIDIA CUDA使用GPU加速功能 三 通过VS2019或VScode操纵gprmax 鉴于网上其他教程版本较低 本篇记
  • 【GD32篇】驱动AD7616完成数据采集

    1 AD7616介绍 1 1 概述 AD7616 是一款 16 位 DAS 数据采集系统 支持对 16 个通道进行双路同步采样 AD7616 采用 5 V 单电源供电 可以处理 10 V 5 V 和 2 5 V 真双极性输入信号 同时每对通
  • 代码随想录算法训练营第三天

    今天是算法训练营的第三天 写了454 四数相加 II这道题目 力扣链接 代码随想录链接 代码如下 class Solution def fourSumCount self nums1 List int nums2 List int nums
  • 在window模式下硬盘安装linux

    随着linux的迅速发展和其强大的安全体系的成熟 越来越多的人希望能学习linux 但也有不愿很快的离开window那中友好的界面 最好的办法就是在你的PC机上做两个系统 这样就可以学习和娱乐两不误 等到自己在linux上学习的狠命熟练的时
  • Android APK 程序实现自动更新,java服务命令处理无弹窗,终极解决方案

    安卓更新方式 网上五花八门 但是真正实现apk自动更新无痕迹的方式 少之又少 毕竟不要钱的方式 稳定的方式才能让开发者在困难中脱颖而出 安卓程序如何做到自动更新 安卓程序如何实现无弹框更新 1 安卓apk自动更新方式 a 第三方平台更新ap
  • 无向图有向图最小环

    floyd求 for int k 1 k lt n k for int i 1 i
  • 合肥先进光源高速数据采集网的规划

    合肥先进光源束测后台的初步设计 这里的网络相关的部分摘出来换个名字重新整理一下 合肥光源中 没有把数据量大的设备比如摄像头 示波器规划进单独的网络 所有的设备都直接接入控制网 运行实践的过程中 有过高帧率的一个摄像头就拖慢整个网络响应的情况
  • Java基础11--时间日期

    Java基础11 时间日期 文章目录 Java基础11 时间日期 获取当前日期时间 日期比较 使用 SimpleDateFormat 格式化日期 日期和时间的格式化编码 解析字符串为时间 Java 休眠 sleep Calendar类 Ca
  • I/O多路复用(select、poll、epoll)

    基本思想 1 先构造一张有关文件描述符的表 然后使用我们的select poll epoll函数 2 我们的应用程序会将这张表复制给内核 3 内核层初始化表中的需要检测的描述符 4 当检测到有文件操作时 则立即将文件描述符作为标志并返回给应
  • Pytorch profiler with tensorboard.

    文章目录 前言 你将学到什么 一 准备数据集和模型 二 使用profiler来记录执行的事件 三 执行profiler 四 使用TensorBoard来观察结果并对模型性能做出分析 最后 总结 前言 你将学到什么 注意 以下所有的内容均来自
  • innerHTML的作用及用法。

    对innerHTML的用法有些模糊 今天来总结一下 1 innerHTML有两个作用 1 获取对象的内容 2 向对象插入内容 例 这是内容 由于id是唯一的 我们可以不获取id 通过 a innerHTML 来获取id为a的对象的内嵌内容