热门标签 | 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!"
);




推荐阅读
  • 本文深入探讨了 Prototype.js 框架及其与 JavaScript 原生 toString() 方法之间的区别,适合对前端开发感兴趣的开发者阅读。文章将帮助读者理解两者在功能实现和应用场景上的不同,从而更好地利用这些工具进行高效编程。 ... [详细]
  • 本文探讨了Web开发与游戏开发之间的主要区别,旨在帮助开发者更好地理解两种开发领域的特性和需求。文章基于作者的实际经验和网络资料整理而成。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 深入理解Java中的volatile、内存屏障与CPU指令
    本文详细探讨了Java中volatile关键字的作用机制,以及其与内存屏障和CPU指令之间的关系。通过具体示例和专业解析,帮助读者更好地理解多线程编程中的同步问题。 ... [详细]
  • 本文介绍了如何使用JQuery实现省市二级联动和表单验证。首先,通过change事件监听用户选择的省份,并动态加载对应的城市列表。其次,详细讲解了使用Validation插件进行表单验证的方法,包括内置规则、自定义规则及实时验证功能。 ... [详细]
  • 本文探讨了如何在Node.js环境中,通过Tor网络使用的SOCKS5代理执行HTTP请求。文中不仅提供了基础的实现方法,还介绍了几种常用的库和工具,帮助开发者解决遇到的问题。 ... [详细]
  • Python 异步编程:深入理解 asyncio 库(上)
    本文介绍了 Python 3.4 版本引入的标准库 asyncio,该库为异步 IO 提供了强大的支持。我们将探讨为什么需要 asyncio,以及它如何简化并发编程的复杂性,并详细介绍其核心概念和使用方法。 ... [详细]
  • 本文详细介绍如何使用Python进行配置文件的读写操作,涵盖常见的配置文件格式(如INI、JSON、TOML和YAML),并提供具体的代码示例。 ... [详细]
  • CentOS7源码编译安装MySQL5.6
    2019独角兽企业重金招聘Python工程师标准一、先在cmake官网下个最新的cmake源码包cmake官网:https:www.cmake.org如此时最新 ... [详细]
  • 本文详细介绍了 Node.js 中 Worker.isMainThread 属性的功能、用法及其实例代码,帮助开发者更好地理解和利用多线程技术。 ... [详细]
  • 本文介绍了使用PhoneGap打包Android应用时常见的问题及解决方案,包括必要的软件安装和环境配置步骤。 ... [详细]
  • 本文深入探讨了Redis中的两种主要持久化方式——RDB(Redis Database)和AOF(Append Only File),并详细解析了两者的实现机制、优缺点以及在实际应用中的选择策略。 ... [详细]
  • 本文探讨了如何解决在使用CoffeeScript定义类时,实例化后对象为空的问题,并提供了解决方案。 ... [详细]
  • 腾讯视频 Node.js 服务国庆阅兵直播高并发实战
    本文分享了腾讯视频团队在国庆阅兵直播项目中,如何利用Node.js服务成功应对2.38亿次观看的高并发挑战。文章将从服务架构、可用性保障、缓存策略、日志与告警等方面详细解析。 ... [详细]
  • 本文详细介绍了如何在Linux系统中安装和配置Node.js,包括从官方下载、编译安装到运行基本示例的全过程。 ... [详细]
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社区 版权所有