我正在構(gòu)建一個(gè)菜譜搜索應(yīng)用程序，但我不確定如何渲染代表我想要顯示的 30 個(gè)菜譜的大塊 html。這些食譜卡顯然必須根據(jù)我搜索的餐食類(lèi)型進(jìn)行更改。如何將 html 實(shí)現(xiàn)到我的 Js 中，以便我可以根據(jù)膳食類(lèi)型更改它？我嘗試使用 insertAdjecentHTML 來(lái)完成此操作，但因?yàn)樗粫?huì)用菜譜替換舊頁(yè)面，而是在其上替換廣告。它不起作用：不過(guò)這里是代碼：// recipe card markupconst renderRecipe = () => {  const markup = `  <div class="recipe-results__card">    <div class="recipe-results--img-container">      <img        src="${data.data.hits.recipe.image}"        alt="${data.data.hits.recipe.label}"        class="recipe-results__img"      />    </div>    <p class="recipe-results__categories">      ${limitCategories}    </p>    <h2 class="recipe-results__name">      ${data.data.hits.recipe.label}    </h2>  </div>  `;  DOM.recipeGrid.insertAdjacentHTML("beforeend", markup);};// fn to display the markup for every search resexport const renderResults = recipes => {    recipes.forEach(renderRecipe);  };