Question

什么是最好的方法？彻底测试一下字符串是html还是传入的html元素

这就是我目前正在使用的

make = function(a, b) {
  let name = null;
  let el = null;


  if(/<[a-z][\s\S]*>/i.test(a)) { //<- Is this the best?
    name = a.match(/(\w+)/i)[1];
    el = document.createElement(name);
    // get attributes and apply them
    return el;
  } else if(a == htmlelement) {
     // do something here
  }
}

createNode('<img id="1" data-name="test" src="image_01.jpg" />');

Answer 1

使用DOMParser：

function isHTML(string) {
    return Array.from(new DOMParser().parseFromString(string, "text/html").body.childNodes).some(({ nodeType }) => nodeType == 1);

Answer 2

将字符串放入<template>中。

模板的content属性返回一个DocumentFragment，该属性又具有一个childElementCount属性

请注意，您也可以使用DocumentFragment之类的方法将element.appendChild(fragment)插入任何其他元素

const isHTML = (str) => {
  const temp = document.createElement('template');
  temp.innerHTML = str;
  return !!temp.content.childElementCount;
}


const strs = [
  'no html <> string',
  'some html in <span>string</span>',
  '<div>All html <span>string</span</div>'
]

strs.forEach(s => console.log(s, '<-- is html =',  isHTML(s)))

旧版IE不支持注释<template>

测试字符串是否为html的最佳方法

2 个答案: