Sugestão de solução:
let listaDeProdutos = document.getElementById('lista-produtos');
let valorTotal = 1400;
function limpar(){
listaDeProdutos.innerHTML = '';
document.getElementById('valor-total').innerText = 'R$0';
valorTotal = 0;
}
function separarNomeEPreco(textoDoItem) {
// Usamos split() para dividir a string no delimitador " - R\$"
let partes = textoDoItem.split(' - R$');
// Agora, 'partes' será um array: ["Fone de ouvido", "100"]
let nomeDoItem = partes[0].trim(); // Pega a primeira parte e remove espaços em branco extras
let precoString = partes[1].trim(); // Pega a segunda parte e remove espaços em branco extras
// O preço ainda é uma string, precisamos convertê-lo para um número para cálculos
let precoNumerico = parseFloat(precoString);
return{
nome: nomeDoItem,
preco: precoNumerico
};
}
function adicionar(){
let produtoSelecionado = document.getElementById('produto').value;
console.log(document.getElementById('produto').value);
let informacoes = separarNomeEPreco(produtoSelecionado);
console.log(informacoes);
let quantidade = parseInt(document.getElementById('quantidade').value);
if (isNaN(quantidade)){
quantidade = 1;
}
console.log(quantidade);
console.log(valorTotal);
valorTotal += (quantidade * informacoes.preco);
let novoProdutoElemento = document.createElement('section');
novoProdutoElemento.classList.add('carrinho__produtos__produto');
novoProdutoElemento.innerHTML = `<span class="texto-azul">${quantidade}x</span> ${informacoes.nome} <span class="texto-azul">R\$${informacoes.preco}</span>`;
listaDeProdutos.appendChild(novoProdutoElemento); // Transforma o elemento em filho
document.getElementById('valor-total').innerText = `R$${valorTotal}`;
}