如何在Javascript輸出中添加錨鏈接？

Question

我正在嘗試僅使用javascript在頁面上調用一條消息，然后使用div ID進行顯示。 我已經顯示了消息，但是我想在消息中添加一個錨鏈接，但是我想做的沒有用。

這是怎么做的？

 window.onload = function() { var el = document.getElementById('head-msg'); el.textContent = 'Our payment processor is currently having an issue processing payments. Please come back to make your purchase. For additional assistance, contact Customer Service' + ' <a class="btn btn-sm btn-danger" href="#">Contact Us</a>'; } 

 #head-msg { background-color: orange; padding: 5px; color: #ffffff; } 

 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script> <div class="container p-5"> <div class="row"> <div class="col-sm-12"> <h1>Message Here</h1> <div id="head-msg"></div> </div> </div> </div> 

Answer 1

試試這個：

window.onload = function() {
  var el = document.getElementById('head-msg');
  el.innerHTML += 'Our payment processor is currently having an issue processing payments. Please come back to make your purchase. For additional assistance, contact Customer Service ';

  var a = document.createElement('a');
  var linkText = document.createTextNode('Contact Us');

  a.appendChild(linkText);
  a.href = '#';
  a.className = 'btn btn-sm btn-danger';

  el.appendChild(a);
}