E
E
Elvis2020-04-28 12:12:25
JavaScript
Elvis, 2020-04-28 12:12:25

Why does the DOM node "disappear"?

There is a function that builds a base on the page, adding SVG and not only elements to the page.
sample code:

function initdivcart(){
  let tdformap = document.querySelector('body > table > tbody > tr:nth-child(1) > td:nth-child(3)');
  let divcart = document.createElement('div');
  divcart.setAttribute('id', 'divcart');
  let cart = document.createElementNS(svgNS, 'svg');
  cart.setAttributeNS(null, 'id', 'cart');
  let glabwall = document.createElementNS(svgNS, 'g');
  glabwall.setAttributeNS(null, 'id', 'labwall');
  let g = document.createElementNS(svgNS, 'g');
  g.setAttributeNS(null, 'id', 'lab');

  cart.append(g);
  cart.append(glabwall);
  divcart.append(cart);
  tdformap.append(divcart);
}

as well as pulling out some information from IndexedDB (the point is not in the data anyway):
function dbget(table, ind, key) {
  return new Promise((resolve) => {
    let openRequest = indexedDB.open('FV', 6);
    openRequest.onsuccess = function() {
      let db = openRequest.result;
      let transaction = db.transaction(table, 'readonly');
      let labs = transaction.objectStore(table);
      let index = labs.index(ind);
      let request = index.getAll(key);
      request.onsuccess = function() {
        let res = request.result;
        db.close();
        resolve(res);
      };
    };
  });
}

then there is a condition, if there is no element with id = divcart, then initialize
if(!document.getElementById('divcart')){
  console.log('1'+document.getElementById('labwall'));
  initdivcart();
  console.log('2'+document.getElementById('labwall'));
  dbget('labs', 'lablvlID', lablvlID).then(resthis => {
    for(let xxlab of resthis){
      console.log('3'+document.getElementById('labwall'));
      labwall(xxlab);
      console.log('4'+document.getElementById('labwall'));
    }
    itemonlab(lab);
  });
}

Did you notice I placed the console logs? So this is what I get in the console:
1null
2[object SVGGElement]
3null
Uncaught (in promise) TypeError: Cannot read property 'append' of null

1 - this is understandable, there was no initialization yet and there is no such element.
2 - the element has appeared
3 - the element has disappeared for some reason. Due to the fact that in the further function "labwall" I just use the SVG element with the id "labwall", it crashes with the error "Cannot read property 'append' of null".
So I don’t understand why at “stage No. 3” my element disappears?
If something is not clear - ask questions, I will write in more detail.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question