HTML和javascript colab_Javascript_Html

HTML和javascript colab

javascript html

HTML和javascript colab,javascript,html,Javascript,Html,我正在使用LoL（传奇联盟）api制作一个应用程序。目前我的输入有问题。首先，我用JavaScript制作了一个inputbox和submitbutton，并编写了一些代码以便使用 var inputbox = document.createElement("input"); inputbox.type = "input"; document.body.appendChild(inputbox); var button = document.createElement("input") bu

我正在使用LoL（传奇联盟）api制作一个应用程序。
目前我的输入有问题。首先，我用JavaScript制作了一个

inputbox

和

submitbutton

，并编写了一些代码以便使用

var inputbox = document.createElement("input");
inputbox.type = "input";
document.body.appendChild(inputbox);

var button = document.createElement("input")
button.type = "button";
button.value = "Press me!";
document.body.appendChild(button);

之后，我使用此代码使用输入值

button.addEventListener("click", function() {
  LookUpSummonerInformation(inputbox.value);
});

我的问题是如何将其放入index.html而不是js文件中。我不能使用表单，因为它可能是一个单页应用程序

提前谢谢。

我想你在找这样的东西

<html>
  <head> 
    <script>
      document.onload = function(){
        var inputbox = document.createElement("input");
        inputbox.type = "input";
        document.body.appendChild(inputbox);

        var button = document.createElement("input")
        button.type = "button";
        button.value = "Press me!";
        button.addEventListener("click", function() {
            LookUpSummonerInformation(inputbox.value);
        });
        document.body.appendChild(button);
      }
    </script>
  </head>
  <body>
    ...
  </body>
</html>


document.onload=函数（）{
var inputbox=document.createElement（“输入”）；
inputbox.type=“输入”；
document.body.appendChild（inputbox）；
var按钮=document.createElement（“输入”）
button.type=“button”；
button.value=“按我！”；
addEventListener（“单击”，函数（）{
LookupSummanerInformation（inputbox.value）；
});
document.body.appendChild（按钮）；
}
...

我想你在找这样的东西

<html>
  <head> 
    <script>
      document.onload = function(){
        var inputbox = document.createElement("input");
        inputbox.type = "input";
        document.body.appendChild(inputbox);

        var button = document.createElement("input")
        button.type = "button";
        button.value = "Press me!";
        button.addEventListener("click", function() {
            LookUpSummonerInformation(inputbox.value);
        });
        document.body.appendChild(button);
      }
    </script>
  </head>
  <body>
    ...
  </body>
</html>


document.onload=函数（）{
var inputbox=document.createElement（“输入”）；
inputbox.type=“输入”；
document.body.appendChild（inputbox）；
var按钮=document.createElement（“输入”）
button.type=“button”；
button.value=“按我！”；
addEventListener（“单击”，函数（）{
LookupSummanerInformation（inputbox.value）；
});
document.body.appendChild（按钮）；
}
...


哈哈哈
按我！
函数do_the_thing（）{
var inputbox=document.querySelector（“#lol input”）；
LookupSummanerInformation（inputbox.value）；
}

下面是一个简单的示例，说明如何将JS与HTML混合使用。


哈哈哈
按我！
函数do_the_thing（）{
var inputbox=document.querySelector（“#lol input”）；
LookupSummanerInformation（inputbox.value）；
}

下面是一个简单的示例，说明如何将JS与HTML混合使用。

您可以始终在HTML文档的正文中使用

标记包含JavaScript代码

例如：


//您的JavaScript代码在这里

或者

您还可以使用

标记将javascript链接到索引文件

例如：

您可以在html文档的正文中始终使用

标记包含JavaScript代码

例如：


//您的JavaScript代码在这里

或者

您还可以使用

标记将javascript链接到索引文件

例如：

将代码放在标签之间！为什么不直接编写html呢？您可以将js代码放在

标记之间，或者

将代码放在标记之间！为什么不直接编写html呢？您可以将js代码放在

标记或

之间。这似乎是个好主意，但是如果脚本标记已被使用，我如何才能包含我的脚本文件（lol.js）？编辑：测试了这一点，我仍然可以包含该文件。这似乎是个好主意，但是我如何包含我的脚本文件（lol.js）如果脚本标签已经被使用了？编辑：测试了这个，我仍然可以包含这个文件。

<html>
  <head>
    <!-- Head code here -->
  </head>
  <body>
    <script>
      // Your JavaScript code goes here
    </script>
    <!-- Remaining body code here -->
  </body>
<html>

<html>
  <head>
    <!-- Head code here -->
  </head>
  <body>
    <script src="path_to_your_js_file"></script>
    <!-- Remaining body code here -->
  </body>
<html>