将 HTML 字符串转换为 DOM 元素?

2023-12-03

有没有办法将 HTML 转换为:

<div>
<a href="#"></a>
<span></span>
</div>

或者任何其他 HTML 字符串到 DOM 元素中? (这样我就可以使用appendChild())。我知道我可以执行 .innerHTML 和 .innerText,但这不是我想要的——我确实希望能够将动态 HTML 字符串转换为 DOM 元素,以便我可以在 .appendChild() 中传递它。

更新:似乎存在混乱。我将 HTML 内容放在字符串中,作为 JavaScript 中变量的值。文档中没有 HTML 内容。


您可以使用DOMParser,像这样:

var xmlString = "<div id='foo'><a href='#'>Link</a><span></span></div>";
var doc = new DOMParser().parseFromString(xmlString, "text/xml");
console.log(doc.firstChild.innerHTML); // => <a href="#">Link...
console.log(doc.firstChild.firstChild.innerHTML); // => Link
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将 HTML 字符串转换为 DOM 元素? 的相关文章

  • 来自 DataURL 的 Blob?

    Using FileReader s readAsDataURL 我可以将任意数据转换为数据 URL 有没有办法将数据 URL 转换回Blob使用内置浏览器 API 的实例 用户 Matt 一年前提出了以下代码 如何在javascript中
  • 如何获取 RxJSSubject 或 Observable 的当前值?

    我有 Angular 2 服务 import Storage from storage import Injectable from angular2 core import Subject from rxjs Subject Inject
  • 未捕获的类型错误:this.props.signinUser 不是一个函数(…)

    src actions index js import axios from axios const ROOT URL http localhost 3090 export function signinUser email passwor
  • JavaScript 变量赋值与 OR 对比 if 检查[重复]

    这个问题在这里已经有答案了 在 JavaScript 中 我最近意识到你可以使用 OR 赋值的逻辑运算符 我想知道这是否被认为是不好的做法 特别是 我有一些具有可选数组输入的函数 如果输入是null or undefined我应该将它设置为
  • Youtube 播放器 Iframe,在 Firefox 上有声音但没有视频

    我正在使用 YT Player API 在滑块内创建多个 iframe youtube 视频 第一个视频在 onYouTubeIframeAPIReady 之后调用 当我单击正常工作的下一个按钮时 会出现下一个视频 但是当我尝试在 Fire
  • 是否可以覆盖 javaScript 原始数据类型?

    问题是不言自明的 我知道可以扩展原始数据类型 例如string但有可能覆盖它吗 这是在采访中被问到的一个问题 不 你不能覆盖任何东西 Ecma脚本定义原始类型 http es5 github com x4 3 2 Undefined Nul
  • Bing.com 如何创建放大的缩略图?

    当我使用 Bing com 搜索图像时 我发现它们的图像经过精心裁剪和排序 当您将鼠标放在图像上时 会弹出另一个窗口 其中显示放大的图像 我想在我的程序中做同样的事情 我检查了他们页面的源代码 他们正在使用 javascript 但我仍然不
  • 使用 Javascript / Jquery 的本地存储(不使用 HTML5)

    我想在 javascript 或 jquery 中复制本地存储概念 类似于 HTML5 但不幸的是我不知道如何开始 任何人都可以建议如何使用 javascript 或 jquery 实现本地存储 不使用 HTML5 这是一个有点愚蠢的差事
  • 只需编辑 .css 即可更改

    有 4 div class myField 每一个都在另一个之下 http jsfiddle net urielz 6Mdmd http jsfiddle net urielz 6Mdmd 我想将其视图更改为两对情侣面对面 就像结果一样 h
  • ReactJS:从没有 onChange 事件的 props 中选择默认值?

    所以 我只是想知道我是否绝对需要在 React 中的选择组件上有一个 onChange 事件处理程序 我有一个道具传递我想要选择的选项的默认值 如果我有的话 它就没有问题
  • setInterval 内的返回值

    我想在 setInterval 内返回一个值 我只想以一定的时间间隔执行一些操作 这就是我尝试过的 function git limit var i 0 var git setInterval function console log i
  • 使用 JavaScript 的计时器

    我想使用java脚本实现计时器 我想随着间隔的变化而减少计时器 Example假设我的计时器从 500 开始 我想要根据级别减少计时器 例如1 一级定时器应减1 且递减速度应较慢 2 2级定时器应递减2 递减速度应为中等3 3级定时器应减3
  • Postman - 如何计算 JSON 响应中特定对象的出现次数

    我是 JSON 和 Postman 的新手 我相信我正在尝试做一些非常简单的事情 我创建了一个 GET 请求 它将获得如下所示的 JSON 响应 在下面的例子中我想得到count响应中所有 IsArchived 属性 这些属性的数量因响应而
  • RTCDataChannel发送方法不发送数据

    我的 RTCDataChannel 遇到一个奇怪的问题 我正在对 WebRTC 进行一些研究 并且已经可以进行 WebRTC 音频 视频聊天 现在我想使用 RTCDataChannel 添加文本聊天和文件共享 我已经像这样创建了 RTCDa
  • 使用Promise而不拒绝它会导致内存泄漏吗? [复制]

    这个问题在这里已经有答案了 代码如下 function test value return new Promise function fulfill reject try fulfill true catch e throw e 我担心的是
  • 使用 Lodash 的 TypeScript:_.map(["123", " 234 "], _.trim) 返回 boolean[]?

    我有一个字符串数组 它们已像这样分割 var searchValue 600 800 123 180 var groups searchValue split gt 600 800 123 180 因此项目周围可能存在空格 并且我想删除空格
  • 如何在 JavaScript 中获取浮点数的小数位?

    我想要的是与 Number prototype toPrecision 几乎相反的 这意味着当我有数字时 它有多少位小数 例如 12 3456 getDecimals 4 对于任何想知道如何更快地完成此操作 无需转换为字符串 的人 这里有一
  • 使用 jquery 提供附加功能时菜单未正确对齐

    I need to make a mega menu similar to one as show in image below 到目前为止 我已经能够在某种程度上使其发挥作用 例如jsFiddle 在这里 http jsfiddle ne
  • Serviceworker Bug event.respondWith

    我的 serviceworker 的逻辑是 当发生获取事件时 它首先获取包含一些布尔值 而不是 event request url 的端点 并根据我正在调用的值检查该值event respondWith 对于当前的获取事件 我正在提供来自缓
  • 获取淘汰赛中被点击元素的索引

    获取无序列表中单击元素的索引的最佳方法是什么 让我举个例子 假设我有以下 HTML 代码 ul li p p li ul 现在我有以下 javascript 代码来获取索引 self itemClicked function data it

