JavaWeb之js
admin
2024-04-15 04:43:57
0次

目录

  • W3C 标准
  • JavaScript
    • 输出语句
    • JavaScript 编写位置
    • 定义变量
    • 五种数据类型
    • 算术运算符
    • 赋值运算符
    • 比较运算符
    • 逻辑运算
    • if
    • 循环
    • 命名函数
    • Array
    • BOM
      • window
      • location
      • history
    • DOM
    • 事件
      • 常用事件
    • 正则表达
  • 最后

W3C 标准

W3C 标准:网页主要由三部分组成

HTML:用来制作网页基础内容和基本结构

CSS:用于网页样式美化效果

JavaScript:用来制作数据验证、和用户交互

JavaScript

JavaScript概念

JavaScript 是一门跨平台、面向对象的脚本语言,运行在浏览器端。

JavaScript(简称:JS) 在 1995 年由 Brendan Eich 发明,并于 1997 年成为一部 ECMA 标准。

JavaScript作用

表单数据校验

页面元素标签动态增删改查操作等

输出语句

window.alert() 写入警告框

document.write() 写入HTML 输出

console.log() 写入浏览器控制台

JavaScript 编写位置

1.行内,直接写在标签的属性里面

2.内部,本网页有效(经常使用)
2.1.同一个HTML中可以有多个script标签,每个标签都会执行(从上往下运行)
2.2.可以出现在网页中任何的位置

3.外部,使用script标签引入外部的JS文件

注意:
如果引入了外部JS文件,这个标签中的JS代码是无效的
< script>不能提前结束,不能写成这样: < script src=“js/out.js”/>, 影响后面的JS执行

定义变量

ES5 定义变量

var

ES6 定义变量

let

区别:

ES5 方式语法不严谨,使用范围不受代码块限制,代码块外依然可以使用,造成内存浪费

ES6 新增了 let 关键字来定义变量。它的用法类似于 var,但是所声明的变量,只在 let 关键字所在的代码块内有效,且不允许重复声明

ES6 新增了const关键字,用来声明一个只读的常量。一旦声明,常量的值就不能改变。


五种数据类型

number:小数整数都是number

string:小写的s(字符串)

boolean:布尔类型

undefined:未定义的类型

object:对象类型


算术运算符

跟java大致相同

JavaScript 中除法是可以除得尽,如果除不尽会保留16位小数

赋值运算符

与java一致

比较运算符

===是恒等于

== 比较值,=== 比较值与类型

字符串与数字进行比较的时候会先把字符串转换成数字然后再进行比较。

逻辑运算

字符串与数字进行比较的时候会先把字符串转换成数字然后再进行比较。

逻辑运算符不建议单与&、单或|, 会变成数字。


if


循环


命名函数

function

// 定义一个匿名函数实现加法功能let add = function (a,b){return a+b;}// 调用函数document.write(add(1,2));

Array


BOM

BOM(Browser Object Model):浏览器对象模型。

将浏览器的各个组成部分封装成不同的对象,方便我们进行操作。

BOM常用对象

window 表示浏览器窗口位置
location 表示地址栏对象
history 表示浏览历史记录对象

window

alert 弹出框
prompt 输入框
confirm 确认框
setTimeout 过一段时间调用,只调用一次
setInterval 每隔一段时间调用一次


location

href属性就是浏览器的地址栏。我们可以通过为该属性设置新的 URL,使浏览器读取并显示新的 URL 的内容。


history

表示访问过的历史记录,如果没有历史记录,这个对象中的方法不可用。

forword() 当前页面前进
back() 当前页面后退

页面

DOM

Document Object Model: 文档对象模型(浏览器显示的内容),DOM用来操作网页中各种元素(标签)。

document代表了整个DOM树对象,查找节点都找document去获取。

获取元素方法:

document.getElementById(“”) 通过id获取一个元素

document.getElementsByTagName (“标签名”) 通过标签名获取一组元素

document.getElementsByName(“name”) 通过name属性获取一组元素

document.getElementsByClassName(“类名”) 通过样式类名获取一组元素


事件

概念:

用户可以对网页的元素有各种不同的操作如:单击,双击,鼠标移动等这些操作就称为事件。事件通常与函数配合使用,这样就可以通过发生的事件来驱动JavaScript函数执行。



两种方式设置事件







常用事件

onsubmit 当表单提交时触发该事件

onclick 鼠标单击事件

ondblclick 鼠标双击事件

onblur 元素失去焦点

onfocus 元素获得焦点

正则表达

正则表达式的定义:

let reg = /^\w{6,11}$/;

test方法

用来判断是否符合正则表达式,在JS中正则表达式默认是部分匹配

意思就是只要一部分匹配也会返回true,所以引入

^:表示开始

$:表示结束

最后

如果你对本文有疑问,你可以在文章下方对我留言,敬请指正,对于每个留言我都会认真查看。

相关内容

热门资讯

AI做攻略、“双向奔赴”……国... 本文转自:人民网人民网记者 许维娜今年国庆假期,AI(人工智能)成了不少年轻人的“旅行搭子”。行前做...
合肥的这个“梗”, 翻篇了 社交平台的评论区,曾长期流传一句专属于合肥的黑色幽默。有人问合肥哪里好玩,本地网友半开玩笑地回复:合...
7万+旅游中高层都在的群,今天... 做旅游这行,资源卡位、渠道互通、项目落地——往往就差一个“对的机会”。我们的行业社群已聚集70,00...
一场帐篷音乐节,如何让井研从“... 帐篷音乐节现场封面新闻记者 周洪攀10月的研溪湿地,晚风里裹着柑橘的清甜与民谣的回响。夜幕降临,10...
白鹤翩翩落星愿,上海迪士尼度假... 10月9日,世界候鸟日前夕,上海迪士尼度假区星愿公园的湖风里多了一分白鹤的灵动。三座白鹤雕塑正式揭幕...
成都锦江边赏初秋枫叶飘飘 目前,成都锦江边国华街枫叶树红了。近年来,国华街附近的几条街都栽种了红枫树,是城区较集中看枫叶的点位...
GBTA:商务旅行正在复苏,但... 亚太正在成为全球商务旅行增长的重要引擎。在经历疫情后的快速反弹之后,全球商务旅行正在进入一个新的增长...
从景区焕新到节赛引流 邹城双节... 齐鲁网·闪电新闻10月9日讯 中秋、国庆“双节”假期,邹城市文化和旅游局提前谋划、周密部署,立足自身...
江山如此多娇 且看石楼今朝 金秋十月,黄河岸畔秋意盎然,丰收盛会喜迎国庆。本次石楼国庆文旅活动以“江山如此多娇,且看石楼今朝”为...
海南国庆假期接待游客475.4... 2026年国庆假期,海南接待游客475.40万人次,较2025年增长13.1%,较2024年增长15...