將構造變量預設爲JS中的HTML

幾周前我開始學習Web開發以獲得樂趣，並且我正在使用HTML，CSS和JS創建一個rock-paper-scissors遊戲。我試圖添加一些東西到一個HTML塊，但沒有這樣做我的當前代碼。經過大量的谷歌搜索，我決定嘗試發佈我的問題。將構造變量預設爲JS中的HTML

我添加了函數我試圖添加線和我試圖將它們添加到的地方。正如我所說的，我的代碼不工作，我不明白爲什麼。

function displayPlayedRounds(winner) { 
 
    "use strict"; 
 
// <p class="roundCountPrev"> 
 
//  <img src="/images/whiteRock.png" class="player1PrevRound"/> 
 
//   &larr; Round 4 
 
//  <img src="/images/blackPaper.png" class="player2PrevRound"/> 
 
// </p> 
 
    var middlePart, toAppend; 
 
    if (winner === -1) { 
 
     middlePart = "Round " + movesMade + " &rarr;"; 
 
    } else if (winner === 1) { 
 
     middlePart = "&larr; Round " + movesMade; 
 
    } else { 
 
     middlePart = "Round " + movesMade; 
 
    } 
 
    
 
    toAppend = "<p class='roundCountPrev'><img src=" + userImages[userChoice] + " class='player1PrevRound'/>" + middlePart + "<img src=" + compImages[compMove] + "class='player2PrevRound'/></p>"; 
 
    document.getElementById('displayPrevRounds').prepend('toAppend'); 
 
}

<span id='displayPrevRounds' class="player1">Previous rounds 
 
    <p class="roundCountPrev"> 
 
     <img src="/images/whiteRock.png" class="player1PrevRound"/>&larr; Round 4 
 
     <img src="/images/blackPaper.png" class="player2PrevRound"/> 
 
    </p> 
 
</span>

來源

2016-09-20 Kert

prepend是一個jquery函數，創建一個jquery對象 – madalinivascu

首先，作爲@madalin ivascu說，prepend是一個jQuery函數，而不是來自於DOM方法。

如果你想使用jQuery，它的確很方便，你首先需要「import/require/include」jQuery。像：

<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
</head>

然後，你可以使用這個：

$('#displayPrevRounds').prepend(toAppend);

需要注意的是，沒有 ''，這是一個變種不CHR。如果你仍要使用DOM方法

，你可以...其實，我發現你通過谷歌的問題：「文檔HTML前置」，

使用DOM方法：

parentNode.insertBefore(newChild, refChild);

How can I implement prepend and append with regular JavaScript?

，並在這裏：

Append and Prepend without JQuery?

來源

2016-09-20 08:44:45 CodeUnsolved

謝謝你經歷了所有這些麻煩，我改變了你和@madalin ivascu的說法，但它仍然沒有顯示我告訴它的那一行。我嘗試了你在評論中包含的兩種方式。有什麼想法嗎？ – Kert

爲您的隨和，您可以嘗試jQuery一路。我在這裏創建一個演示[1wvdnfmo]（https://jsfiddle.net/1wvdnfmo/3/），你可以試試它。你可能會遇到觸發功能的問題displayPlayedRounds – CodeUnsolved

謝謝你的回答。我現在開始工作了。 :) – Kert

prepend是一個jQuery的功能，創建一個jQuery對象

$('#displayPrevRounds').prepend(toAppend);

來源

2016-09-20 08:17:36 madalinivascu

將構造變量預設爲JS中的HTML

回答

相關問題