“星星发光是为了让每一个人有一天,都能找到属于自己的星星。”

——《小王子》


什么是JS

  • 1.什么是JS
  • (1)JavaScript
  • (2)为什么学习JS:
  • (3)JS能做什么:
  • 2.JS用法
  • (1)JS脚本代码
  • (2)JavaScript 函数和事件:
  • (3)外部的 JavaScript:
  • (4)外部的 JS的引入方式:
  • 3.JS的编辑器
  • 4.运行一个JS
  • 演示代码
  • amiao1.js
  • 演示结果


1.什么是JS

(1)JavaScript

是一门 Web 的编程语言,是脚本语言,可以跨平台使用:可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备

(2)为什么学习JS:

JavaScript 是 web 开发人员必须学习的 3 门语言中的一门:
HTML 定义了网页的内容
CSS 描述了网页的布局和样式
JavaScript 控制了网页的行为

(3)JS能做什么:

可以在HTML中直接输出内容
可以对事件作出反应 (比如点某个地方就会有变化) 可以改变HTML内容
可以改变HTML图像
可以改变HTML样式
可以验证输入内容 (比如要求只能输入数字的,用户输字母就会报错)

2.JS用法

(1)JS脚本代码

必须位于 标签之间;
可被放置在 HTML 页面的 和 部分中。

(2)JavaScript 函数和事件:

通常,我们需要在某个事件发生时执行代码,比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中,就可以在事件发生时调用该函数。

(3)外部的 JavaScript:

也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。在

(4)外部的 JS的引入方式:
<script src="amiao.js"></script>

3.JS的编辑器

VSCode是一款免费开源的现代化轻量级代码编辑器

4.运行一个JS

演示代码
<!DOCTYPE html>
<html><meta charset="UTf-8">
    <head>

        <title>什么是JS</title> 
        
        <!-- head里面的js函数 -->
        <script>
            function test1(){
                document.getElementById("demo").innerHTML="这是一个在head中的js的函数"
            }
        </script>

        <!-- 引入外部的js -->
        <script src="amiao1.js"></script>

    </head>
    <body>
        <p>js可以直接应用在html的输出流</p>

        <script>
            document.write("<h1>什么是JS</h1>")
            document.write("<p>这是p标签里面的内容</p>")
        </script>

        <!-- 头部获取了id为demo -->
        <p id = "demo">测试1</p>

        <!-- 写一个按钮测试头部的test1函数 -->
        <button type = "button" onclick="test1()"> 测试head js 函数 </button>
       
        <!-- 测试头部引入的外部js文件 -->
        <p id = "demo2">测试2</p>
        <button type = "button" onclick="test2()"> 测试外部文件js函数 </button>

    </body>
</html>
amiao1.js
function test2(){
    document.getElementById("demo2").innerHTML="这是一个在外部文件中的js的函数"
}
演示结果

js就是javascript吗 js指的是什么_js就是javascript吗


点按钮,测试1和测试2会显示出不同的话

js就是javascript吗 js指的是什么_javascript_02


js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03

js就是javascript吗 js指的是什么_js就是javascript吗_03