【JavaScript】JavaScript学习笔记（一）JavaScript简介

时间：2022-08-26 16:16:11

参考资料：
1. 菜鸟教程 ☞ JavaScript 教程
2. JavaScript从入门到精通

1 JavaScript概念

  JavaScript是一种基于对象、事件驱动的简单脚本语言，通常只能通过Web浏览器去完成一些操作而不能像普通意义上的程序那样独立运行，利用JavaScript可以在网页上产生动态的显示效果并实现与用户交互等功能。

2 JavaScript特点

  • JavaScript脚本语言的主要特点是：
    • 解释性：不需要编译，直接在浏览器中运行时被解释
    • 基于对象：是一种基于对象的语言
    • 事件驱动：直接对用户或客户端输入做出响应
    • 跨平台：基于浏览器，无关操作系统
    • 安全性：不允许访问本地硬盘，不能将数据存入服务器，不允许对网络文档进行修改和删除

3 JavaScript应用

  • JavaScript常见的应用：
    • 验证用户输入的内容
    • 动画效果
    • 窗口的应用：小广告
    • 文字特效
    • 鼠标悬浮效果
    • 标签页效果
    • 联想输入效果

4 JavaScript使用

  用JavaScript编写的代码必须通过HTML/XHTML文档才能执行。有两种方式可以做到这点。一种方式是将JavaScript代码放到文档<head>标签中的<script>标签之间；另一种更好的方式是把JavaScript代码存为一个扩展名为.js的独立文件，在文档的<head>标签中放一个<script>标签，并把它的src属性指向该文件。

4.1 在页面中直接嵌入JavaScript

  在HTML文档中可以使用<script>…</script>标记将JavaScript脚本嵌入到其中，在HTML文档中可以使用多个<script>标记，每个<script>标记中可以包含多个JavaScript的代码集合，并且各个<script>标记中的JavaScript代码之间可以互相访问，如同将所有代码放在一对<script>…</script>标记之中的效果。

表4-1 <script>标记常用的属性及说明

属性 说明 例子
language 设置所使用的脚本语言及版本 <script language=”JavaScript1.8”>
src 设置一个外部脚本文件的路劲位置 <script src=”01.js”>
type 设置所使用的脚本语言，此属性用以代替language属性 <script type=”text/javascript”>
defer 此属性表示当HTML文档加载完毕后再执行脚本语言，提高页面的加载速度 <script defer> 
<!DOCTYPE HTML>
<html>
    <head>
        ...
        <script> code </script>
    </head>
    <body>
        ...
    </body>
</html>

注意：<script>标记可以放在WEB页面的<head></head>标记中，也可以放在<body></body>标记中

4.2 链接外部JavaScript文件

  在WEB页面中引入JavaScript的另一种方法是采用链接外部JavaScript文件的形式，如果脚本代码比较复杂或是同一段代码可以被多个页面所使用，则可以将这些脚本代码放置在一个单独的文件中(.js文件)，然后在需要使用该代码的WEB页面中链接该JavaScript文件即可，其语法格式如下：

<script type="text/javascript" src="example.js"></script>

注意：
1. 在外部JavaScript文件中，不能将脚本代码用<script>和</script>标记括起来；
2. 在使用src属性引用外部JavaScript文件时，<script></script>标记中不能包含其他JavaScript代码；
3. 在<script>标记中使用src属性引用外部JavaScript文件时，</script>结束标记不能省略。

4.3 作为特定标记的属性值使用

  • 通过“javascript:”调用：在HTML中，可以通过“javascript:”的方式来调用JavaScript的函数或方法，示例代码如下：
<a href="javascript:alert('您单击了这个超链接')">请单击这里</a>
  • 与事件结合使用：与事件结合，调用执行JavaScript的方法或函数，示例代码如下：
<input type="button" value="单击按钮" onclick="alert('您单击了这个按钮')" />

5 JavaScript基本语法

  • 代码顺序执行
  • 大小写敏感
  • 在JavaScript中会忽略程序中的空格、换行和制表符，换行表示语句的结束
  • 每行结尾的分号可有可无，但是建议加上
  • 注释，同java的注释方式
标签：

相关文章