JavaScript基础

发布于:2024-05-11 ⋅ 阅读:(26) ⋅ 点赞:(0)
Javascript 是一种由 Netscape( 网景 ) LiveScript 发展而来的原型化继承的面向对象的动态类型的区
分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl ,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于网络速度相当换缓慢,只有 28.8kbps ,验证步骤浪费的时间太多。于是Netscape 的浏览器 Navigator 加入了 Javascript ,提供了数据验证的基本功能。JavaScript 的正式名称是 "ECMAScript" 。这个标准由 ECMA 组织发展和维护。 ECMA-262 是正式的 JavaScript标准。这个标准基于 JavaScript (Netscape) JScript (Microsoft) Netscape(Navigator 2.0) 的Brendan Eich 发明了这门语言,从 1996 年开始,已经出现在所有的 Netscape Microsoft 浏览器中。ECMA-262的开发始于 1996 年,在 1997 7 月, ECMA 会员大会采纳了它的首个版本。 JavaScript 的组成包含ECMAScript DOM BOM JS 是一种运行于浏览器端上的小脚本语句 , 可以实现网页如文本内容
, 数据动态变化和动画特效等。

JS 特点:
JS 是运行在浏览器上的 一种脚本语言

1.脚本语言


脚本语言是一种简单的程序,规模小 , 不需要编译 , 运行快 , 是由一些 ASCII 字符构成,可以使用任何一种文本编辑器编写。脚本语言是指在web 浏览器内有解释器解释执行的编程语言,每次运行程序的时候,解释器会把程序代码翻译成可执行的格式。一些程序语言(如C C++ Java 等)都必须经过编译,将源代码编译成二进制的可执行文件之后才能运行,而脚本语言不需要事先编译,只要有一个与其相适应的解释器就可以执行。

2.基于面向对象的语言


面向对象有三大特点(封装,继承,多态)缺一不可。

3.事件驱动

在网页中执行了某种操作的动作,被称为 " 事件 "(Event) ,比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。

4.简单性

变量类型是采用弱类型,并未使用严格的数据类型。
var a,b,c; a=123; b="abc"; a=b;

5.安全性

JavaScript 不能访问本地的硬盘,不能将数据存入到服务器上,不能对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互

6.跨平台性

JavaScript 依赖于浏览器本身,与操作平台无关,只要计算机安装了支持 JavaScript 的浏览器(装有JavaScript解释器), JavaScript 程序就可以正确执行。
缺点:
各种浏览器支持 JavaScript 的程度是不一样的,支持和不完全支持 JavaScript 的浏览器在浏览同一个带有JavaScript 脚本的网页时,效果会有一定的差距,有时甚至会显示不出来。

HTMLCSSJS这之间的关系

HTML CSS JS 都是前端的主要技术 , 三者各有分工 .HTML 可以用于制作网页的主体结构 ,CSS 用于给网页做美化,JS 用于在网页上添加动态效果
基本语法:
<script type="text/javascript">
alert("javaScript 你好,我来了!!");
</script>
核心语法约定
1 、代码区分大小写
javaScript 的关键字小写
内置对象大写字母开头,对象名称通常是小写,方法函数命名规则采用驼峰命名法。
2 、变量、对象和函数的名称
标识符命名规范:只能包含数字、字母、下划线和 $ ,且不能以数字开头,不能使用 javaScript 关键字 与保留字。
3 、分号表示结束符
注意:按语法可以省略,但行业内部要求一般都写上。

一、脚本的引入方式

1 、行内引入
<body>
你好,javaScript ,我们来了!!
<a onclick="javaScript:alert('你点了我!');">行内引入</a>
</body>
注意:当 js 需要用到引号的时候,由于写标签已经用了双引号,所以写成单引号。

2、内嵌

<script type="text/javascript">
alert("内嵌方式");
</script>
其中 html5 默认 type 属性的值为 "text/javascript", 因此可以不写,但是不推荐省略。

3、外部

A 、创建一个扩展名为 js 的文件,并写 js 代码
B 、在目标页面引入该 js 文件
<script type="text/javascript" src="js/main.js">
</script>
src 表示要引入的外部 js 脚本文件的完整路径
小结: script 标签可以在页面中有多段 js 程序, js 代码的引入可以在 head 中,也可以在 body 中。

外部引用优点:
代码复用度高,更易于维护代码
注意事项:
1 、在一个页面上可以同时引入多个 js 文件
2 、每个 js 的文件 的引入都要使用一个独立的 script 标签

二、js注释

方便阅读代码,有利于代码维护及协同开发。
1 、单行注释
注释一行 //开始 ctrl + /
2 、多行注释
/* 注释的内容 */ ctrl + shift + /

三、js输入/输出方式

输出方式
1 、弹出提示框
以弹框的形式在页面中输出要显示的内容
alert(" 里面是我们要显示的内容 ");

2 、在页面中输出信息
A 、输出简单的信息
<script type="text/javascript">
document.write("这是我们要在页面中输出的内容");
</script>
B 、输出格式的内容信息(含 html 标签)
<script type="text/javascript">
document.write("这<h2>是我</h2>们要<br/>在页面中输出的内容");
</script>
注意引号的使用,不要同时使用同一个引号
document 对象指的是 html 文档本身
其中 “.” 操作符可以直接调用该对象的功能或值。

3 、控制台日志信息
console 表示控制台对象,在大多数浏览器中要打开控制台,可以按快捷键 f12 选择 console 选项卡。
1 、控制台普通信息
console.info("我是控制台日志信息");
2 、控制台日志信息
console.log("我是控制台日志信息");
输入方式
1 、确定框
confirm(" 需要提示的信息 !");
会有两个按钮   确定  .  取消
<script type="text/javascript">
var result;
result = confirm("需要提示的信息!");
document.write("操作结果:"+result);
</script>

学完变量我们就会发现,想要知道操作的结果并存起来使用,那么我们可以使用变量接收操作结果。
2 、信息输入对话框
prompt(" 请输入年龄: ") ; 接收用户输入的数据
var result;
result = prompt("请输入年龄:");
document.write("操作结果:"+result);
prompt(" 你确定要删除么? ",18); 接收用户输入的数据,后一个默认值

感谢大家的阅读,如有不对的地方,可以私信我,感谢大家!


网站公告

今日签到

点亮在社区的每一天
去签到