Estou precisando de ajuda com a seguinte questão:
Em uma lista de preços HTML, eu quero criar uma função usando jQuery/JavaScript para que assim que a página carregar, a gente selecionar o objeto HTML, transformar em uma string, dividir ele após a vírgula e então, substituir o objeto HTML pela variável
$(document).ready(function() {
var stringin = $('.priceList', 'ul', 'li').toString();
var formatedPrice = $(stringin).split(',');
$('.priceList', 'ul', 'li').innerHTML(formatedPrice[0]);
});
.price {
position: absolute;
top: 100px;
left: 100px;
}
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Cents</title>
<link rel="stylesheet" href="main.css">
<script src="jquery-3.2.1.min.js"></script>
</head>
<body>
<div class="priceList">
<ul>
<li>R$ 50,89</li>
<li>R$ 188,43</li>
<li>R$ 1200,24</li>
</ul>
</div>
</body>
</html>
Acima foi a minha ideia, os passos foram: criar duas variáveis, a primeira para selecionar o objeto e transformar em uma string, na segunda eu divido a string em dois a partir da vírgula. Então, a gente pega o primeiro array "[0]" e altera o HTML. Enquanto estou escrevendo a dúvida eu já parei pra pensar que no caso, como estou lidando com mais de um valor, seria correto fazer um vetor, ou estou enganado?
Enquanto isso vou tentar fazer um vetor, qualquer coisa eu posto aqui se der certo.
De qualquer forma, preciso de ajuda, se houver uma outra forma de realizar o objetivo por favor me digam. talvez outra lógica, ou então com JavaScript puro...
innerHTML
num objeto jquery? deveria utilizarhtml()
. E se fosse utilizarinnerHTML
. deveria igualar isso ao valor, não por entre parenteses, aka:document.querySelector('.priceList', 'ul', 'li').innerHTML = formatedPrice[0]
Também não entendi por que transformou num objeto jqueryvar formatedPrice = $(stringin).split(',');
para usar split, se o split é feito para ser usado em arrays, não em objetos jquery. Precisa rever o seu código cara.