飙血推荐
  • HTML教程
  • MySQL教程
  • JavaScript基础教程
  • php入门教程
  • JavaScript正则表达式运用
  • Excel函数教程
  • AngularJS教程
  • UEditor使用文档
  • ThinkPHP5.0教程

第一个JavaScript程序

时间:2021-11-24  作者:匿名  

你好,世界!

本教程的这一部分是关于核心 JavaScript,即语言本身。

但是我们需要一个工作环境来运行我们的脚本,而且由于本书是在线的,浏览器是一个不错的选择。我们会将特定于浏览器的命令(例如alert)的数量保持在最低限度,这样如果您打算专注于另一个环境(例如 Node.js),就不会在这些命令上花费时间。在本教程的下一部分,我们将重点介绍浏览器中的 JavaScript 。

首先,让我们看看如何将脚本附加到网页上。对于服务器端环境(如 Node.js),您可以使用类似"node my.js".

“脚本”标签

JavaScript 程序几乎可以使用<script>标签插入到 HTML 文档的任何位置。

例如:

<!DOCTYPE HTML>
<html>
<body>
  <script>
    alert( '你好,世界!' );
  </script>
</body>
</html>

该<script>标签包含当浏览器处理标签,其被自动执行JavaScript代码。

现代标记

该<script>标签具有很少采用时下,但仍可以在旧代码中发现了几个属性:

该type属性:<script type=…>

旧的 HTML 标准 HTML4 要求脚本具有type. 通常是type="text/javascript"。它不再需要了。此外,现代 HTML 标准完全改变了该属性的含义。现在,它可以用于 JavaScript 模块。但这是一个高级主题,我们将在教程的另一部分讨论模块。

该language属性:<script language=…>

此属性旨在显示脚本的语言。此属性不再有意义,因为 JavaScript 是默认语言。没有必要使用它。

脚本前后的注释。

在实际编程中,您可能会在<script>标签中使用到到注释,如下所示:

<script type="text/javascript"><!--
    ...
//--></script>

这个技巧在现在的 JavaScript 可以不使用。这些注释对不知道如何处理<script>标签的旧浏览器隐藏了 JavaScript 代码。

外部脚本

如果我们有很多 JavaScript 代码,我们可以把它放到一个单独的文件中。

脚本文件通过以下src属性附加到 HTML :

<script src="/path/to/script.js"></script>

这里,/path/to/script.js是从站点根目录到脚本的绝对路径。还可以提供当前页面的相对路径。例如,src="script.js"就像 一样src="./script.js",表示"script.js"当前文件夹中的一个文件。

我们也可以提供完整的 URL。例如:

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

要附加多个脚本,请使用多个标签:

<script src="/js/script1.js"></script>
<script src="/js/script2.js"></script>
…

请注意:

通常,只将最简单的脚本放入 HTML。更复杂的文件驻留在单独的文件中。

单独文件的好处是浏览器将下载它并将其存储在其缓存中。

引用相同脚本的其他页面将从缓存中获取它而不是下载它,因此该文件实际上只下载一次。

这减少了流量并使页面更快。

如果src设置,脚本内容将被忽略。

单个<script>标签不能同时包含src属性和代码。

这样是无法运行内部程序的:

<script src="file.js">
  alert(1); // the content is ignored, because src is set
</script>

我们必须选择外部<script src="…">或常规<script>代码。

上面的例子可以分成两个脚本来工作:

<script src="file.js"></script>
<script>
  alert(1);
</script>

总结

我们可以使用<script>标签向页面添加 JavaScript 代码。

将type和language属性不是必需的。

外部文件中的脚本可以插入<script src="path/to/script.js"></script>

标签:JavaScriptJS
搜你所爱
JavaScript:目录
湘ICP备14001474号-3  投诉建议:234161800@qq.com   部分内容来源于网络,如有侵权,请联系删除。