前端学习-JavaScript基础知识（一）

迈不过友情╰ 2022-12-16 09:23 165阅读 0赞

## 1、为何学习 JavaScript？ ##

JavaScript 是 web 开发者必学的三种语言之一：

①HTML 定义网页的内容

②CSS 规定网页的布局

③JavaScript 对网页行为进行编程

## 2、JavaScript在HTMl中的作用 ##

①JavaScript 能够改变 HTML 内容

②JavaScript 能够改变 HTML 属性

③JavaScript 能够改变 HTML 样式 (CSS)

④JavaScript 能够隐藏 HTML 元素

⑤JavaScript 能够显示 HTML 元素

## 3、JavaScript 标识符： ##

所有 JavaScript 变量必须以唯一的名称的标识，这些唯一的名称称为标识符，标识符可以是短名称（比如 x 和 y），或者更具描述性的名称（age、sum、totalVolume）。

构造变量名称（唯一标识符）的通用规则是：

①名称可包含字母、数字、下划线和美元符号

②名称必须以字母开头

③名称也可以 $ 和 \_ 开头

④名称对大小写敏感（y 和 Y 是不同的变量）

⑤JavaScript 的关键词无法用作变量名称

**JavaScript 标识符对大小写敏感。**

字符串被包围在双引号或单引号中都可以，数值不用引号，如果把数值放在引号中，会被视作文本字符串。

## 3、`<script>` 标签 ##

在 HTML 中，JavaScript 代码必须位于 `<script>` 与 `</script>` 标签之间。

<script>
    document.getElementById("text").innerHTML = "这是我的第一段 JavaScript代码";
    </script>

## 4、JavaScript 支持不同类型的循环： ##

① for - 多次遍历代码块

② for/in - 遍历对象属性

③ while - 当指定条件为 true 时循环一段代码块

④ do/while - 当指定条件为 true 时循环一段代码块

## 5、JavaScript 函数和事件： ##

JavaScript 函数是一种 JavaScript 代码块，它可以在调用时被执行。例如，当发生事件时调用函数，比如当用户点击按钮时。

## 6、`<head>` 或 `<body>` 中的 JavaScript ##

在 HTML 文档中可以放置放置任意数量的脚本，脚本可被放置与 HTML 页面的 `<body>` 或 `<head>` 部分中，或两者都有。

注意：把脚本置于 元素的底部，可改善显示速度，因为脚本编译会拖慢显示。

## 7、外部脚本 ##

脚本可放置在外部文件中：外部脚本很实用，如果相同的脚本被用于许多不同的网页。

注意：JavaScript 文件的文件扩展名是 .js。

如需使用外部脚本，请在 `<script>` 标签的 `src` (source) 属性中设置脚本的名称：

例如：

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

同时可以在 `<head>` 或 `<body>` 中放置外部脚本引用。

该脚本的表现与它被置于 `<script>` 标签中是一样的。

注意：外部脚本不能包含 `<script>` 标签。

## 8、外部 JavaScript 的优势 ##

在外部文件中放置脚本有如下优势：

①分离了 HTML 和代码

②使 HTML 和 JavaScript 更易于阅读和维护

③已缓存的 JavaScript 文件可加速页面加载

注意：如需向一张页面添加多个脚本文件，可以使用多个 script 标签：

例如：

<script src="myScript1.js"></script>
    
    <script src="myScript2.js"></script>

外部引用：可通过完整的 URL 或相对于当前网页的路径引用外部脚本：

例如：

<script src="https://www.xxx.com.cn/js/myScript1.js"></script>

[本文学习参考网址][Link 1]

[Link 1]: https://www.w3school.com.cn/js/js_output.asp

发表评论取消回复

表情：

评论列表（有 0 条评论，165人围观）

还没有评论，来说两句吧...

相关阅读

相关初学 JavaScript–基础知识笔记（一）

最近刚开始学习js，发现知识点很多，在这里做了一些基础知识的笔记，不是很详细，欢迎大家随时补充。在html中使用javascript 使用`<script>`元素有两

墨蓝/ 2023年10月17日 14:43/ 0 赞/ 121 阅读

相关 JavaScript基础知识总结（一）

一、JavaScript简介 1、JavaScript的前世今生和CSS一样，JavaScript在各浏览器下并非完全一致，它所带来的兼容性问题时常困扰着我们，以

r囧r小猫/ 2023年10月06日 18:21/ 0 赞/ 38 阅读

相关前端必须掌握的JavaScript基础知识

> 做为前端三剑客的JavaScript，可以说是重中之重了，是前端开发必不可缺的基础，因为有了JavaScript，才使静态的页面产生了一些动态的效果，你对JavaScrip

悠悠/ 2023年01月23日 08:52/ 0 赞/ 224 阅读

相关前端学习-JavaScript基础知识（一）

1、为何学习 JavaScript？ JavaScript 是 web 开发者必学的三种语言之一： ①HTML 定义网页的内容 ②CSS 规定网页的布局 ③Java

迈不过友情╰/ 2022年12月16日 09:23/ 0 赞/ 166 阅读

相关【前端】JavaScript 纯干货基础知识分享！

JavaScript 基础知识分享最基本的几个用法基本数据类型和引用类型的区别声明变量（let var const区别）数据类型转换的总结

秒速五厘米/ 2022年12月13日 14:23/ 0 赞/ 441 阅读

相关前端知识点总结——JavaScript基础

前端知识点总结——JS基础 1.javascript概述(了解) 1.什么是javascript javascript简称为js，是一种运行于js解释器/

r囧r小猫/ 2022年10月02日 14:43/ 0 赞/ 259 阅读

相关 Web前端面试基础知识（一）

Web前端基础面试题（一） 1、Html5基础 1.1请描述一个网页从打开到最终在浏览器中显示的完整过程？思路分析：总述共多数个步骤（环节）；分述各环节执行的内容；可适

约定不等于承诺〃/ 2022年07月13日 11:59/ 0 赞/ 242 阅读

相关 Javascript基础学习(一）

首先明确一点，javascript和java半毛钱的关系都没有，两个完全是不同的语言．javascript是一个叫Brendan Eich的人设计出来的，这哥们在两周之内设计出

矫情吗；*/ 2022年06月16日 01:17/ 0 赞/ 215 阅读

相关 Javascript基础知识（一）

由于之前学过Java，因此Javascript中和Java相同的特性及用法在此我会略过。一、Javascript输出 ![这里写图片描述][SouthEast]

拼搏现实的明天。/ 2022年06月01日 06:17/ 0 赞/ 345 阅读

相关 JavaScript基础知识总结（一）

JavaScript基础知识总结（一） 1. 异步加载在加载网页时，用户会先看到页面的内容，而如果js要加载的东西过多时，页面并不会显示

秒速五厘米/ 2021年11月14日 13:14/ 0 赞/ 383 阅读