如何在HTML中使用javascript?

在HTML中可以使用 <script> 标签来插入javascript代码,使用javascript。下面给大家介绍一下在HTML中使用javascript的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

<script>元素

<script> 标签用于定义客户端脚本,比如 JavaScript。

script元素既可以包含脚本语句,也可以通过 src 属性指向外部脚本文件。

必需的 type 属性规定脚本的 MIME 类型。

JavaScript 的常见应用时图像操作、表单验证以及动态内容更新。

推荐学习:html视频教程(公益免费)

属性值:

  • asyne:表示立即下载脚本,但不妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。只对外部脚本文件有效。

  • charset:表示通过src属性指定的代码的字符集。由于大多数浏览器会忽略它的值,因此这个属性很少使用。

  • defer:表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部文件有效。

  • src:表示包含要执行代码的外部文件。

  • type:表示编写代码使用的脚本语言的内容类型(也称为MIME类型)。目前type属性的值依旧还是text/javascript。如果没有指定这个属性,其默认值依旧是text/javascript。

使用<script>的方法有两种:

  1. 直接在页面里嵌入JavaScript代码

  2. 包含外部JavaScript文件

使用<script>元素嵌入JavaScript代码时,只须为<script>指定type属性。然后,向下面这样把JavaScript代码直接放在元素内部即可。

<script type="text/javascript">
  function sayHi(){
    alert("Hi!");
  }
</script>

使用<script>元素包含外部JavaScript文件时,需要为<script>指定src属性:

<script type="text/javascript" src="first.js"></script>
//外部文件first.js将被加载到当前页面中
//注意注意呀,此时在<script>和</script>之间不再包含额外的JavaScript代码,因为这些额外的代码将会被忽略,不执行!!!
<script type="javascript" src="www.somewhere.com/file.ja"></script>
//也就是说src还可以包含来自外部域的.js文件,而不仅仅是自己编写的。功能更加强大。
//注意注意呀,外部域的.js文件可能不可控,所以要么你是它的所有者、要么他的所有者值得信赖、要么就不要使用!!!

标签的位置

1、传统做法

所有的<script>都放在<head>中,目的是把所有外部文件.css和.js都放在相同的地方。

但是这就会造成在所有JavaScript代码被下载解释完成之前,在<body>里的页面内容将不会呈现。妈呀,万一JavaScript代码很多,那会怎样!!!那会一眼看上去浏览器窗口一片空白,这是什么啊

2、最佳做法

把全部的JavaScript引用放在<body>元素内容的后面

<!DOCTYPE html>
<html>
    <head>
        <title> 位置很重要</title>
    </head>
    <body>
        <!--放置页面内容-->
        <script type="text/javascript" src="first.js"></script>
        <script type="text/javascript" src="second.js"></script>
    </body>
</html>

嵌入代码或外部文件的选择

在html中嵌入JavaScript当然没有问题。但是最好的做法是尽可能使用外部文件来包含JavaScript代码。具有一下优点:

  • 可维护性

    将.js文件放在一个文件夹里面维护起来方便多了,无需触及HTML标记

  • 可缓存

    如果有两个页面都是用同一个.js文件,那么只下载一次,加快页面加载速度

推荐学习:《HTML视频教程》、《JavaScript视频教程》!!

以上就是如何在HTML中使用javascript?的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » HTML5 答疑