在 Javascript 中添加指向 .textcontent 的链接

Question

When I received help on adding a link to symbolSpan, I am now getting a link but the symbols are showing at the bottom of the page and not in the table with the rest of the data... How do I fix that?

const renderBalances = balances => {
  //
  binanceBalances.innerHTML = "";
  //
  //console.log(balances);
  balances.forEach(balance => {
    let balanceLi = document.createElement("li");
    balanceLi.className = "list-group-item list-group-item-justify-content-center";
    let balanceDiv = document.createElement("div");
    balanceDiv.className = "d-flex w-100 justify-content-between"; 

        let symbolSpan = document.createElement("span");
        symbolSpan.textContent = balance.symbol;
     //   balanceDiv.appendChild(symbolSpan);
        function createLink(linkExtension) {
    
          const balanceDiv = document.createElement("div");
          const symbolSpan = document.createElement("span");
          const link = document.createElement("a");
        
          link.setAttribute('href', `www.binance.com/en/trade/${linkExtension}`);
          link.textContent = balance.symbol;
        
          symbolSpan.appendChild(link);
          balanceDiv.appendChild(symbolSpan);
          document.body.appendChild(balanceDiv);
        }
    createLink('myparam')

this is the rest of the code for this table

    let price = document.createElement("span");
    price.textContent = balance.startPrice;
    balanceDiv.appendChild(price);
    let available = document.createElement("span");
    available.textContent = balance.holdings;
    balanceDiv.appendChild(available);
    let onOrder = document.createElement("span");
    onOrder.textContent = balance.used;
    balanceDiv.appendChild(onOrder);

    balanceLi.appendChild(balanceDiv);

    binanceBalances.appendChild(balanceLi);
  });
};

Answer 1

Create a span and a link html element. For the link element append the text and the href attribute.

Attach the link element to span and span to div. At last append to DOM.

Pass the additional parameter that needs to be appended to the link.

 function createLink(linkExtension) { const balanceDiv = document.createElement("div"); const symbolSpan = document.createElement("span"); const link = document.createElement("a"); link.setAttribute('href', `www.binance.com/en/trade/${linkExtension}`); link.textContent = 'binance link'; symbolSpan.appendChild(link); balanceDiv.appendChild(symbolSpan); document.body.appendChild(balanceDiv); } createLink('myparam')