HTML - JavaScript

脚本是一小段程序,可以为您的网站添加交互性.例如,脚本可以生成弹出警报框消息,或提供下拉菜单.这个脚本可以使用JavaScript或VBScript编写.

您可以使用任何脚本语言编写各种小函数,称为事件处理程序,然后您可以使用HTML属性触发这些函数.

现在,只有 JavaScript 和大多数Web开发人员正在使用相关框架,VBScript甚至不受各种主流浏览器的支持.

您可以将JavaScript代码保存在单独的文件中,然后将其包含在任何需要的位置,或者您可以在HTML文档本身内定义功能.让我们通过合适的例子逐一查看这两种情况.

外部JavaScript

如果要定义将在各种中使用的功能然后,最好将该功能保存在单独的JavaScript文件中,然后将该文件包含在HTML文档中. JavaScript文件的扩展名为 .js ,它将使用< script>包含在HTML文件中标记.

示例

考虑我们在 script.js 中使用JavaScript定义一个小函数,其中包含以下代码 :

function Hello() {
   alert("Hello, World");
}

现在让我们在下面的HTML文档中使用上面的外部JavaScript文件 :

<!DOCTYPE html>
<html>

   <head>
      <title>Javascript External Script</title>
      <script src = "/html/script.js" type = "text/javascript"/></script>
   </head>

   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
   </body>

</html>

这将产生以下结果,您可以尝试点击给定的按钮 :

Internal Script

您可以将脚本代码直接写入HTML文档。 通常,我们使用<script>标记将脚本代码保留在文档的标题中,否则没有限制,您可以将源代码放在文档中的任何位置,但可以放置在<script>标记内。

Example

<!DOCTYPE html>
<html>

   <head>
      <title>JavaScript Internal Script</title>
      <base href = "https://www.IT屋.com/" />
      
      <script type = "text/JavaScript">
         function Hello() {
            alert("Hello, World");
         }
      </script>
   </head>

   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "Click Me" />
   </body>

</html>

Event Handlers

事件处理程序不过是简单定义的函数,可以针对任何鼠标或键盘事件调用它们。 您可以在事件处理程序中定义业务逻辑,该逻辑可以从单个行代码到数千行代码不等。


以下示例说明了如何编写事件处理程序。 让我们在文档的标题中编写一个简单的函数EventHandler()。 当任何用户将鼠标移到段落上时,我们将调用此函数。

<!DOCTYPE html>
<html>

   <head>
      <title>Event Handlers Example</title>
      <base href = "https://www.IT屋.com/" />
      
      <script type = "text/JavaScript">
         function EventHandler() {
            alert("I'm event handler!!");
         }
      </script>
   </head>

   <body>
      <p onmouseover = "EventHandler();">Bring your mouse here to see an alert</p>
   </body>

</html>

隐藏旧版浏览器的脚本

虽然现在大多数(如果不是全部)浏览器都支持JavaScript,但仍然一些旧的浏览器没有.如果浏览器不支持JavaScript,则会向用户显示代码,而不是运行脚本.为了防止这种情况,你可以简单地在脚本周围放置HTML注释,如下所示.

JavaScript Example:<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>VBScript Example:<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

< noscript>元素

您还可以向浏览器不支持脚本的用户以及已禁用脚本选项的用户提供替代信息.您可以使用< noscript> 标记执行此操作.

JavaScript Example:<script type = "text/JavaScript">
   <!--
      document.write("Hello JavaScript!");
   //-->
</script>

<noscript>Your browser does not support JavaScript!</noscript>VBScript Example:<script type = "text/vbscript">
   <!--
      document.write("Hello VBScript!")
   '-->
</script>

<noscript>Your browser does not support VBScript!</noscript>

默认脚本语言

可能存在包含多个脚本文件并最终使用多个<脚本&GT;标签.您可以为所有脚本标记指定默认脚本语言.这使您无需在每次在页面中使用脚本标记时指定语言.下面是示例 :

<meta http-equiv = "Content-Script-Type" content = "text/JavaScript" />

请注意,您仍然可以通过在脚本标记中指定语言来覆盖默认值.