Почему parentNode заменяет все элементы td, а не указанные?
Привет!
Может кто-нибудь взглянуть на мой код и сказать, что не так? (Нет, у меня нет доступа для редактирования HTML.)
Я пытаюсь поставить id="goToThis" на первого родителя, который соответствует v(weekNumber), который является v2 в этом случае.
Проблема: он устанавливает его для каждого родителя, а не только для тех, которые соответствуют "goToweek".
Я хочу, чтобы он только добавил "goToThis" в первый соответствующий.
Javascript(РЕЗУЛЬТАТ = "2019, 2"):
function setAttributes()
{
var goToweek = "<td>v" + result[1] + "</td>"
elementos = document.body.getElementsByTagName("td");
for (var is = 0, length = elementos.length; is < length; is++)
{
for (var cc in goToweek)
{
if (elementos[is].innerHTML.indexOf(goToweek[cc]) !== -1)
{
parentOfTds2 = (elementos[is]).parentNode;
parentOfTds2.setAttribute("id", "goToThis");
}
};
};
}
Пример HTML:
<tr>
<td>2016</td>
<td>v2</td>
</tr>
<tr>
<td>2016</td>
<td>v4</td>
</tr>
<tr>
<td>2016</td>
<td>v5</td>
</tr>
<tr>
<td>2016</td>
<td>v6</td>
</tr>
<tr>
<td>2016</td>
<td>v7</td>
</tr>
<tr>
<td>2016</td>
<td>v8</td>
</tr>
<tr>
<td>2016</td>
<td>v22</td>
</tr>........
После выполнения кода:
<tr id="goToThis">
<td>2016</td>
<td>v2</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v4</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v5</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v6</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v7</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v8</td>
</tr>
<tr id="goToThis">
<td>2016</td>
<td>v22</td>
</tr>........
Я хочу:
<tr id="goToThis">
<td>2016</td>
<td>v2</td>
</tr>
<tr>
<td>2016</td>
<td>v4</td>
</tr>
<tr>
<td>2016</td>
<td>v5</td>
</tr>
<tr>
<td>2016</td>
<td>v6</td>
</tr>
<tr>
<td>2016</td>
<td>v7</td>
</tr>
<tr>
<td>2016</td>
<td>v8</td>
</tr>
<tr>
<td>2016</td>
<td>v22</td>
</tr>........
2 ответа
Вот быстрое решение, которое я выбрал.
function setAttributes() {
const elementos = document.getElementsByTagName("tr");
for (let is = 0; is < elementos.length; is++) {
const innerElements = elementos[is].children;
if (innerElements[0].innerHTML === (""+result[0]) && innerElements[1].innerHTML === ("v"+result[1])) {
elementos[is].id = "goToThis";
break;
}
}
}
Проблема, которую я обнаружил на вашем примере, заключается в том, что даже если вы сравнили innerHTML
элемента против goToWeek
как бы вы были уверены, что td
год совпадает с годом в массиве результатов?
Чтобы избежать этого вместо того, чтобы получить все td
Я получил все tr
элементы и проверили, что год и неделя совпадают, и добавьте идентификатор в соответствующий tr
родитель и вырваться из цикла. Это должно прикрепить goToThis к первому элементу, соответствующему году и неделе.
[].forEach.call(document.querySelectorAll("td"), function(el, ind, arr) { // in this string we give all td elements and iterate they
if (el.textContent === "v2" && !arr._mutching) { // search match element and watch flag
el.parentNode.id = "goToThis"; // set for paren id
arr._mutching = true; set flag for break all cycle
}else{
return;
}
});
<table>
<tr>
<td>2016</td>
<td>v2</td>
</tr>
<tr>
<td>2016</td>
<td>v4</td>
</tr>
<tr>
<td>2016</td>
<td>v5</td>
</tr>
<tr>
<td>2016</td>
<td>v2</td> <!-- will not mutch -->
</tr>
<tr>
<td>2016</td>
<td>v7</td>
</tr>
<tr>
<td>2016</td>
<td>v8</td>
</tr>
<tr>
<td>2016</td>
<td>v22</td>
</tr>
</table>