Как превратить элементы списка в массив 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

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

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, "");

Answer 2

Вы можете создать фиктивный элемент и установить 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, чтобы создать реальный массив.