Превращение построенной переменной в HTML в JS

Я начал изучать веб-разработку для удовольствия пару недель назад, и я создаю игру из каменной бумаги с помощью HTML, CSS и JS. Я пытаюсь добавить что-то в блок HTML, но не могу сделать это с помощью моего текущего кода. После многих поисковых запросов я решил попробовать опубликовать свой вопрос.Превращение построенной переменной в HTML в JS

Я добавил функцию, я пытаюсь добавить строки и место, к которому я пытаюсь их добавить. Как я уже сказал, мой код не работает, и я не совсем понимаю, почему.

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 Ivaşcu говорит, prepend функция JQuery, не происходит из методов DOM.

Если вы хотите использовать jQuery, он делает удобный способ, вам нужно сначала «импортировать/потребовать/включить» jQuery. как:

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

то, вы можете использовать это:

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

отмечают, что, нет '', это переменная не CHR.

, если вы хотите использовать методы DOM в любом случае, вы можете ... на самом деле, я нашел вас вопрос с помощью Google: "документ HTML PREPEND",

использование 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

Превращение построенной переменной в HTML в JS

ответ

Смежные вопросы