JavaScript 1

一、JavaScript 概述
什么是JavaScript:
JavaScript 简称 JS,是一种专门运行于JS解释器/引擎中的解释型脚本语言
JS发展史:
  1、1992年Nombas公司开发了一款运行在网页中的脚本语言,名称为 CMM(C--),后来更名为 ScriptEase
  2、1995年Netscape(网景)为自己的浏览器Navigator2.0开发了另一款脚本语言-LiveScript,更名为 JavaScript
  3、1996年,Microsoft为自己的IE3.0,发布了JavaScript的克隆版本 JScript
  4、1997年,Netscape找到了ECMA(欧洲计算机制造商协会),将JS提交给了ECMA。从此JS的核心更名为 ECMA Script 简称为 ES;

JS的组成:

(1)核心--ECMA Script :包含了JS的最基本的语法规范;

(2)文档对象模型: Document Object Model -->DOM

  允许JS操作HTML网页上的内容;DOM的规范是由W3C来定制的;

(3)浏览器对象模型Browser Object Model -->BOM:  允许JS操作浏览器;

使用JS:

1,使用元素事件执行JS脚本代码;

  事件:用户在元素上所激发的行为操作;

  onclick 事件:当用户单击元素时,要做的操作;

  语法: <ANY onclick='JS脚本代码'>

练习:
1、创建一个网页
2、创建一个 button 和 一个 div
3、分别为 button 和 div 处理 onclick 事件
点击 button 时:控制台输出 点击了button
点击 div 时:控制台输出 我的第一个js程序

2,嵌入在网页中的<script></script>

语法:<script></script>

特点: 网页加载的时候就开始执行;

document.write() 向网页输出一句话;

注意: 如果通过按钮的单击事件执行document.write()的话,则会刷新网页内容;

3,将JS脚本写在外边JS文件中;

步骤:(1)创建JS文件(xxx.js)并编辑脚本;

(2)在网页中对JS文件进行引入;

<script src='JS文件路径'></script>

练习:
1、使用元素事件的方式,向控制台中输入一句话 "我的第一个JS练习"
2、使用<script></script>方式,向网页中输出一句话"我的第一个JS练习"
3、使用外部JS文件的方式,执行一个操作 window.alert("我的第一个JS练习")

4,JS中的变量和常量;

变量:

声明变量的语法:

声明: var    变量名;

赋值:变量名 = 值;

声明并赋值: var 变量名=值;

注:(1)声明变量时,尽量使用var关键字,如果省略,也可以,但容易出问题;

(2)声明变量但未赋值的话,默认值为 undefined ;

变量命名规范:(1)不能使用JS中的关键字或保留关键字;

(2)由字母,数字,下划线(_)和$组成
var u-name = "";错误
var u_name = "";正确
var $ = 35; 正确
(3)不能以数字开头
(4)尽量不要重复
(5)尽量见名知意
var a;
var b;
var stuName;
var ab;
(6)如无特殊需求的话,尽量使用小驼峰命名法
var age;
var stuAge;

常量:
什么是常量?
  一经声明就不允许修改的数据就是常量
语法:
  const 常量名 = 值;
注意:常量名采用全大写的形式;

作业:
1、创建一个网页,嵌入一个<script></script>
2、声明一个常量PI,值为 3.14
3、声明一个变量r,表示一个圆的半径,随意赋值
4、通过PI和r计算圆的周长,并打印输出
2*π*r
5、通过PI和r计算圆的面积,并打印输出
π * r * r
输出格式(控制台):
半径为..的圆的周长为...
半径为..的圆的面积为...

WEBBASE篇: 第七篇, JavaScript知识1的更多相关文章

  1. python学习之路基础篇(第七篇)

    一.模块 configparser configparser用于处理特定格式的文件,其本质是利用open来对文件进行操作 [section1] # 节点 k1 = v1 # 值 k2:v2 # 值 [ ...

  2. WEBBASE篇: 第十一篇, JavaScript知识6

    JavaScript 知识6 一, String 对象 1,分隔字符串, 函数: split(seperator) 作用: 将字符串,通过seperator 拆分成一个数组: eg: var msg= ...

  3. WEBBASE篇: 第十篇, JavaScript知识5

    JavaScript知识5 <!doctype html> <html lang="en"> <head> <meta charset=& ...

  4. Python开发【第七篇】:面向对象 和 python面向对象进阶篇(下)

    Python开发[第七篇]:面向对象   详见:<Python之路[第五篇]:面向对象及相关> python 面向对象(进阶篇)   上一篇<Python 面向对象(初级篇)> ...

  5. 第七篇 :微信公众平台开发实战Java版之如何获取微信用户基本信息

    在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密后的微信号,每个用户对每个公众号的OpenID是唯一的.对于不同公众号,同一用户的openid不同). 公众号可通过本接口来根据O ...

  6. 第七篇 SQL Server安全跨数据库所有权链接

    本篇文章是SQL Server安全系列的第七篇,详细内容请参考原文. Relational databases are used in an amazing variety of applicatio ...

  7. 【Python之旅】第六篇(七):开发简易主机批量管理工具

    [Python之旅]第六篇(七):开发简易主机批量管理工具 python 软件开发 Paramiko模块 批量主机管理 摘要: 通过前面对Paramiko模块的学习与使用,以及Python中多线程与多 ...

  8. 【译】第七篇 SQL Server安全跨数据库所有权链接

    本篇文章是SQL Server安全系列的第七篇,详细内容请参考原文. Relational databases are used in an amazing variety of applicatio ...

  9. 【HANA系列】【第七篇】SAP HANA XS使用Data Services查询CDS实体【一】

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列][第七篇]SAP HANA XS ...

  10. 前端第三篇---前端基础之JavaScript

    前端第三篇---前端基础之JavaScript 一.JavaScript概述 二.JavaScript的基础 三.词法分析 四.JavaScript的内置对象和方法 五.BOM对象 六.DOM对象 七 ...

随机推荐

  1. Python Redis set集合

    Set操作.Set集合就是不允许重复的列表 (无序集合) sadd(name,values) # name对应的集合中添加元素 scard(name) # 获取name对应的集合中元素个数 sdiff ...

  2. Shell 实践、常用脚本

    (1)计算1-100的和. #!/bin/bash n= ` do n=$[$i+$n] done echo $n (2)输一个数字,然后计算出1到数字的和,要求如果输入数字小于1,则重新输入,知道输 ...

  3. xshell的优化和连接

    远程连接linux ###远程连接工具---xshell/SecureCRT/Putty 商业版(收费) 家庭版(免费) 一.xshell进行优化 1.打开文件属性 2.设置终端类型问linux,输入 ...

  4. vue_elementUI_ tree树形控件 获取选中的父节点ID

    el-tree 的 this.$refs.tree.getCheckedKeys() 只可以获取选中的id 无法获取选中的父节点ID想要获取选中父节点的id;需要如下操作1. 找到工程下的node_m ...

  5. webpack搭建项目时出现的报错“Module build failed (from ./node_modules/css-loader/dist/cjs.js) CssSyntaxError”

    控制台出现的错误如下: webpack.config.js中的配置如下: module.exports={ entry:'./src/main.js', output:{ path:__dirname ...

  6. Struts2 使用Jquery+ajax 文件上传

    话不多说 直接上代码 前台js: var formData = new FormData(); formData.append("file1",$("#file1&quo ...

  7. winform左右滑动

    public static class FormTransform { public static void TransformSize(Form frm, int newWidth, int new ...

  8. Pandas 基础(5) - 处理缺失的数据

    首先, 读入一个 csv 文件: import pandas as pd df = pd.read_csv('/Users/rachel/Sites/pandas/py/pandas/5_handli ...

  9. Java GC机制

    GC机制的基本算法是:分代收集,这个不用赘述.下面阐述每个分代的收集方法. 年轻代: 事实上,在上一节,已经介绍了新生代的主要垃圾回收方法,在新生代中,使用“停止-复制”算法进行清理,将新生代内存分为 ...

  10. 第 8 章 容器网络 - 069 - Calico 的默认连通性

    相同calico 网络之间的连通性 测试一下 bbox1 与 bbox2 的连通性: ping 成功,数据包流向如下图所示. 1)根据 bbox1 的路由表,将数据包从 cal0 发出. 2)数据经过 ...