NODELIST JAVASCRIPT

19/05/2021

Boa noite!
Estou querendo pegar os elementos de dentro de uma <tr> e colocar em uma <ul> sempre que aparecerem novos elementos dentro da <tr>.
E ai � retornado uma nodelist de cada elemento com querySelectorAll. Algu�m conseguiria me ajudar em manipular a nodelist?
Eu precisaria trazer cada item com o seu index e em cada <ul> com seu respectivo index tamb�m...
Por exemplo: Adicionei o produto no carrinho, vai ser inserido uma nova <tr> contendo as informa��es, preciso sempre que fizer isso, pegar essas informa��es e jogar na <ul> criada.


  const skuImagesCartGb = document.querySelectorAll(".cart-deslizante .cartSkuImage a")
  const skuNamesCartGb = document.querySelectorAll(".cart-deslizante .cartSkuName h4")
  const skuPricesCartPrGb = document.querySelectorAll(".cart-deslizante .cartSkuPrice .cartSkuUnitPrice")
  const skuQtdsCartGb = document.querySelectorAll(".cart-deslizante .cartSkuQuantity .cartSkuQtt")

const getElements = {
  getItens(obj) {
    var resultado = "";
    for (var i in obj) {
      if (obj.hasOwnProperty(i)) {
        resultado += i + obj[i].innerHTML;
      }
    }
    return resultado;
  }
}

const DOM = {
  containerProduct: document.querySelector(".minicart-itens"),

  addProduct(obj, index) {
    const ul = document.createElement("ul")
    ul.innerHTML = DOM.innerHTMLProduct(obj, index)
    ul.dataset.index = index
    DOM.containerProduct.appendChild(ul)
  },

  innerHTMLProduct(obj, index) {
    let html = `
    <li class="cartSkuImage">${getElements.getItens(obj)}</li>
    <li class="cartSkuDados">
    <div class="cartSkuName"></div>
    <div class="cartSkuPrice"></div>
    <div class="cartSkuQuantity"></div>
    </li>
    <li class="cartSkuRemove"></li>
    `;
    return html;
  }
}

const cart = {
  init(){
    DOM.addProduct(skuImagesCartGb)
  }
}

cart.init()

Guilherme Barbosa

Curtir t�pico + 0

Responder