Как вставить строку в таблицу HTML без идентификатора в JavaScript - PullRequest
Новая
       8

Как вставить строку в таблицу HTML без идентификатора в JavaScript

0 голосов
/ 13 апреля 2020

У меня есть таблица HTML на любом сайте: 

<table>
<tbody>
    <tr>
        <td>customer</td>
        <td class="ltr" id="e6">2</td>
        <td class="ltr" id="e9">2</td>
    </tr>
</tbody>

Я хочу сделать некоторые вычисления и вернуть число с моим написанным расширением chrome с этим кодом: 

    var tradeActBox = document.createElement('tr');
    var before = document.getElementById('e9');
    tradeActBox.innerHTML =
        '<td>power</td><td>buy</td><td>sell</td>';
    insertAfter(tradeActBox, before);
}

function insertAfter(el, referenceNode) {
    referenceNode.parentNode.insertBefore(el, referenceNode.nextSibling);
}

, но проблема в том, что предыдущий тег tr не закрывается и создает коллизию следующим образом: 

<tr>
<td>customer</td>
<td class="ltr highlight1" id="e6">2</td>
<td class="ltr highlight1" id="e9">2</td>
<tr>
    <td>power</td>
    <td>buy</td>
    <td>sell</td>
</tr>

Я хочу создать строку, подобную этой: 

    <tr>
    <td>customer</td>
    <td class="ltr highlight1" id="e6">2</td>
    <td class="ltr highlight1" id="e9">2</td>
</tr>

<tr>
    <td>power</td>
    <td>buy</td>
    <td>sell</td>
</tr>

1 Ответ

1 голос
/ 13 апреля 2020

Попробуйте следующую модифицированную версию insertAfter(): 

function insertAfter(el, referenceNode) {
    referenceNode.parentNode.insertAdjacentElement('afterend', el);
}

Здесь мы используем insertAdjacentElement() для вставки новой строки таблицы после конца первой строки, которая будет после закрытия </tr> tag.

Более подробную информацию можно найти здесь: Element.insertAdjacentElement ()

...