在HTML中使用JavaScript

来源：互联网发布：java vector迭代器编辑：程序博客网时间：2024/06/07 19:53

1.JavaScript 用法

在HTML中必须将js代码放在<script type="text/javascript"></script>标签中<script type="text/javascript"></script>标签可以放置在 HTML 页面的 <body> 和 <head> 部分中

2.关于script元素的属性

属性         值               含义async       async       规定异步执行脚本,就是立即下载脚本，不妨碍其他的操作（仅适用于外部脚本）。charset     charset     规定在脚本中使用的字符编码，大部分浏览器会忽略，很少使用（仅适用于外部脚本）。defer       defer       规定当页面已完成解析后，执行脚本（仅适用于外部脚本）。src         URL         规定外部脚本的 URL。type        MIME-type   规定脚本的 MIME 类型。

3.使用

    <script type="text/javascript">                function say(){                    alert('hi');                }            </script>

    但是如果你想弹出一个</script>标签的字符串，那么浏览器会误解成JS代码已经结束了。解决的方法，就是把字符串分成两个部分，通过连接符‘+’来连接。

            <script type="text/javascript">                alert('</scr'+'ipt>');            </script>

    2.外部引入js文件        一般来说，JS代码越来越庞大的时候，我们最好把他另存为一个.js文件，通过src引入即可。它还具有维护性高、可缓存(加载一次，无需加载)、方便未来扩展的特点。        <script type="text/javascript" src="script元素.js"></script>        引用外部文件的好处：            1.可维护性，将js放在一个文件中，维护起来会很方便            2.可缓存，浏览器会根据设置缓存链接的所有的外部js文件，也就是说两个页面使用一个js文件，浏览器只用加载一次            3.适应未来。

4.标签的位置

按照常规，我们会把<script>标签存放到<head>...</head>之间。但有时也会放在body之间。如果放在head中，就意味着要等js全部加载完后才会加载页面内容，这也就导致会出现一段时间的空白页面。为了避免这种情况将js放在body中.

5. 延迟脚本

<head>        <meta charset="UTF-8">        <title>Document</title>        <script type="text/javascript" src="a1.js" defer="defer"></script>        <script type="text/javascript" src="a2.js" defer="defer"></script></head>

我们将js的引用放在head中，利用defer属性进行延迟加载，但是有两个js都有defer属性时，顺序是不一定的，也就是说可能先加载a2.js，并且defer属性只用于引用外部的js。所以还是放在body中比较好。

6.异步脚本

<head>        <meta charset="UTF-8">        <title>Document</title>        <script type="text/javascript" src="a1.js" defer="defer"></script>        <script type="text/javascript" src="a2.js" defer="defer"></script>    </head>

异步加载，是适用于外部引用文件，因为是异步的，所以a2.js是很有可能会在a1.js，所以js之间是不能有依赖的关系的。其实异步的目的是让页面的其他的内容不用等待这两个js的加载完成。

7.标签

使用的情况：    1.浏览器不支持js脚本    2.浏览器支持，但是脚本被禁用<nosciprt>可以平稳退化不支持JavaScript处理：例如：    <body>        <noscript>            抱歉该浏览器不支持js        </noscript>    </body>

阅读全文

0 0