Я попытался найти способ получить значения из этой строки:

Edges</label><div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(226, 84, 153);"></div><div class="report_color_container"><i>Carnival Pink: </i>7</div></div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(103, 66, 48);"></div><div class="report_color_container"><i>Chocolate Brown: </i>5</div></div></div></div><div><hr><label>

Мне нужно найти способ получить цвета «Карнавальный розовый» и «Шоколадно-коричневый» из этой строки и добавить их в массив. Строка хранится в переменной.

Я получаю эту строку выше в var следующим образом:

var edgesSubString = slb_report_raw.substring(
    slb_report_raw.lastIndexOf("Edges"), 
    slb_report_raw.lastIndexOf("Corners")
);
console.log("SUB: "+edgesSubString); 

Любая помощь будет оценена, я исчерпал свои навыки.

1
Skit 14 Сен 2020 в 18:06

3 ответа

Лучший ответ

Если вы исправите свой HTML так, чтобы его можно было преобразовать в объект jQuery, что я сделал в следующем примере, добавив отсутствующий ведущий тег <label>, то вы можете find() настроить таргетинг на { Элементы {X2}}, а затем map() для построения массива их текста. Попробуй это:

let str = '<label>Edges</label><div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(226, 84, 153);"></div><div class="report_color_container"><i>Carnival Pink: </i>7</div></div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(103, 66, 48);"></div><div class="report_color_container"><i>Chocolate Brown: </i>5</div></div></div></div><div><hr><label>';

var colours = $(str).find('i').map((i, el) => el.textContent.trim()).get();
console.log(colours);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
0
Rory McCrossan 14 Сен 2020 в 15:12

Вы можете сделать это с помощью регулярного выражения

const STR = 'Edges</label><div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(226, 84, 153);"></div><div class="report_color_container"><i>Carnival Pink: </i>7</div></div><div class="edges_and_corners_container"><div class="color-cont"><img class="color-img" src="img/tiles/light.png" style="background-color: rgb(103, 66, 48);"></div><div class="report_color_container"><i>Chocolate Brown: </i>5</div></div></div></div><div><hr><label>'
const res = STR.match(/(?<=<i>)[^:]*/g)
console.log(res)
0
Jacek Rojek 14 Сен 2020 в 15:23

Я бы предложил использовать регулярные выражения.

Например:

const str = 'Youre string'
const reg = /<i>[\w\s]+/g // find i tag and get all letters and spaces after that
const strings = str.match(reg).map(v => v.slice(3)) // after that remove i tag from resulting array of strings

Будет выведено => ["Carnival Pink", "Chocolate Brown"]

0
Dharman 14 Сен 2020 в 15:24