JavaScript概述

最新推荐文章于 2024-08-14 10:08:54 发布

PPPsych

最新推荐文章于 2024-08-14 10:08:54 发布

阅读量99

点赞数

分类专栏： Web前端文章标签： javascript

本文链接：https://blog.csdn.net/qq_39280718/article/details/115867644

版权

Web前端专栏收录该内容

12 篇文章 0 订阅

订阅专栏

文章目录

一、JavaScript概述
二、JavaScript初使用

一、JavaScript概述

1 JavaScript介绍

简称JS，是一种浏览器解释型语言,嵌套在HTML文件中交给浏览器解释执行。主要用来实现网页的动态效果，用户交互及前后端的数据传输等。

JS是弱变量类型的语言，变量只需要var来声明。

2 JavaScript组成

JavaScript基础分为三个部分：

ECMAScript：JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。
DOM：文档对象模型，操作网页上的元素的API。比如让盒子移动、变色、轮播图等。
BOM：浏览器对象模型，操作浏览器部分功能的API。比如让浏览器自动滚动。

3 JavaScript特点

简单易用：可以使用任何文本编辑工具编写，只需要浏览器就可以执行程序。
解释执行（解释语言）：事先不编译、逐行执行、无需进行严格的变量声明。
基于对象：内置大量现成对象，编写少量程序可以完成目标

注：

对换行、缩进、空格不敏感。
所有的符号都是英语的，包括：括号、引号、分号。

二、JavaScript初使用

1 元素绑定事件

事件：指用户的行为（单击，双击等）或元素的状态（输入框的焦点状态等）

事件处理：元素监听某种事件并在事件发生后自动执行事件处理函数。

常用事件：onclick (单击事件)

语法：将事件名称以标签属性的方式绑定到元素上，自定义事件处理。

<!--实现点击按钮在控制台输出-->
<button onclick="console.log('Hello World');">点击</button>

2 文档内嵌

使用标签书写 JS 代码

语法：

<script type="text/javascript">
    alert("网页警告框");
</script>

注意：<script></script>标签可以书写在文档的任意位置，书写多次，一旦加载到script标签就会立即执行内部的JS代码，因此不同的位置会影响代码最终的执行效果。

3 外部链接

创建外部的JS文件 XX.js，在HTML文档中使用引入

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

注意：<script></script>既可以实现内嵌 JS 代码，也可以实现引入外部的 JS 文件，但是只能二选一。

4 JS 输出语句

alert(""); 普通的网页弹框

prompt(""); 接收用户输入的弹框，返回用户输入的内容

console.log(); 控制台输出，多用于代码调试

document.write("<h1>Hello</h1>");实现在动态在网页中写入内容。

注：

在使用事件方式写入时，会重写网页内容
可以识别HTML标签,脚本代码可以在文档任何地方书写，如果是普通写入（不涉及事件），区分代码的书写位置，在当前位置中插入，如果是在head中嵌入，内容会作为body的首行内容显示

示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS</title>
    <script>
        console.log('hello world');
        document.write("Hello");
    </script>
    <!--使用src属性引入外部的js文件-->
    <script src="index.js">
        console.log('哈哈');
    </script>
</head>
<body>
    <!--元素绑定事件
    网页弹框：
    alert('')网页警告框
    -->
    <h1 onclick="document.write('呵呵呵呵');">点击</h1>
    <!--通过script标签书写JS语句-->
    <script>
        //当行注释
        /*多行注释*/
        console.log('控制台输出');
        //带有输入框的弹框
        prompt('请输入姓名')
        //给用户看的       
    </script>
</body>
</html>

PPPsych

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript概述

文章目录一、JavaScript概述1 JavaScript介绍2 JavaScript组成3 JavaScript特点二、JavaScript初使用1 元素绑定事件2 文档内嵌3 外部链接4 JS 输出语句一、JavaScript概述1 JavaScript介绍简称JS，是一种浏览器解释型语言,嵌套在HTML文件中交给浏览器解释执行。主要用来实现网页的动态效果，用户交互及前后端的数据传输等。JS是弱变量类型的语言，变量只需要var来声明。2 JavaScript组成JavaScript基础
复制链接

扫一扫

专栏目录