Поиск по тексту нужных ячеек таблицы и активация чекбокса
Есть такая табличка
<table class="table_s"> <tbody> <tr><td><input type="checkbox"></td> <td>950</td></tr> <tr><td><input type="checkbox"></td><td>100 Йо-хо-хо!</td></tr> <tr><td><input type="checkbox"></td><td>299 и бутылка рома!</td></tr> ... и т.д. Я хочу запустить простой JS в консоли Хрома, который бы искал в таблице текст с заданными через запятую кусками текста (например: "100", "299", Йо-хо", "992") и при совпадении, отмечал чекбоксы соответствующие найденному пункту. Вместо запятой можно использовать любой другой разделитель или же логическое "или" - не суть. Касательно логики алгоритма, вроде всё просто: Ищем в правом <td> некий набор символов. Если что-то из заданного через запятую совпадает, то делаем "checked" у чекбокса в левом <td>. Но я не знаю, как делать выборку неидентифицированных элементов и т.д. Никаких идентификаторов строки и столбцы таблицы не имеют. Их много, разного количества строк, но структура одинакова: Слева чекбокс, справа текст с описанием пункта Нужен чистый JS без всяких jQuery. Помогёте? |
khameleonium,
:-?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<table class="table_s">
<tbody>
<tr>
<td><input type="checkbox"></td>
<td>950</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>100 Йо-хо-хо!</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>299 и бутылка рома!</td>
</tr>
</tbody>
</table>
<script>
const words = "100,299,Йо-хо,992",
table = document.querySelector(".table_s")
function checkedWords(words, table) {
words = words.split(",");
const inputs = table.querySelectorAll("[type='checkbox']");
inputs.forEach(el => {
let next = el.parentNode.nextElementSibling;
if (next) {
let text = next.textContent;
el.checked = words.some(word => text.includes(word))
}
})
}
checkedWords(words, table)
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 20:59. |