Как сделать элементы списка в массив javascript

Question

У меня есть переменная, которая содержит некоторый HTML. Этот HTML не находится на теле документа - только в переменной! Из этого я хочу извлечь содержимое каждого li и поместить его в массив, чтобы я мог сделать что-то новое с каждым элементом списка.

Могу ли я сделать что-то вроде этого?

var myList = "<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>"; 
myList.getElementByTagName('LI') = myLiContents; 

Спасибо, что посмотрели!

Answer 1

Вы можете создать фиктивный элемент и установить innerHTML этого элемента в качестве HTML-строки у вас есть:

var myList = "<ul><li>item 1</li><li>item 2</li><li>item 3</li></ul>", 
    dummy = document.createElement('div'); 

dummy.innerHTML = myList; 
console.log(dummy.getElementsByTagName('li')); 

Однако обратите внимание, что результат getElementsByTagName является не массив, но nodeList, массив-подобный объект. Вы все равно можете запустить цикл через nodeList, чтобы создать реальный массив.

Answer 2

Вы не можете использовать getElementByTagName на строке ... только на HTML-элементах, вставленных в документ. Но для чего вы пытаетесь достичь, вам действительно не нужно это делать. Вы можете использовать регулярное выражение для извлечения всех <li> с от вашей строки:

var li = myList.match(/<li>.*?<\/li>/gi); 

Который даст массив так:

["<li>item 1</li>", "<li>item 2</li>", "<li>item 3</li>"] 

Чтобы избавиться от дополнительной <li> и </li> вы можете сделать строка заменяется по мере прохождения по каждому элементу:

li[i].replace(/<\/?li>/gi, "");