热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

vba执行网页javascript_JavaScript快速入门

一、JavaScript简介网页、网站和应用程序•网页:单独的一个页面。•网站:一系列相关的页面组合到一起。•应用程序:可以和用户产生交互
5d5d739a5f86e07c9a23686d4993dd5f.png

一、Javascript简介

网页、网站和应用程序

• 网页:单独的一个页面。
• 网站:一系列相关的页面组合到一起。
• 应用程序:可以和用户产生交互,并实现某种功能。

1.1 Javascript用途

前端三层
• HTML 结构层 从语义的角度描述页面结构
• css 样式层 从美观的角度描述页面样式
• Javascript 行为层 从交互的角度描述页面行为Javascript 的应用场景Javascript 发展到现在几乎无所不能,常见的应用场景有:• 1. 网页特效• 2. 服务端开发(Node.js)• 3. 命令行工具(Node.js)• 4. 桌面程序(Electron)• 5. App(Cordova)• 6. 控制硬件-物联网(Ruff)• 7. 游戏开发(cocos2d-js)• ……Javascript 是什么
• Javascript 是一种运行在客户端 的脚本语言 ,最早是在 HTML(标准通用标记语言下的一个应用)网页上使用,用来给 HTML 网页增加动态功能。
• 浏览器就是一种运行 Javascript 脚本语言的客户端,Javascript 的解释器被称为Javascript引擎,为浏览器的一部分。

1.2 Javascript诞生

Javascript 简史

