Hoe stel ik ID in met javascript?

Ik genereer een pagina met veel product, en hiervoor heb ik veel ID nodig, en ik deed het met behulp van een serverzijde (Python), dus ik stuur voor elk product zijn eigen <div id='hello1'> test </div>

Omdat de gebruiker dinamycaly een waarde instelt en het resultaat in de browser ziet, wil ik een andere idgenereren, hiervoor heb ik btoa("hello1")dus ik genereer een andere id

Dus de vraag, hoe plaats ik btoa("hello1")in <div>?

Bewerken: wat ik wil genereren is een andere <div>en de eerste niet bijwerken.

<input id="{{str(product["avt"]["fto"])}}" > this will become  <input id="12232" > because it is special to Tornado Template
<span>New price :</span>
<span id=btoa({{str(produit["avt"]["fto"])}})> This  is where i use innerHTML </span>

zoals u kunt zien, zullen de gebruikers een waarde invoeren en deze dynamisch bekijken.

Dit werkt vanuit Python met:

<span id="{{base64.b64encode(str(produit["avt"]["fto"]))}}"></span>

maar als het kan met Javascript, is de server voor de helft van de bewerkingen gratis!

Antwoord 1, autoriteit 100%

Bedoel je zoiets?

var hello1 = document.getElementById('hello1');
hello1.id = btoa(hello1.id);

Om het voorbeeld verder te zetten, stel dat je alle elementen met de klasse ‘abc’ wilt krijgen. We kunnen querySelectorAll()gebruiken om dit te bereiken:

HTML

<div class="abc"></div>
<div class="abc"></div>

JS

var abcElements = document.querySelectorAll('.abc');
// Set their ids
for (var i = 0; i < abcElements.length; i++)
    abcElements[i].id = 'abc-' + i;

Hiermee wordt de ID 'abc-<index number>'aan elk element toegewezen. Dus het zou er zo uit komen te zien:

<div class="abc" id="abc-0"></div>
<div class="abc" id="abc-1"></div>

Om een ​​element te maken en een idtoe te wijzen, kunnen we document.createElement()gebruiken en vervolgens appendChild().

var div = document.createElement('div');
div.id = 'hello1';
var body = document.querySelector('body');
body.appendChild(div);

Bijwerken

Je kunt de idop je element zo instellen als je script in je HTML-bestand staat.

<input id="{{str(product["avt"]["fto"])}}" >
<span>New price :</span>
<span class="assign-me">
<script type="text/javascript">
    var s = document.getElementsByClassName('assign-me')[0];
    s.id = btoa({{str(produit["avt"]["fto"])}});
</script>

Uw vereisten zijn echter nog steeds niet 100% duidelijk.