随机推荐

  • ggplot2 为平淡的 altman 图中的每个面添加几何线

    我有以下数据框 structure list Lightbox c 84L 67L 80L 63L 76L 66L 79L 81L 77L 82L 84L 67L 80L 63L 76L 66L 79L 81L 77L 82L 84L 67
  • jQuery UI 对话框定位

    我正在尝试使用jQuery 对话框 UI库 以便在将鼠标悬停在某些文本上时将对话框放置在其旁边 jQuery 对话框采用一个位置参数 该参数是从当前视口的左上角开始测量的 换句话说 0 0 将始终将其放在浏览器窗口的左上角 无论您当前滚动到
  • 获取连接表列的不同总和

    我在这里遇到问题 我希望有一个简单的解决方案 我会尝试使这尽可能简单 门票属于与会者 Example 得到结果没有子查询 你必须求助于高级窗口函数技巧 SELECT sum count OVER AS tickets count sum m
  • 合并重叠区间的算法

    我一直在寻找一种有效的算法来合并动态间隔数组上的重叠间隔 例如 开始时间 结束时间 明智的 1 2 4 8 3 10 becomes 1 2 3 10 合并后 因为 4 8 和 3 10 重叠 重叠意味着两个间隔的任何部分共享相同的时刻 我
  • 将sourcesJar任务添加到自定义Gradle插件

    我的公司最近为普通配置 存储库 跨项目的常见依赖项等 编写了 gradle 插件 总的来说 这极大地简化了我们的构建过程 并发现了项目之间的一些不一致之处 我们最近尝试添加一个sourcesJar任务到插件 但它不起作用 这是损坏的插件 p
  • 同一内存地址有两个不同的值

    Code include
  • ts:“Props”可以用任意类型实例化,该类型可能与其他类型无关

    const withFirebase
  • 如何在AWS lex中从意图A调用意图B? [复制]

    这个问题在这里已经有答案了 我正在使用 aws lex 我有一个意图 A 我给它起了个名字welcomeMsg 我想打电话给另一个人intent B from intent A 欢迎msg intent A 它会说 gt Hi I am a
  • python 库中的“randrange() 的非整数参数 1”

    我使用随机数生成器生成 5 到 10 之间的随机数 能不能这么难 我之前在代码中使用过它 2000 行代码 对于这里来说太多了 并且没有发生编码错误 我的代码对于我的游戏来说只是复活节彩蛋 但它破坏了我的所有代码 def slowp t f
  • AngularJS 和 Express Routing 问题

    我正在使用 AngularJS 和 ExpressJS 并且遇到路由问题 我看到了很多其他帖子 但这些解决方案似乎都不起作用 这是我在 Express 中的路线 module exports function app auth Api ro
  • R 如何在不知道长度的情况下创建 for 循环?

    目前在这方面site我正在抓取镜头图表信息 为了抓取信息 我需要为有多少个镜头创建一个 for 循环 我通过单击 球队统计数据 并查找投篮尝试次数来查找投篮次数 我想做适当的for loop无需找出镜头的数量 我目前正在做的事情 shotc
  • 更新第一行mysql php

    我正在尝试更新数据库中的第一行 我用Limit 1仅更新第一行但什么也没有发生 肯定有匹配的行 但数据库中没有任何变化 这是代码 foreach player fromsite as match player in game querytw
  • loadNibNamed 方法太慢 - 如何使其更快?

    我有一个滚动视图 其中包含大约 40 50 个不同类型的对象 对象的类型是根据对象位置的函数定义的 例如 如果是滚动视图中的第 5 个对象 gt 是 Object1 如果是滚动视图中的第 11 个对象 gt 则是 Object2 类型等 使
  • Python Popen 无法在 Windows PowerShell 中使用正确的编码

    我正在 Windows PowerShell 中运行 Python 脚本 该脚本应使用 Popen 运行另一个程序 然后通过管道传输该程序 实际上是 Mercurial 的输出以在我的脚本中使用 当我尝试在 PowerShell 中执行脚本
  • 在 Java 中逐行读取大型 JSON 文件的快速高效方法

    我有 1 亿条记录JSON文件 需要一种高效且最快的方法来读取数组的数组JSON文件输入java JSON文件看起来像 XYZ ABC XYZ ABC XYZ ABC XYZ ABC XYZ ABC XYZ ABC XYZ ABC XYZ
  • 有使用 pywin32 createprocessasuser 并获取输出的好例子吗?

    我需要使用 pywin32 方法以不同的用户身份创建进程 然后从生成的进程中获取标准输出 标准错误和错误代码 并在进程运行时将输入输入到进程中 问题是 我似乎找不到 createprocess 函数的一个很好的例子 这个问题变得更加复杂 因
  • 如何在seaborn中检索错误栏

    我使用以下函数在seaborn中绘制了条形图 ax sns barplot x Year y Value data df 现在我想根据以下规则为每个条形着色 percentages for bar yerr in zip bars yerr
  • 使用 Kryo 序列化任意 Java 对象(出现 IllegalAccessError)

    动机 为了帮助远程调试 Java 能够请求远程服务器将任意对象发送到我的本地计算机进行检查非常有用 然而 这意味着远程服务器必须能够序列化运行时事先未知的任意java对象 于是我四处打听 偶然发现Kryo序列化库 From Kryo 的文档
  • 在固定 div 内旋转文本

    我正在尝试在页面左侧设置一个固定 div 距离左侧 24px 并从页面顶部延伸到底部 该 div 内将包含导航和标题 我试图将标题旋转 90 度并居中定位到 div 的底部 很难弄清楚这一点 查了很多地方都没有看到类似的例子 我已经用当前的
  • 将 HTML 字符串转换为 DOM 元素?

    有没有办法将 HTML 转换为 div a href a span span div 或者任何其他 HTML 字符串到 DOM 元素中 这样我就可以使用appendChild 我知道我可以执行 innerHTML 和 innerText 但