• 在 WEB 日益发展的同时,网页的大小和复杂性不断增加,受制于网速的限制,为完成简单的表单验证而频繁地与服务器交换数据只会加重用户的负担,当时走在技术革新最前沿的Netscape(网景)公司,决定着手开发一种客户端语言,用来处理这种简单的验证。• 1995 年,就职于Netscape公司的Brendan Eich,开始着手为即将于 1996年2月发布的NetscapeNavigator 2 浏览器开发一种名为 LiveScript 的脚本语言。为了尽快完成 LiveScript 的开发,Netscape 与 Sun 公司建立了一个开发联盟。在 Netscape Navigator 2 正式发布前夕,Netscape 为了搭上媒体热炒 Java 的顺风车,临时把 LiveScript 改名为 Javascript。• 由于 Javascript 1.0 获得的关注度越来越高, 1996 年,微软就在其 Internet Explorer 3 中加入了名为 JScript 的 Javascript 实现,这意味着有了两个不同的Javascript 版本,导致Javascript没有一个标准化的语法和特性。• 1997 年,以 Javascript 1.1 为蓝本的建议被提交给了欧洲计算机制造商协会(ECMA,European Computer Manufacturers Association)。该协会指定 39 号技术委员会(TC39,Technical Committee #39)负责“ 标准化一种通用、跨平台、供应商中立的脚本语言的语法和语义”。TC39 由来自 Netscape、Sun、微软、Borland 及其他关注脚本语言发展的公司的程序员组成,他们经过数月的努力完成了 ECMA-262 标准,定义一种名为 ECMAScript 的新脚本语言。

ECMAScript 发展过程

03f602841e596d3fb839d713ad769838.png

Javascript是跨平台的:Javascript是依赖于浏览器本身的,与操作系统无关。

1.3 Javascript从丑小鸭到金凤凰

2003年:牛皮鲜,页面上漂浮的广告、弹窗广告;所以当时的浏览器就推出一个功能,禁用广告,实际上本质就 是禁用Javascript。页面上的特效,都特别俗,比如鼠标后面跟随的星星,然后工程师对JS的感觉就是不用学习,生搬硬套,大量的“效果宝盒”软件,一套就有各种特效了。没有人琢磨语言特性。2004年:谷歌打开了Ajax这个潘多拉的盒子,从此Javascript被人重视,很多人开始学习JS语言。当时问世了两本JS巨作《犀牛书》、《高级程序设计》。2007年:三层分离,iPhone发布,人们开始重视用户体验。大家发现了,Javascript是web页面中制作交互效果唯一的语言,所以把JS的重视程度,提到了相当高的一个地位。招聘信息里面开始出现独立的“JS工程师”职位了,之前都是后台工程师捎带脚写写JS。2008年:Chrome浏览器发布,V8引擎加快了JS的解析,之前的浏览器解析JS的时候卡顿卡顿的,动画效果是蹦蹦的。在Chrome里,它的引擎叫做V8,运行JS很流畅。2009年:jQuery变得流行,解决了浏览器兼容问题,制作页面效果变得简单,越来越多的初学者愿意学习Javascript。2010年:Canvas画布技术得到众多浏览器支持,可以用Canvas替代Flash了,并且能制作小游戏,比如偷菜、停车小游戏。我们有这个课程,做Flappy Bird、俄罗斯方块、消消乐、接触物理抛物线引擎。2011年:Node.js得到广泛应用,实际上就是把Javascript运行在了服务器上,单线程非阻塞,能够让企业用最小的成本实现后台网站,比如之前4万的服务器都卡,现在用了node之后,4000的机器都很流畅。2012年:HTML5+CSS3的流行,也带火了Javascript。2013年: hybrid app模式开始流行。就是做手机app的时候,老板们发现要雇佣三队人马,ios、安卓、windows phone。花三份工资,并且产品还不好迭代。所以人们发明了用网页技术开发手机App的技术,叫做web app。hybrid app就是混合app,同时结合web技术和原生开发技术。省钱,好迭代。2015年:ECMA6发布,叫做ECMA2015。重量级的改变,把语言的特性颠覆性的一个增强。

1.4 Javascript 的组成

• Javascript 是由 ECMAScript,DOM 和 BOM 三者组成的。

cae47555b4f814b204f064d6ea77bf3e.png

1.4.1 ECMAScript

ECMA 欧洲计算机制造联合会
ECMAScript是ECMA制定的脚本语言的标准, 规定了一种脚本语言实现应该包含的基本内容
Javascript是脚本语言,所以必须遵守ECMAScript标准,包含ECMAScript标准中规定的基本内容

1.4.2 BOM

浏览器对象模型
通过BOM可以操作浏览器窗口,比如:弹出框、控制浏览器跳转、获取分辨率等

1.4.3 DOM

文档对象模型
DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作

二、Hello World!

2.1 Javascript书写的位置

578cf4fa26276e0eb61f54c07865468d.png

JavaSript程序,要写在HTML页面中,运行页面的时候,这个页面上的JS也就一起运行了。
也就是说,js的运行必须有宿主环境,最最常见的宿主环境,就是浏览器。JS写在

语法

• 语法1:alert语句作为一个函数,如果要执行,必须在后面紧跟着添加小括号。
• 语法2:alert语句作为一个函数,小括号内部可以传递参数,根据数据类型不同,有不同的语法要求,例如文字内容(字符串)必须写在一对引号内部。
• 语法3:如果需要添加一对引号,要么是单引号,要么是双引号,不能一单一双。
• 语法4:所有的有特殊功能的符号必须是英文字符。
• 语法5:语句后面的分号必要性。
• 语法6:js 对换行、缩进、空格也不敏感。
• 语法7:如果 js 中没有特殊控制结构,代码都是从上往下、从左往右进行加载。

2.3.2 prompt() 语句

• prompt:提示。
• 作用:弹出一个对话框,内部有一个提示语句以及一个输入框,可以在输入框中根据提示任意输入内容。
• prompt 语句也是 js 内置的一个功能,必须加小括号执行,有两个参数可以进行传递,每个参数一般都是字符串类型,必须加引号,两个参数中间用逗号分隔,引号和逗号都必须是英文输入法状态。• prompt("请输入您的年龄","18");

589fde487f52dc1da308a079c169fb4b.png

• 第二个参数位置的值,可以删除并重新输入新的内容,甚至代码中可以不写第二个参数。
• prompt("请输入您的年龄");

f7e5403342b6170edc01d2dc17f37bc7.png

2.3.3 confirm() 语句

在网页中弹出提示框,显示信息,该方法一般与if判断语句结合使用

4e28707573a4949e6828f792b56a1071.png

2.3.4 console 控制台

• 在大部分浏览器中,都有一个控制台,内部可以查看 HTML、css 代码,甚至调试代码错误。
• 浏览器中右键点击审查元素(检查),都可以打开控制台。
• 快捷键: F12.
• 控制台中有一个 console(控制台) 的选项面板,在 js 中有非常重要的作用。

chrome 浏览器的控制台

373b9a442d19590312f3fe85aa14fe3d.png

IE 浏览器的控制台

0d7fa40e0fe3c3fa0b4dd945e47552ed.png

控制台功能

• 作用一:帮助程序员调试程序中出现的 bug。可以提示错误的个数、错误所在的行数、错误类型。

a8f48130ba3d4e847dfd8acf03d91145.png

• 作用二:可以在控制台中直接书写一些语句,进行执行。

bdc3530d21e736859fdc85678efae501.png

• 作用三:js 有一个内置对象 console,内部封装了大量的属性和方法(函数),可以通过给console 对象打点调用方法名()、属性名方式去执行。有一个叫做 log(日志)方法,可以实现参数位置自定义内容在控制台输出。

56e25a20ab7d4a59fc76cfbdfc60f7ce.png

使用注意

1)一行代码结束后请加上 ;

