将构造变量预设为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

回答

相关问题