JavaScript学习_创建一个javascript文件,通过外部链接的方式,将文件内容在页面上输出-CSDN博客

本文链接：https://blog.csdn.net/helloworld0415/article/details/125120826

JavaScript学习

JavaScript是Web页面中的一种脚本编程语言，也是一种通用的、跨平台的、基于对象和事件驱动并具有安全性的脚本语言。它并不需要进行编译，而是直接嵌入在HTML页面中，把静态页面转化成支持用户交互并响应响应事件的动态页面

编译型语言

源代码——>编译——>执行——>输出

解释型语言

源代码——>解释器——>输出

JavaScript的起源

JavaScript最初的名字被称为LiveScript,由网景公司开发，后来网景公司与Sun公司进行了合作，在合作后共同完成了LiveScript的开发，之后网景公司正式将LiveScript更名为JavaScript。与此同时，微软在其IE中搭载了JScript,我们称之为微软版本的JavaScript.

JavaScript的主要特点

解释性
基于对象
事件驱动(在页面中执行了某个动作，单机页面会弹出一个对话框)
跨平台(由浏览器执行，与操作系统无关)
安全性

JavaScript的应用

验证用户输入的内容，例如用户注册时需要输入两次密码。
动画效果，使得页面看起来更加生动
窗口应用
文字特效
网上商城中应用的jQuery(一个JavaScript的类库)效果
应用Ajax技术实现搜素提示(在不需要刷新页面情况下实现与数据库的连接)

JavaScript在HTML中的使用

在页面中直接嵌入JavaScript
连接外部JavaScript文件
作为标签的属性值使用

在页面中直接嵌入JavaScript

在HTML文档中可以使用script标记将JavaScript脚本嵌入其中

<html>
    <head>
        <title>JavaScript简介</title>
        <script>
            ....
        </script>
    </head>
    <body>
    </body>
</html>

<html>
   <head>
       <title>JavaScript简介</title>
    </head>
    <body>
       <script>
           ....
        </script>
    </body>
</html>

script标签的4个属性

language(目前已被摒弃)
type(用于指定使用的脚本类型)
src(指定外部脚本文件的路径)
defer(已被摒弃)

type属性语法格式

<script type="text/javascript">//指定使用javascript脚本

<html>
   <head>
       <title>练习</title>
    </head>
    <body>
       <script type="text/javascript"></script>
    </body>
</html>

实例工具，编写第一个JavaScript程序，在Dreamweaver工具中直接嵌入JavaScript代码，在页面中输出"我喜欢学习JavaScript"

    <html>
   <head>
       <title>练习</title>
    </head>
    <body>
       <script type="text/javascript">
        document.write("我喜欢学习JavaScript");
        </script>
    </body>
</html>

连接外部JavaScript文件

语法格式：

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

在HTML文件中调用外部的JavaScript文件，运行时在页面中显示对话框，对话框中输出”我喜欢学习JavaScript“

首先建立一个js文件，在该文件中创建JavaScript代码

alert("我喜欢学习JavaScript")

保存该文件至JavaScript文件名下，并命名为Index.js

    <html>
   <head>
       <title>练习</title>
    </head>
    <body>
       <script type="text/javascript"src="index.js">
        </script>
    </body>
</html>

三个注意

外部JavaScript文件中只能包含JavaScript代码，不能包含HTML和结束标签不能省略

作为标签的属性值使用

在HTML文档中可以在标签，标签中使用JavaScript脚本作为它们的属性值

通过"JavaScript:"调用

<a href="javascript:alert("你好JavaScript")">测试</a>

    <html>
   <head>
       <title>练习</title>
    </head>
    <body>
   <a href="javascript:alert("你好JavaScript")">测试</a>
    </body>
</html>

与事件结合调用

<input typre="button"value="测试"onchick="alert("你好JavaScript")"/>

    <html>
   <head>
       <title>练习</title>
    </head>
    <body>
<input typre="button"value="测试"onchick="alert("你好JavaScript")"/>
    </body>
</html>

JavaScript基本语法

执行顺序
大小写敏感
空格与换行
每行结尾的分号可有可无
注释

执行顺序

JavaScript程序按照在HTML文件中出现的顺序逐行执行

alert("你好JavaScript");//先执行
doucument.write("网页特效");//后执行

    <html>
   <head>
       <title>练习</title>
    </head>
    <body>
<script type="text/javascript">
        alert("你好JavaScript");
    doucument.write("网页特效");   
        </script>
    </body>
</html>