如果不写分号,浏览器会自动添加,但是会消耗一些系统资源,此外,还容易加错分号,所以在开发中
分号尽量写上

2)JS中是严格区分大小写的

comfirm("Hello,Liao!"); // 正确
COMFIRM("Hello,Liao!"); // 错误

3)JS中会忽略多个空格和换行

console.log
( "Hello,Liao!"
);




推荐阅读
  • 本文介绍了一个基本的同步Socket程序,演示了如何实现客户端与服务器之间的简单消息传递。此外,文章还概述了Socket的基本工作流程,并计划在未来探讨同步与异步Socket的区别。 ... [详细]
  • 本文介绍了两个重要的Node.js库——cache-content-type和mime-types,它们在处理HTTP响应头时非常有用。cache-content-type是基于mime-types构建的,并且实现了缓存机制以提高性能。 ... [详细]
  • 使用IntelliJ IDEA高效开发与运行Shell脚本
    本文介绍了如何利用IntelliJ IDEA中的BashSupport插件来增强Shell脚本的开发体验,包括插件的安装、配置以及脚本的运行方法。 ... [详细]
  • 利用Cookie实现用户登录状态的持久化
    本文探讨了如何使用Cookie技术在Web应用中实现用户登录状态的持久化,包括Cookie的基本概念、优势及主要操作方法,并通过一个简单的Java Web项目示例展示了具体实现过程。 ... [详细]
  • 本文详细介绍了跨站脚本攻击(XSS)的基本概念、工作原理,并通过实际案例演示如何构建XSS漏洞的测试环境,以及探讨了XSS攻击的不同形式和防御策略。 ... [详细]
  • Mysqlcheck作为MySQL提供的一个实用工具,主要用于数据库表的维护工作,包括检查、分析、修复及优化等操作。本文将详细介绍如何使用Mysqlcheck工具,并提供一些实践建议。 ... [详细]
  • 本项目使用Java语言开发了一个基于B/S架构的指纹识别系统,该系统能够实现指纹的高效采集与精准识别,适用于多种安全认证场景。 ... [详细]
  • LIN总线技术详解
    LIN(Local Interconnect Network)总线是一种基于UART/SCI(通用异步收发器/串行接口)的低成本串行通信协议,主要用于汽车车身网络中智能传感器和执行器之间的通信。 ... [详细]
  • 本文详细介绍了如何在本地环境中安装配置Frida及其服务器组件,以及如何通过Frida进行基本的应用程序动态分析,包括获取应用版本和加载的类信息。 ... [详细]
  • 在使用KVM虚拟化技术通过NAT模式启动虚拟机时,可能会遇到qemu-ifup-nat脚本执行失败的错误。本文将详细介绍如何诊断和解决这一问题。 ... [详细]
  • 本文介绍了如何使用JavaScript来检测Web页面是通过Safari浏览器的标准模式打开,还是作为独立应用(无地址栏)从iPad的主屏幕启动。 ... [详细]
  • 第1章选择流程控制语句1.1顺序结构的基本使用1.1.1顺序结构概述是程序中最简单最基本的流程控制,没有特定的语法结构,按照代码的先后顺序,依次执行,程序中大多数的代码都是这样执行 ... [详细]
  • 本文详细记录了一位求职者在搜狐进行的两次面试经历,包括面试的具体时间、面试流程、技术问题及个人感受。通过本次面试,作者不仅获得了宝贵的经验,还成功拿到了搜狐的录用通知。 ... [详细]
  • 最新进展:作为最接近官方声明的信息源,本文吸引了大量关注。若需获取最新动态,请访问:lkhill.com/ccie-version-5-update ... [详细]
  • 本文介绍了基于Java的在线办公工作流系统的毕业设计方案,涵盖了MyBatis框架的应用、源代码分析、调试与部署流程、数据库设计以及相关论文撰写指导。 ... [详细]
author-avatar
lanshan1126141
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有