用JS将html行拆分为单独的变量

Question

在纯javascript（不使用JQuery / dojo / etc）中，分割字符串的最佳/最简单/最快捷方式是什么，例如

var tempString = '<span id="35287845" class="smallIcon" title="time clock" style="color:blue;font-size:14px;" contenteditable="false">cookie</span>';

到

var id = 'id="35287845"';
var class = 'class="smallIcon"';
var title = 'title="time clock"';
var style = 'style="color:blue;font-size:14px;"';
var contenteditable = 'contenteditable="false"';

需要注意的事项：

• “空格”不能用作正确的分隔符，因为它可能出现在上面（时钟）的值中，例如标题。

• 在每个变量周围保留双引号，例如id =“35287845”很重要

• 可以丢弃开/关跨度标签，以及内容，在本例中为“cookie”

Answer 1

我认为您正在尝试获取范围内的属性，请检查此响应，告诉您如何执行此操作。

Get all Attributes from a HTML element with Javascript/jQuery

你也可以获取属性并使字符串将值与字符串连接起来。

（你可以在纯JavaScript中解释一下）

Answer 2

这是一种方法，即将输入字符串作为innerhtml放入javascript创建的dom元素中，然后利用属性数组

//Input html string
var tempString = '<span id="35287845" class="smallIcon" title="time clock" style="color:blue;font-size:14px;" contenteditable="false">cookie</span>';

//make element to contain html string
var tempDiv = document.createElement("div");

//place html string as innerhtml to temp element
tempDiv.innerHTML = tempString;

//leverage attributes array on element
var attributeArray = tempDiv.firstChild.attributes;

//log results
console.log(attributeArray);

请注意，您现在可以执行类似

的操作

var classString = attributeArray.class;

或

var titleString = attributeArray.title;

修改

这是一个可以执行此操作的函数：

function getAttributesFromString(htmlString)
{
 var tempDiv = document.createElement("div");
 tempDiv.innerHTML = htmlString;
 return tempDiv.firstChild.attributes;
}