<script> 标签

在HTML,JavaScript代码必须插入<script></script>之间的.

document.getElementById("demo").innerHTML = "Hello JavaScript";

让我试试

旧的JavaScript实例可能使用类型属性: <script type="text/javascript">.

类型属性不是必须的。在HTML中JavaScript是默认的脚本语言。


JavaScript函数和事件

一个JavaScript函数是一个JavaScript代码块,当"调用"时可以执行。

例如,当事件发生时,可以调用一个函数,如用户单击按钮时。

在以后的章节中你将学到更多关于函数和事件的知识。


JavaScript 在<head><body>里面

可以在HTML文档中放任何数量的脚本.

脚本可以放在<body>里面,或放在一个HTML页面的<head>部分,或者二者都可以。


JavaScript 在<head>里面

在这里实例里面,JavaScript函数放在页面的<head>部分。

单击按钮时调用(called)该函数:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "段落被改变.";
}
</script>
</head> <body> <h1>JavaScript在Head里面</h1> <p id="demo">一个段落.</p> <button type="button" onclick="myFunction()">试试</button> </body>
</html>

让我试试


JavaScript 在<body>里面

在这个实例中,JavaScript函数放在页面的<body>部分

单击按钮时调用(called)该函数:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body> <h1>JavaScript 在Body里面</h1> <p id="demo">一个段落.</p> <button type="button" onclick="myFunction()">试试</button> <script>
function myFunction() {
document.getElementById("demo").innerHTML = "段落被改变.";
}
</script> </body>
</html>

让我试试


将脚本放置在<body>元素的底部会提高显示速度,因为脚本编译会减慢显示速度。


外部 JavaScript

脚本也可以放在外部文件中:

function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}

当许多不同的网页使用相同的代码时,外部脚本是实用的.

JavaScript文件的文件扩展名是 .js.

使用外部脚本,在<script>标签的src属性中指定:

<!DOCTYPE html>
<html>
<body> <script src="myScript.js"></script> </body>
</html>

让我试试

You can place an external script reference in or as you like.

可以在<head> 或者 <body>中放置外部脚本引用。

脚本将表现得好像它恰好位于<script>标记所在的位置。

外部脚本不能包含<script>标签.


外部JavaScript的优势

在外部文件中放置脚本有一些好处:

  • 它将HTML和代码代码分开
  • 它使HTML和JavaScript更容易阅读和维护
  • 缓存JavaScript,可以加速页面加载JavaScript文件

要将多个脚本文件添加到一个页面中 - 使用多个脚本标签:

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

外部引用

外部脚本可以引用完整的URL或与当前网页相对应的路径。

此示例使用完整的URL链接到脚本:

<script src="http://www.codingdict.com/js/myScript1.js"></script>

让我试试

此示例使用位于当前网站上指定文件夹中的脚本:

<script src="/js/myScript1.js"></script>

让我试试

此示例链接到位于当前页相同文件夹中的脚本:

<script src="myScript1.js"></script>

让我试试

本文转自:http://codingdict.com/article/3133

JavaScript用在哪里的更多相关文章

  1. JavaScript之父Brendan Eich,Clojure 创建者Rich Hickey,Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  2. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  3. Javascript 的执行环境(execution context)和作用域(scope)及垃圾回收

    执行环境有全局执行环境和函数执行环境之分,每次进入一个新执行环境,都会创建一个搜索变量和函数的作用域链.函数的局部环境不仅有权访问函数作用于中的变量,而且可以访问其外部环境,直到全局环境.全局执行环境 ...

  4. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

  5. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  6. 《Web 前端面试指南》1、JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  7. JavaScript权威指南 - 函数

    函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...

  8. JavaScript自定义浏览器滚动条兼容IE、 火狐和chrome

    今天为大家分享一下我自己制作的浏览器滚动条,我们知道用css来自定义滚动条也是挺好的方式,css虽然能够改变chrome浏览器的滚动条样式可以自定义,css也能够改变IE浏览器滚动条的颜色.但是css ...

  9. JavaScript进阶之路(一)初学者的开始

    一:写在前面的问题和话 一个javascript初学者的进阶之路! 背景:3年后端(ASP.NET)工作经验,javascript水平一般般,前端水平一般般.学习资料:犀牛书. 如有误导,或者错误的地 ...

  10. 梅须逊雪三分白,雪却输梅一段香——CSS动画与JavaScript动画

    CSS动画并不是绝对比JavaScript动画性能更优越,开源动画库Velocity.js等就展现了强劲的性能. 一.两者的主要区别 先开门见山的说说两者之间的区别. 1)CSS动画: 基于CSS的动 ...

随机推荐

  1. python爬虫常用数据整理函数

    text()                       获取xpath中的值....../h1/text() extract()[0]              Selector的方法用于提取内容为 ...

  2. SQLServer中的top、MySql中的limit、Oracle中的rownum

    (1)在SQL Server中,我们使用 select top N * from tablename来查询tablename表中前N条记录. (2)在MySQL中,我们使用select * from ...

  3. c#处理bin文件

    1. fs.Position  写入的位置,从哪个位置开始写 fs.Write(byte1,0,byte1.Length); byte1写入的byte[], 写入内容从第几位开始取,length取多长 ...

  4. ubuntu环境下重启mysql服务报错“No directory, logging in with HOME=-”

    前提:使用系统的环境 3.13.0-24-generic mysql的版本:5.6.33 错误描述: 首先用mysqld_safe启动报错如下: root@zabbix-forFunction:~# ...

  5. 《好久不见》(Cover 陈奕迅)箫声远 洞箫

    Your browser does not support the audio element.

  6. Java 实现Excel的简单读取操作

    JAVA实现Excel表单的简单读取操作 实现Excel表单的简单读取操作,首先要导入相关的jar包: 如图所示: 此处贴上代码: public static List<List<Stri ...

  7. docker搭建一个渗透测试环境 bwapp为例

    bwapp是一个渗透测试靶场,他其中中含有100多个Web漏洞  基本涵盖了所有主要的已知Web漏洞,包括OWASP Top 10的各种 首先要去搜索一下  看一下有哪些镜像可以下载    docke ...

  8. [Python3] 015 冰冻集合的内置方法

    目录 0. 前言 英文名 元素要求 使用限制 返回 方法数量 1. 如何查看 frozenset() 的内置方法 2. 少废话,上例子 2.1 copy() 2.2 difference() 2.3 ...

  9. SQL的“增删改”

    结构语言分类 DDL(数据定义语言)  create  drop  alter   创建删除以及修改数据库,表,存储过程,触发器,索引.... DML(数据操作语言)   insert  delete ...

  10. [BZOJ2716] [Violet 3]天使玩偶(CDQ分治)

    [BZOJ2716] [Violet 3]天使玩偶(CDQ分治) 题面 Ayu 在七年前曾经收到过一个天使玩偶,当时她把它当作时间囊埋在了地下.而七年后 的今天,Ayu 却忘了她把天使玩偶埋在了哪里, ...