首页 /  技术专区  /  JavaScript 宽屏模式 >

JavaScript介绍

1.1JavaScript 是什么? 

1.JavaScript (是什么? )

        是一种运行在客户端(浏览器)的编程语言,实现人机交互效果。

2.作用(做什么?)

        网页特效(监听用户的一些行为让网页作出对应的反馈)

        表单验证(针对表单数据的合法性进行判断)

        数据交互(获取后台的数据渲染到前端)

        服务端编程(node.js)

Image.png

3.JavaScript的组成(有什么?)

ECMAScript:

    规定了js基础语法核心知识

    比如:变量、分支语句、循环语句、对象等等

Web APIs :

    DOM 操作文档,比如对页面元素进行移动、大小、添加删除等操作

    BOM操作浏览器,比如页面弹窗,检测窗口宽度、存储数据到浏览器等等

Image.png


1.2JavaScript 书写位置 

Image.png


1.内部JavaScript

    直接写在html文件里,用script标签包住

    规范: script标签写在</body>上面

    拓展: alert(你好,js”) 页面弹出警告对话框

    <body>
        <!-- 内部js -->
        <script>
            // 弹框
            alert("hello world!")
        </script>
    </body>


注意事项

我们将<script>放在HTML文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载 HTML。

如果先加载的JavaScript 期望修改其下方的 HTML,那么它可能由于 HTML 尚未被加载而失效。

因此,将JavaScript 代码放在 HTML页面的底部附近通常是最好的策略。

2.外部JavaScript

代码写在以.js结尾的文件里

语法: 通过script标签,引入到html页面中。

    <body>
        <!-- 通过src引入外部的js文件 -->
        <script src="./js/my.js"></script>    
    </body>

注意事项

1.script标签中间无需写代码,否则会被忽略!

2.外部JavaScript会使代码更加有序,更易于复用,且没有了脚本的混合,HTML 也会更加易读,因此这是个好的习惯。

3.内联JavaScript

代码写在标签内部

    <body>
        <!-- 内联javaScript -->
        <button onclick="alert('你点击了按钮!')">点击</button>
    </body>


1.3JavaScript注释

单行注释

    符号: //

    作用: //右边这一行的代码会被忽略

    快捷键: ctrl+ /

    <body>
        <script>
            // 单行注释
        </script>
    </body>

块注释

    符号: /* */

    作用:在/*和*/之间的所有内容都会被忽略

    快捷键: shift + alt + a

    <body>
        <script>
            /*
                块
                注
                释
                大爷,这是什么?
                坤柳。
            */
        </script>
    </body>


1.4JavaScript语句结束符

作用: 使用英文的;代表语句结束

实际情况: 实际开发中,可写可不写,浏览器(JavaScript 引擎)可以自动推断语句的结束位置

现状: 在实际开发中,越来越多的人主张,书写JavaScript 代码时省略结束符

约定:为了风格统一,结束符要么每句都写,要么每句都不写(按照团队要求)

        <script>
            // 写结束符
            var a = 0;
            aleat(a);
            // 不写结束符
            var b = 1
            alert(b)
        </script>


1.5JavaScript输入输出语法

什么是语法:

    人和计算机打交道的规则约定

    我们要按照这个规则去写

    比如:你吃了吗?

    我们程序员需要操控计算机,需要计算机能看懂


输出和输入也可理解为人和计算机的交互,用户通过键盘、鼠标等向计算机输入信息,计算机处理后再展示结果给用户这便是一次输入和输出的过程。

1.输出语法

语法1:

// 向文档中输出内容
document.write("我想要往body中写入一段话!")
document.write("<h1>我是标题</h1>")

           

作用:向body内输出内容

注意:如果输出的内容写的是标签,也会被解析成网页元素


语法2:

// 弹框
alert("弹框输出内容!")

作用:页面弹出警告对话框


语法3:

// 控制台输出
console.log("控制台输出!")

作用:控制台输出语法,程序员调试使用


2.输入语法

语法:

prompt("请输入您的手机号:")

作用:显示一个对话框,对话框中包含一条文字信息,用来提示用户输入文字

展示:

Image.png


3.JavaScript 代码执行顺序:

按HTML文档流顺序执行JavaScript代码

alert()和 prompt()它们会跳过页面染先被执行


1.6字面量

在计算机科学中,字面量 (literal) 是在计算机中描述 事/物

比如:

    1000 就是 数字字面量

    '坤坤下蛋不给你吃'字符串字面量

    []数组字面量

    {}对象字面量

    等等


头像
0/200
图片验证码