向html页面中插入JavaScrpt的主要方法,就是使用<script>元素,下面是Html 4.01为<script>定义的6个属性。

1、async:可选表示应该立即下载脚本,但是不妨碍页面中的其他操作,比如下载比如下载其他资源或等待加载其他脚本。这个属性只对外部脚本有效

2、charset:可选。表示脚本通过src属性指定的代码的字符集。大多数浏览器会忽略它的值,所以这个属性也很少用。

3、defer:可选。表示脚本可以延迟到文档完全被解析和显示之后在执行。只对外部脚本有效。代码如下:

aaa.js文件

alert(document.getElementById("div"));

html文件:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="aaa.js"></script>
</head>
<body>
<div id="div"></div>
</body>
</html>

输出:null

现在给外部<script>标签加上defer属性

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="aaa.js" defer="defer"></script> //加上了defer属性
</head>
<body>
<div id="div"></div>
</body>
</html>

输出:[object HTMLDivElement]  这个属性很重要!

4、Lanuage:废弃,表示编写代码使用的脚本语言(如JavaScript,VBScript等)。现在大多数浏览器会忽略这个属性。

5、scr:表示要执行外部代码的外部文件。

6、type:可选。表示编写代码使用的脚本语言的内容类型(也称为MIME类型)。虽然text/javascript和text/ecmascript都已经不被推荐使用,但我们大多数都会用text/javascript。实际上,服务器在传送JavaScript文件时使用的MIME类型通常是application/x-javascript,但在type中设置这个值可能导致脚本被忽略。另外在非IE下可以使用以下值:application/javascript和application/ecmascript。考虑到约定俗成和最大限度的浏览器兼容性,目前type的属性值依然是text/javascript。不过,这个属性不是必须的,如果没有指定这个属性,则其默认值仍为text/javascript。

关于<script></script>元素的使用有下面几点需要注意的

(1)带有src属性的<script>元素不应该在其<script></script>标签之间在出现JavaScript代码,如果出现了,浏览器会下载并执行外部脚本文件,嵌入的代码会被忽略。

(2)<script>元素的src属性还可以包含来自外部域的JavaScript文件。代码如下:

<script src="http://www.tongli.con/test.js" defer="defer"></script>

这样位于外部域中的JavaScript代码也会被加载和解析,用这种方法加载Js文件看似强大,但是要注意安全性。

(3)<script>元素,只要不存在defer和async属性,浏览器都会按照文档流的形式依次对html文件里面的元素进行解析。

JavaScript之<script>标签简介的更多相关文章

  1. Javascript之<script>标签

    把javascript代码插入到HTML页面中需要使用<script>标签,使用这个元素可以使javascript和html标记混合在一个页面中,也可以引入外部的javascript文件. ...

  2. JavaScript高程--<script>标签

    <script>标签 在HTML5中script主要有以下几个属性:async,defer,charset,src,type, async(可选): 关键词:异步脚本,外部文件,立即下载: ...

  3. 【javascript】script标签的async异步解析

    <script src="script.js"></script> 没有 defer 或 async,浏览器会立即加载并执行指定的脚本,“立即”指的是在渲染 ...

  4. 四、JavaScript之<script>标签的使用

    一.代码如下 二.运行效果如下 <!DOCTYPE html> <html> <meta http-equiv="Content-Type" cont ...

  5. JavaScript之<noscript>标签简介

    早期浏览器都面临一个特殊的问题,即当浏览器不支持JavaScript时如何让页面平稳的退化.对这个问题的终极方案就是创造一个<noscript>元素,用以在不支持或支持但禁用了JavaSc ...

  6. 【JavaScript】简介、<Script>标签及基本概念

    一.前言 时光荏苒,岁月匆匆.今年年初进入数据平台部门转型做Web平台.要想搞好前端肯定要学好JavaScript,于是准备抓上一俩本书从基础学起. 二.内容       简介 JavaScript是 ...

  7. javaScript中的小细节-script标签中的预解析

    首先介绍预解析,虽然预解析字面意思很好理解,但是却是出坑出的最多的地方,也是bug经常会有的地方,利用好预解析的特性可以解决很多问题,并且提高代码的质量及数量,浏览器在解析代码前会把变量的声明和函数( ...

  8. javascript动态创建script标签,加载完成后调用回调

    代码如下: var head = document.getElementsByTagName('head')[0]; var script = document.createElement('scri ...

  9. JavaScript(第一天)【<script>标签浅析】

    一.创建一张HTML页面 初学者创建一张html页面建议借助工具,例如Dreamweaver可视化编辑器.   二.<Script>标签解析 <script>xxx</s ...

随机推荐

  1. Hibernate 、继承关联映射

    一个继承树一张表(subclass) 一个继承树一张表是指将一个类和他下面的所有派生类的所有的属性都放在一张表中,举例有Employee这个实体,在他下面分别派生了两个类skill和sell,通过Hi ...

  2. javascript第六课类型转换

    1.parseint(参数): 转换为整数,即使参数中的字符串包含字母数字混合,此方法也会自动一个一个判断和转换   parseInt(参数,进制);将参数通过几进制的方式转为数字 2.parsefl ...

  3. 你必须知道的 34 个简单实用的 Ubuntu 快捷键

      ubuntu常用的快捷键: 1. Ctrl + W: 关闭当前 Nautilus 窗口 2. Ctrl+T: 在 Nautilus 打开新的 Tab 3. Ctrl + H: 切换隐藏文件(夹)显 ...

  4. Android——采用SQLiteDatabase操作SQLite数据库

    除了能够使用文件或SharedPreferences存储数据.还能够选择使用SQLite数据库存储数据. 在Android平台上,集成了一个嵌入式关系型数据库-SQLite,SQLite3支持 NUL ...

  5. 3.C#/.NET编程中的常见异常(持续更新)

    1.Object reference not set to an instance of an object. 未将对象引用(引用)到对象的实例,说白了就是有个对象为null,但是你在用它点出来的各种 ...

  6. wcf系列5天速成——第二天 binding的使用(2)

    承接上一章,今天来讲MSMQ在实战项目中的应用.众所周知,放了防止订单丢失,我们都是采用Order过一下MSMQ. MSMQ的优点个人认为是:先天的异步消息发送和天生的自动负载均衡. 好了,看看MSM ...

  7. table+js实现网站左侧列表下拉隐藏

    <script language="javascript">                    function showHide(obj){            ...

  8. Sublime Text 增加CoffeeScript、Jade and Stylus syntax高亮

    切换到Sublime Text Packages 目录: Liunx系统: cd ~/Library/Application\ Support/Sublime\ Text\ /Packages win ...

  9. Mantis的附件图片实现预览/弹出层动画效果预览图片(LightBox2)的完美解决方案[Z]

    方法1: 在Mantis的配置文件中,加入此句,将这个值设的很大,就可以直接看到图片 1 $g_preview_attachments_inline_max_size=1000000; 效果如图 这个 ...

  10. centos5.5用phpstudy一键安装配置虚拟主机后,yum配置代理服务器squid

    最近因为工作需要,开发站点需要在lamp环境下跑网站,于是在win7上跑虚拟机装了一个centos5.5的linux 并用集成环境配置了一个lamp环境,这里用的是phpstudy的一键安装包,并配置 ...