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

Question

что я пытаюсь сделать, это изменить имя клиента, щелкнув данные, которые мне нужно изменить, но по какой-то причине метка var возвращает ноль, я не знаю, почему кто-то может определить, почему?ошибка в консоли говорит: TypeError не может прочитать свойство 'style' из null.когда я наведу курсор мыши на метку var, она возвращается как ноль

function hentkundesel(snapshot){
    var kundeselkey = snapshot.key;
    var kundeselinfo = snapshot.val();

    inpkunde.innerHTML += `
     <option value="${kundeselkey}">${kundeselinfo.Fornavn} ${kundeselinfo.Etternavn}</option>
    `

    txttabell.innerHTML += `
     <tr id="${kundeselkey}">
     <td><label class="editlabel" onclick="edit('${kundeselkey}')">${kundeselinfo.Fornavn}</label><input type="text" class="edititem" style="display:none"></td>

     <td><label class="editlabel" onclick="edit('${kundeselkey}')">${kundeselinfo.Etternavn}</label><input type="text" class="edititem" style="display:none"></td></td>

     <td><label class="editlabel" onclick="edit('${kundeselkey}')">${kundeselinfo.Adresse}</label><input type="text" class="edititem" style="display:none"></td></td>

     <td><label class="editlabel" onclick="edit('${kundeselkey}')">${kundeselinfo.Mobil}</label><input type="text" class="edititem" style="display:none"></td></td>

     <td><label class="editlabel" onclick="edit('${kundeselkey}')">${kundeselinfo.Poststed}</label><input type="text" class="edititem" style="display:none"></td></td>

     <td><label class="delete" onclick="slett('${kundeselkey}')"><button>Slett</button></label></td>
     </tr>
    `
}


 function edit(kundeselkey){
    var rediger = kunde.child(kundeselkey);
    var label = document.getElementById(`#${kundeselkey} .editlabel`);
    label.style.display = "none";
    var tekst = label.innerText;

    var inputfelt = document.getElementById(`#${kundeselkey} .edititem`);
    inputfelt.style.display = "block";
    inputfelt.value = tekst;
    inputfelt.focus();
}

Answer 1

с использованием идентификатора <tr> не будет работать, так как он одинаков для всех ячеек, вам нужно использовать ссылку на сам ярлык.Затем вы можете использовать nextElementSibling, чтобы получить <input> после метки.

function edit(label){
    label.style.display = "none";
    var tekst = label.innerText;

    var inputfelt = label.nextElementSibling;
    inputfelt.style.display = "block";
    inputfelt.value = tekst;
    inputfelt.focus();
}

<table>
  <tr>
    <td><label class="editlabel" onclick="edit(this)">Firstname</label><input type="text" class="edititem" style="display:none"></td>

    <td><label class="editlabel" onclick="edit(this)">Lastname</label><input type="text" class="edititem" style="display:none"></td>
    </td>

    <td><label class="editlabel" onclick="edit(this)">Email</label><input type="text" class="edititem" style="display:none"></td>
    </td>

    <td><label class="editlabel" onclick="edit(this)">Mobile</label><input type="text" class="edititem" style="display:none"></td>
    </td>

    <td><label class="editlabel" onclick="edit(this)">Postal</label><input type="text" class="edititem" style="display:none"></td>
    </td>

    <td><label class="delete" onclick="slett(this.parentElement)"><button>Slett</button></label></td>
  </tr>
</table>