JavaScript的基础使用

简介: JavaScript的基础一、javascript简介JavaScript简称js,最初由网景(现在的Mozilla)公司创建,由于商标冲突原因,其标准版本命名为ECMAScript,但是一般人们还是叫JavaScript,只在谈标准的时候说到ECMAScript这个名字。值得注意的是JavaScript与java没有任何关系,就像雷峰塔(神话中镇压白娘子的塔)和雷锋。此外js(JavaScript)和jsp(java servlet pages)也没有关系。  js的工作分为两部分,一部分属于js语言本身的特性,而另一部需要依靠宿主环境(web浏览器)才能完成。二、javascri

JavaScript的基础




一、javascript简介


JavaScript简称js,最初由网景(现在的Mozilla)公司创建,由于商标冲突原因,其标准版本命名为

ECMAScript,但是一般人们还是叫JavaScript,只在谈标准的时候说到ECMAScript这个名字。值得注意

的是JavaScript与java没有任何关系,就像雷峰塔(神话中镇压白娘子的塔)和雷锋。此外

js(JavaScript)和jsp(java servlet pages)也没有关系。  

js的工作分为两部分,一部分属于js语言本身的特性,而另一部需要依靠宿主环境(web浏览器)才能完

成。


二、javascript的组成部分


JavaScript由ECMAScript,DOM和BOM三部分组成。


图片.png


在这里插入图片描述


1.ECMAScript(核心语法)


JavaScript的核心,描述了语言的基本语法(var、for、if、array等)和数据类型(数字、字符串、布尔、函

数、对象(obj、[]、{}、null)、未定义),ECMAScript是一套 标准,定义了一种语言(比如JS)是什么样

子。

ECMAScript,描述了该语言的语法和基本对象,是JavaScript脚本语言规范,由Javascript引擎具体实

现。


2.DOM(文档对象模型)


W3C组织推荐的处理可扩展置标语言的标准编程接口。DOM是以面向对象方式描述的文档模型。DOM

定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。

可以把DOM认为是页面上数据和结构的一个树形表示,不过页面当然可能并不是以这种树的方式具体实现。


图片.png


在这里插入图片描述


3.BOM(浏览器器对象模型)


BOM是用于描述这种对象与对象之间层次关系的模型,浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。


BOM由多个对象组成,其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象。


图片.png


在这里插入图片描述


三、JavaScript的用法


HTML 中的脚本必须位于 标签之间。


脚本可被放置在 HTML 页面的 和 部分中。


1.外部脚本的使用

<scriptsrc="js文件路径"></script>


2.内部脚本的使用

<script>//js代码</script>

3.行内使用js


<buttononclick="javascript:alert(1)">按钮</button>


写到这里,现在有三种方式使用js,那工作中使用哪一种更好一些?这里说一下,一般工作中推荐使用第一种,外部引用的方式,这样方便管理。因为工作中一个项目要有不止一个js文件。


注意:一般情况下,我们会将引入的js文件添加到html文件的末尾。代码自上而下加载,将js文件引入到文件末尾,有助于获取页面中的元素。


讲解视频链接接:https://www.bilibili.com/video/BV1HT4y1u7eu/

相关文章
|
JavaScript
JS基础之解构赋值
解构赋值 在js中,我们经常会将对象或者数组里面的一部分数据作为参数传递给函数,如果我们使用传统的.方法会很麻烦。
|
移动开发 JavaScript 前端开发
JavaScript基础知识梳理-上
对JavaScript基础知识梳理-上
198 31
JavaScript基础知识梳理-上
|
存储 JavaScript 前端开发
JavaScript基础(一篇入门)
JavaScript基础(一篇入门)
195 0
JavaScript基础(一篇入门)
|
JavaScript 前端开发
2021琴理工作室JS基础教学(三)
当网页被加载的时候,浏览器就会创建文档对象模型,也就是dom 而dom可以看做一颗树
63 3
2021琴理工作室JS基础教学(三)
|
JavaScript 前端开发
JavaScript 入门基础 - 运算符(三)
文章目录 JavaScript 入门基础 - 运算符(三) 1.什么是运算符 2.表达式和返回值 3.算术运算符概述 4. 赋值运算符 5.递增和递减运算符 5.1 递增和递减运算符概述 5.2 递增运算符 5.2.1 前置递增运算符 5.2.2 后置递增运算符 5.2.3 后置和前置运算符的区别 6. 比较运算符 7. 逻辑运算符 7.1 逻辑运算符概述 7.2 逻辑与 7.3 逻辑或 7.4
133 0
JavaScript 入门基础 - 运算符(三)
|
存储 JSON JavaScript
JavaScript 入门基础 - 变量 / 数据类型(二)
JavaScript 入门基础 - 变量 / 数据类型(二)
92 0
JavaScript 入门基础 - 变量 / 数据类型(二)
|
JavaScript 前端开发 物联网
JavaScript 入门基础 / 概念介绍(一)
JavaScript 入门基础 / 概念介绍(一)
119 0
JavaScript 入门基础 / 概念介绍(一)
|
JavaScript 前端开发
vue js文字跑马灯基础版本
提供两种解决思路
265 1
|
JavaScript 前端开发
原生js制作选项卡详解,适合无基础的人学习
原生js制作选项卡详解,适合无基础的人学习
121 0
原生js制作选项卡详解,适合无基础的人学习
|
JavaScript 前端开发
2021琴理工作室JS基础教学(二)
作用域是在运行时代码中的某些特定部分中变量,函数和对象的可访问性。 换句话说,就是空间可见相册和空间不可见相册的作用。
76 4