Question

我有一些非常简单的HTML，一张照片和一些文字，但我想在它们之间添加一个javascript元素。此元素是倒数计时器，可以使用外部javascript插入。

我在这里有一个带有HTML，内联css和javascript的codepen：https://codepen.io/thomaskwelker/pen/xjwQPj

<div class="kanye-wrapper">
  <div class="kanye-photo">
    <img src="https://vignette.wikia.nocookie.net/star-clan/images/9/90/Kanye.png">
  </div>
  <div class="kanye-timer">
    <script src="js/kanye.js"></script>
  </div>
  <div class="kanye-link">
    <a href="https://google.com">See why</a>
  </div>
</div>

我已经完成了几个小时的谷歌搜索和尝试。有些人可以告诉我如何在＆＃34; kanye-timer＆＃34;内部获取javascript计时器。 DIV？

Answer 1

而不是$(document.body).append($r.cvs);，请尝试$('.kanye-timer').append($r.cvs);

这告诉JS将计时器附加到div，而不是将它放在文档的末尾

Answer 2

您的初始化代码会创建一个永远不会附加到任何DOM文档的画布对象。 JavaScript代码段不必包含在内。但是你可以在一个容器中放置画布：

System.out.println("Please choose Black or Red....and a number from 1-10: ");
Scanner input = new Scanner(System.in);

boolean flag = true;
while (flag) {
    String line = input.nextLine();
    String[] parts = line.trim().split("[\\s]");

    try {
        int num = Integer.parseInt(parts[1]);

        if (parts[0].equalsIgnoreCase("red")) {
            switch (num) {
                case 1:
                    {
                        flag = false;
                        //...
                    }
                    /*
                     * I'm not going to include all the cases
                     */

                default:
                    throw new NumberFormatException();
            }
        } else if (parts[0].equalsIgnoreCase("black")) {
            switch (num) {
                case 1:
                    {
                        flag = false;
                        //...
                    }
                    /*
                     * I'm not going to include all the cases
                     */

                default:
                    throw new NumberFormatException();
            }
        } else {
            System.out.println("'" + parts[0] + "' is invalid." 
                + "\nPlease re-enter a color");
        }
    } catch (NumberFormatException e) {
        System.out.println("'" + parts[1] + "' is invalid."
            + "\nPlease re-enter a number");
    }

}

现在在你的kanye.js中，写下这样的东西：

<div class="kanye-wrapper">
  <div class="kanye-photo">
    <img src="https://vignette.wikia.nocookie.net/star-clan/images/9/90/Kanye.png">
  </div>
  <div class="kanye-timer" id="timercontainer">

  </div>
  <div class="kanye-link">
    <a href="https://google.com">See why</a>
  </div>
</div>

<script src="js/kanye.js"></script>

当然这不是可移植的代码。一旦使其工作，您可以将容器ID外部化为参数。

我无法将外部JavaScript放在div中

2 个答案: