使用javascript或jquery在innerHTML中解析html

Question

像下面的3个例子一样，如何在获取innerhtml之后如何获取id和解析以获取其编号：

var myIHTML = cell[0].innerHTML;

myIHTML = '<input type="submit" name="pic" value="Preview" /><div id="allItems1" style="display: none;"></div>' ;
or
myIHTML = '<input type="submit" name="pic" value="Preview" /><div id="allItems2" style="display: none;"></div>';
or
myIHTML ='<input type="submit" name="pic" value="Preview" /><div id="allItems11" style="display: none;"></div>'

我喜欢从allItems id获取编号。 例如1、2、11等

Answer 1

您可以将您的innerHTML返回到DOM，因此您可以在其中进行搜索，然后解析ID。 这是一个例子：

// Create a div to insert back the contents into
var div = document.createElement('div');

// Insert the contents back
div.innerHTML = '<input type="submit" name="pic" value="Preview" /><div id="allItems1" style="display: none;"></div>';

// Get the element with id starting with allItems
var id = div.querySelector('[id^="allItems"]').id;

// Get the number by replacing non-digits with empty character and then converting the string to integer
console.log( 'Number from id is', parseInt( id.replace ( /[^\d.]/g, '' ) ) );

Answer 2

您可以使用jQuery来解析字符串：

var elems = $(myIHTML);

然后使用filter（）选择其中的元素：

var alItems2Elem = elems.filter('#allItems2');

要从div的ID中获取数字，请执行以下操作：

var alItemsId = elems.filter('div').attr('id').replace('allItems', '');

这是一个Codepen

在此处阅读有关.filter()更多信息。