在HTML中没有脚本标签的Javascript工作

Javascript working without script tag in HTML?

本文关键字:标签 Javascript 工作 脚本 HTML      更新时间:2023-09-26

我是第一次学习Javascript,并使用w3resource.com的在线教程来帮助我了解基础知识。

我看到教程中发生了一些我不理解的事情,但我无法知道是教程误导了我还是我遗漏了一些东西。

基本上,这是一个打印日期和时间的小程序。我正在显示的HTML和JS,以便我可以看到它是如何工作的。根据我对JS的了解,HTML需要一个"脚本"标签,这样它就知道要合并JS。但是我没有看到这个标签在教程中被使用。这是否意味着教程误导了我什么是合适的协议,或者有没有办法在没有"脚本"标签的情况下将JS嵌入HTML ?

这是我看到的:

HTML:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JavaScript current day and time</title>
</head>
<body>
</body>
</html>
Javascript:

var today = new Date();
var day = today.getDay();
var daylist = ["Sunday","Monday","Tuesday","Wednesday ","Thursday","Friday","Saturday"];
       console.log("Today is : " + daylist[day] + ".");
        var hour = today.getHours();
        var minute = today.getMinutes();
        var second = today.getSeconds();
        var prepand = (hour >= 12)? " PM ":" AM ";
        hour = (hour >= 12)? hour - 12: hour;
if (hour===0 && prepand===' PM ') 
{    
if (minute===0 && second===0)
{  
hour=12;
prepand=' Noon';
}  
else
{  
hour=12;
prepand=' PM';
}  
}  
if (hour===0 && prepand===' AM ') 
{    
if (minute===0 && second===0)
{  
hour=12;
prepand=' Midnight';
}  
else
{  
hour=12;
prepand=' AM';
}  
}  

console.log("Current Time : "+hour + prepand + " : " + minute + " : " + second);

这是我使用的教程:http://www.w3resource.com/javascript-exercises/javascript-basic-exercise-1.php

如果有人能向我解释这个JS是如何被嵌入在没有标签的HTML中,我会很感激。下周我将亲自测试这个,我将被要求从头开始编写代码,所以我不能承受这样的误解。

这段代码确实有一件奇怪的事情。链接JS和HTML的方法有三种:

  • 使用脚本标签:

    <script> your script </script>

  • 将JS写入另一个文件,并使用:

    链接到HTML

    <script type="text/javascript" src="yourFile.js"></script>

  • 将其与以下事件合并:

    <div onclick='alert('Hello')'>click here</div>

我只是认为在教程中,他们正在使用类似JSBin的东西来链接文件或将JS部分合并到HTML中,例如在http://codepen.io/上。

你完全正确。HTML需要说明什么是脚本,什么是HTML。脚本可以像这样内联在标签中:

<script type="text/javascript">
    var loc = window.location;        
</script>

或者没有类型标签

<script>
    var loc = window.location;        
</script>

请注意,在大多数情况下,您不需要指定语言,因为默认情况下通常是JS。

此外,您可以使用外部文件(同样,类型通常是可选的,但在那里没有害处):

<script type="text/javascript" src="/js/myScript.js"></script>

在你引用的教程中,他们跳过了向你展示在哪里放置js的步骤。这样做通常是因为他们想让您决定是内联使用还是在单独的文件中使用。此外,许多工具,如JS Bin等只是向您展示不同类型的内容(css, JS, html),而没有向您展示它们如何链接在一起。他们还经常跳过任何框架依赖的样式标签和脚本标签,因为他们试图为读者保持简单。

也就是说,如果保持简单会让用户的生活变得更加困难,那么可能是教程和演示环境的设计出了一些问题……

希望这对你有帮助!

他们正在使用JS Bin(它将为您插入脚本元素)来托管演示。