首页 > 其他分享 >js string转html节点

js string转html节点

时间:2024-01-13 09:55:05浏览次数:28  
标签:const string js html str var div document

1、

var str = "<h1>这是一个标题</h1>";
var parser = new DOMParser();
var doc = parser.parseFromString(str, "text/html");
var html = doc.body.firstChild;

2、

const str = "<h1>这是一个标题</h1>";
const fragment = document.createDocumentFragment();
const range = document.createRange();
range.selectNode(document.body);
fragment.appendChild(range.createContextualFragment(str));
const html = fragment.firstChild;

3、

const str = "<h1>这是一个标题</h1>";
const div = document.createElement("div");
div.innerHTML = str;
const html = div.firstChild;

 

标签:const,string,js,html,str,var,div,document
From: https://www.cnblogs.com/laremehpe/p/17962020

相关文章

  • 一行代码解决Three.js中只能在一侧看到物体的问题
    项目场景:  因为该项目比较复杂庞大,在此就简单介绍一下:  通过Three.js创建若干个物体进行了组装,从而形成了一个类似眼球模拟模型的项目,用户可以通过拖动鼠标来达到控制视角(摄像机)的目的,以此来观察整个眼球状态。Image1Three.js眼球模型  注:下面所说的正视为从红线正轴......
  • js中的对象,如果赋值给多个变量,那么会有性能问题吗
    js中的对象,如果赋值给多个变量,那么会有性能问题吗?在JavaScript中,将一个对象赋值给多个变量时,并不会直接导致性能问题。当一个对象被赋值给多个变量时,实际上这些变量都会引用同一个对象,即它们指向内存中的同一块地址。这种行为称为“对象引用”。例如:constobj={a:1,b:2}......
  • html5页面飘落蒲公英动画特效代码
    超酷炫html5页面飘落蒲公英动画特效代码<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metaht......
  • 关于html表格学习
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Document</title>&l......
  • js localeCompare()方法
    最后一个与模式匹配相关的字符串方法是split()。这个方法会根据传入的分隔符将字符串拆分成数组。作为分隔符的参数可以是字符串,也可以是RegExp对象。(字符串分隔符不会被这个方法当成正则表达式。)还可以传入第二个参数,即数组大小,确保返回的数组不会超过指定大小。来看下面的......
  • js-内置对象
    早期的浏览器开发商认为使用JavaScript动态生成HTML标签是一个需求。因此,早期浏览器扩展了规范,增加了辅助生成HTML标签的方法。下表总结了这些HTML方法。不过,这些方法基本上已经没有人使用了,因为结果通常不是语义化的标记。anchor(name)<aname="name">string</a>big()......
  • js eval()方法
    与encodeURI()和encodeURIComponent()相对的是decodeURI()和decodeURIComponent()。decodeURI()只对使用encodeURI()编码过的字符解码。例如,%20会被替换为空格,但%23不会被替换为井号(#),因为井号不是由encodeURI()替换的。类似地,decodeURIComponent()解码所有被encodeUR......
  • js Global 对象属性
    Global对象有很多属性,其中一些前面已经提到过了。像undefined、NaN和Infinity等特殊值都是Global对象的属性。此外,所有原生引用类型构造函数,比如Object和Function,也都是Global对象的属性。undefinedNaNInfinityObjectArrayFunctionBooleanString特殊值undefi......
  • js Math方法
    ECMAScript提供了Math对象作为保存数学公式、信息和计算的地方。Math对象提供了一些辅助计算的属性和方法。1.Math对象属性:Math对象有一些属性,主要用于保存数学中的一些特殊值。下表列出了这些属性。Math.EMath.LN10Math.LN2Math.LOG2EMath.LOG10EMath.PIMath.SQRT1_......
  • 无涯教程-JSON - Python编程
    本章介绍如何使用Python编程语言编码和解码JSON对象。让我们从准备环境开始,以使用Python进行JSON编程。在开始使用Python编码和解码JSON之前,您需要安装任何可用的JSON模块,在本教程中,我们已经下载并安装了Demjson,如下所示-$tarxvfzdemjson-1.6.tar.gz$cddemjson-1.6$pyt......