将 javascript 中的 html 转换为 HTML 标签

Question

我正在处理工具提示，我将从后端获取带有 html 标签的数据。我需要在工具提示中显示其相应标签中的相应数据。例如，我将从后端获取 hello user click here。我必须以 h1 格式显示为你好用户，点击这里应该是一个锚点。我尝试了这两个功能并替换了它不起作用。

具有功能：

<h1 id="data">

</h1>
    function convertToPlain(html){
        var tempDivElement = document.createElement("div");
        tempDivElement.innerHTML = html;
        return tempDivElement.textContent || tempDivElement.innerText || "";
    }
    var htmlString= "<div><h1>Bears Beets Battlestar Galactica </h1>\n<p>Quote by Dwight Schrute<a> click here<a></p></div>";
    let dataVal = convertToPlain(htmlString)
    document.getElementById("demo").innerHTML = dataVal;

替换为：

https://codesandbox.io/s/serene-fast-u8fie?file=/App.svelte

Answer 1

我通过复制粘贴你的代码制作了下面的代码片段，并在 convertToPlain 函数中更新了 return 语句，我还在 <a> 中添加了 href 属性=15=]内容。

function convertToPlain(html) {
  var tempDivElement = document.createElement("div");
  tempDivElement.innerHTML = html;
  return tempDivElement.innerHTML;
}
var htmlString = "<div><h1>Bears Beets Battlestar Galactica </h1>\n<p>Quote by Dwight Schrute<a href='#'> click here<a></p></div>";
let dataVal = convertToPlain(htmlString)
document.getElementById("demo").innerHTML = dataVal;

<h1 id="demo"></h1>

将 javascript 中的 html 转换为 HTML 标签

Covert html in javascript to HTML tags

html

javascript

svelte

svelte-component