按钮内带有加载动画的搜索按钮

Question

我有一个搜索按钮，我试图在搜索按钮内获取加载动画，但不知道如何操作。请帮助我提出您的建议。

<button class="btn btn-primary tap" type="button" id="searchForContent">Search</button>

<div class="container"> 
     <div id="searchedContent"></div>                     
</div>

Answer 1

const button = document.getElementById("searchForContent");
const searchedContent = document.getElementById("searchedContent");


function search() {
  button.innerHTML = "Searching.... ";
  // you can change this if you calling any api or something
  setTimeout(() => {
  button.innerHTML = "Search";
  searchedContent.innerHTML = "Search results are: "
  }, 3000)
}

<button class="btn btn-primary tap" type="button" id="searchForContent" onclick="search()">Search</button>

<div class="container"> 
     <div id="searchedContent"></div>                     
</div>