简体   繁体   English

你如何将 javascript 代码插入到 HTML 中

[英]How do you insert javascript code into HTML

I have learned to build a fun piece of javascript on codeacademy and wanted to add it on a html document.我已经学会了在 codeacademy 上构建一个有趣的 javascript,并想将它添加到 html 文档中。 How would I go about doing this or is it even possible?我将如何去做这件事,或者甚至有可能吗?

Here is the site.这是网站。 I tried to use script tags but they do not work.我尝试使用脚本标签,但它们不起作用。 Not sure if I am putting them in the right place.不确定我是否将它们放在正确的位置。

http://www.codecademy.com/courses/animate-your-name/0/2 http://www.codecademy.com/courses/animate-your-name/0/2

Looking at the Codeacademy link, it seems as if there are some dependancies.看Codeacademy的链接,好像有一些依赖。 You need to make sure to include those.你需要确保包括这些。 Your HTML file should look like this.您的 HTML 文件应如下所示。 Note: You should probably combine all of your JS into an external file and link it with <script src="main.js"></script> tags.注意:您可能应该将所有 JS 合并到一个外部文件中,并使用<script src="main.js"></script>标签链接它。 Also, make sure that your script tags come at the end of the page (but before the </body> ), it will make your page faster as your JS won't block the DOM construction.此外,请确保您的脚本标签位于页面的末尾(但在</body> ),这将使您的页面更快,因为您的 JS 不会阻止 DOM 构建。

Update更新

If you included all of the known dependancies and it still doesn't seem to work, Codecademy probably buried some important code somewhere.如果您包含了所有已知的依赖项,但它似乎仍然不起作用,则 Codecademy 可能将一些重要的代码隐藏在某处。 The easiest way to get around this would be to just download the web page itself as an HTML file (option click on the link on mac) and either use that or poke around to make sure you have everything.解决此问题的最简单方法是将网页本身下载为 HTML 文件(选项单击 Mac 上的链接),然后使用该文件或四处查看以确保您拥有所有内容。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<canvas id="myCanvas"></canvas>
<script>
var myName = "Codecademy";

var red = [0, 100, 63];
var orange = [40, 100, 60];
var green = [75, 100, 40];
var blue = [196, 77, 55];
var purple = [280, 50, 60];
var letterColors = [red, orange, green, blue, purple];

drawName(myName, letterColors);

if(10 < 3)
{
    bubbleShape = 'square';
}
else
{
    bubbleShape = 'circle';
}

bounceBubbles();
</script>
<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"></script>
<script type="text/javascript" src="main.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
</body>
</html>

You can add inline JavaScript by using the <script> tag.您可以使用<script>标记添加内联 JavaScript。

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script

EDIT编辑

Sorry I didn't notice that you've already tried the script tags.抱歉,我没有注意到您已经尝试过脚本标签。 Can you post your HTML with the script tags?你能用脚本标签发布你的 HTML 吗?

The best way is to use the <script> tags.最好的方法是使用<script>标签。 So if you want to embed some javascript into html, you can use someone elses (or your own) like this: <script src="www.blah.blah/blah/blah.js"></script> or write the js on your computer like this:因此,如果您想将一些 javascript 嵌入到 html 中,您可以像这样使用其他人(或您自己的): <script src="www.blah.blah/blah/blah.js"></script>或编写 js在你的电脑上是这样的:

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

Another way is to write the JavaScript into the file it's self.另一种方法是将 JavaScript 写入它自己的文件中。 Write Js into HTML like this:像这样将 Js 写入 HTML:

<script>
//Your Js Goes Here
</script>

Hope this is what you needed!希望这是你需要的!

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM