快速入门:JS对象/BOM/DOM/事件监听

本贴介绍JS相对进阶的知识,对于JavaScript的基础语法,本文不再赘述~

一.JavaScript对象

1.Array数组对象

  • 定义
var arr new Array(1,2,3);
var arr=[1,2,3];
  • 访问
arr[0]=1;

Js数组类似Java中的集合,长度,类型都可以改变。 如果按如下方式书写,仍然不会报错:

var arr =[1,2,3];
arr[10]="Hello";
alert(arr[10]);

(JS中默认不赋值的变量值为undefined~)

push方法和splice方法分别用于给数组添加或者删除元素~

arr.push(5);
//添加数字5
arr.splice(0,1);
//从下标为0开始删,删除一个

2.String字符串对象

字符串与数组同理,不再赘述。需要说明的是,在JavaScript中字符串既可以使用单引号,也可以使用双引号~ (额外说一个trim方法,可以去除掉字符串两端的空白字符,常用于表单验证

3.自定义对象

自定义对象常见于JS的高级框架。

二.BOM

全名为浏览器对象模型:Browser Object Model,是JS将浏览器的各个组成部分封装为对象~

  • Window:浏览器窗口对象
  • Navigator:浏览器对象
  • Screen:屏幕对象
  • History:历史记录对象
  • Location:地址栏对象 

1.Window

如果选择确定,confirm的返回值为true,如果选择否定则为false

setTimeout(function(){
    alert(""hello~)
},3000);

setInterval(function(){
    alert(""hello~)
},3000);

如上,前者是3秒后只执行1次,而后者则是每5秒执行一次~ 

2.History

3.Location

三.DOM

全称document object Model,即文档对象模型,将标记语言的各个部分封装为对象~

  • Document:整个文档对象
  • Element:元素对象
  • Attribute:属性对象
  • Text:文本对象
  • Comment:注释对象

JavaScript通过DOM,可以对Html进行操作~

HTML中的标签被封装为了相对应的对象~ 

1.Element

在使用属性时,查询文档是常见的手段:

JavaScript 和 HTML DOM 参考手册_w3cschool本手册收录了所有内置的JavaScript对象、浏览器对象和HTML DOM对象,参考手册描述了每个JavaScript对象和Browser 对象的属性和方法,并提供了在线实例。是目前最完善的JavaScript参考手册_来自JavaScript 和 HTML DOM 参考手册,w3cschool编程狮。icon-default.png?t=N7T8https://www.w3cschool.cn/jsref/

Style属性用来设置元素的样式,innerHTML用来设置元素内容。这是每一个标签都通用的属性。

四.事件监听 

所谓事件即发生在元素上的事情~

1.事件绑定

2.常见事件

 

五.正则表达式

正则表达式定义了字符串组成的规则,基本上所有语言都支持正则表达式。

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/449083.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Web端功能测试方法最有作用的5个点

对于web测试,较之其他软件测试又有所不同,这是细节的不同,这个不同需要我们在不停的测试中去总结的。 web测试正式测试之前,应先确定如何开展测试,不可盲目的测试,讲究方法才能行之有效的提高我们的效…

Linux——文件缓冲区与模拟实现stdio.h

前言 我们学习了系统层面上的文件操作,也明白了重定向的基本原理,在重定向中,我们使用fflush(stdout)刷新了缓冲区,当时我们仅仅知道重定向需要刷新缓冲区,但是不知道其所以然,今天我们来见识一下。 一、…

框架学了不会用?四小时做完一个完整的前后端分离demo(SpringBoot+Vue)

四小时做完一个完整的前后端分离demo(SpringBootVue) 分享一个看到的还不错的小项目,非常适合刚学完框架但是没有太多动手机会的的学生党用来练手。 优势 手把手写代码,有教学视频免费,有源代码项目周期短 视频教程…

Nvidia显卡@参数规格@驱动下载@cuda版本查看

文章目录 Nvidia显卡产品类型GeForce系列 命名规则前缀和后缀技术特点性能指标/👺显存(VRAM)显存和位宽位宽和现存容量的设计 其他 显卡信息查看Nvidia官网查看其他数据库核心规格GeForce系列产品参数在线查看👺大汇显卡规格总比较其他显卡规格比较 性能…

Facebook、亚马逊账号如何养号?

之前我们讨论过很多关于代理器的问题。它们的工作原理是什么?在不同的软件中要使用那些代理服务器?这些代理服务器之间的区别是什么?什么是反检测浏览器等等。 除了这些问题,相信很多人也会关心在使用不同平台的时代理器的选择问题。比如,为什么最好…

目标检测——布匹缺陷检测数据集

一、简要 布匹瑕疵是指在布料生产过程中或后续处理中出现的各种不符合质量标准或期望的缺陷。这些瑕疵可能源自原料、织造工艺、染色、印花、加工等多个环节。布匹瑕疵的类型繁多,涵盖了结构瑕疵和质量瑕疵两大类。结构瑕疵指的是布料本身的缺陷,包括嵌…

Skia最新版CMake编译

运行示例:example/HelloWorld.cpp Skia: 2024年03月08日 master分支: 993a88a663c817fce23d47394b574e19d9991f2f 使用CMake编译 python tools/git-sync-depsbin/gn gen out/config --idejson --json-ide-script../../gn/gn_to_cmake.py此时output目录会生成CM…

指数幂+力扣

题目 题目链接 . - 力扣(LeetCode) 题目描述 代码实现 class Solution { public:double myPow(double x, int n) {long t n;return t > 0 ? _myPow(x, t) : 1 / _myPow(x, -t);}double _myPow(double x, int n){if(n 0) return 1;double y _…

【解决】Sublime Text找不到Package Control选项,且输入install也不显示Install Package(其中一种情况)

【问题描述】 Sublime Text 找不到 Package Control 选项,且输入 install 也不显示 Install Package 【解决方法】(其中一种情况) 1、工具栏 Preferences -> Settings,点开查看设置文档 2、检查 "ignored_packages&q…

Vue+OpenLayers7入门到实战:OpenLayers地图鼠标点击事件使用,点击地图后弹框并显示当前位置经纬度

返回《Vue+OpenLayers7》专栏目录:Vue+OpenLayers7入门到实战 前言 本章介绍如何使用OpenLayers7在地图上监听点击事件,以及监听地图点击事件后进行简单弹框并获取当前点击位置的经纬度并显示wgs84坐标位置和度分秒格式经纬度信息。 二、依赖和使用 "ol": "…

【开发】JavaWeb开发中如何解析JSON格式数据

目录 前言 JSON 的数据类型 Java 解析 JSON 常用于解析 JSON 的第三方库 Jackson Gson Fastjson 使用 Fastjson Fastjson 的优点 Fastjson 的主要对象 JSON 接口 JSONObject 类 JSONArray 类 前言 1W:什么是JSON? JSON 指 JavaScrip t对象表…

上手OpenMMLab——从零开始通过mmagic上手AIGC

上手OpenMMLab——从零开始通过mmagic上手AIGC 目录 上手OpenMMLab——从零开始通过mmagic上手AIGC**写在前面****MMagic简介与特性****环境搭建与初步探索****文本生成与编辑****图像生成与风格迁移****音频生成与语音合成****高级应用与案例分享** **总结****附录&#xff1a…

sqli-labs练习

2关 找出数据库名字 从数据库security 中找到表明名: 找到数据库名字: 从表users中找到列: 取出表users用户名和密码:用户名~密码 3关 判断出id是(‘id’)的形式 4关 双引号测试报错,推测是(“id“) 5关 填写id=1没有回显信息(布尔盲注一般适用于页面没有回显字…

力扣--动态规划97.交错字符串

思路分析: 动态规划数组定义: dp[i][j] 表示:使用字符串 s1 的前 i 个字符和字符串 s2 的前 j 个字符,能否构成字符串 s3 的前 i j 个字符的交错组合。 初始化: dp[0][0] 初始化为 1,表示空串是 s1 和 s2 …

蓝桥杯练习系统(算法训练)ALGO-980 斐波那契串

资源限制 内存限制:256.0MB C/C时间限制:10.0s Java时间限制:30.0s Python时间限制:50.0s 问题描述 斐波那契串由下列规则生成:   F[0] "0";   F[1] "1";   F[n] F[n-1] F[n-2]…

2024年最新《国际预警期刊》正式更新!

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一、国际期刊预警名单的变化?二、课程案例展示(篇幅有限仅展示部分)1.【热图系列】2.【九象限图系列】3.【富集分析系列】4.【机…

Redis哨兵模式(Sentinel)的搭建与配置

创建三个Redis实例所需的目录,生产环境需独立部署在不同主机上,提高稳定性。 Redis 哨兵模式(Sentinel)是一个自动监控处理 redis 间故障节点转移工作的一个redis服务端实例,它不提供数据存储服务,只进行普通 redis 节点监控管理,使用redis哨兵模式可以实现redis服务端故…

压缩自定义格式压缩包<2>:python使用DEFLATE 算法打包并解压成功,但是解压后的文件格式是固定后缀。

打包 import zlib import osdef compress_folder(input_folder, output_filename):"""使用 DEFLATE 算法压缩文件夹下的所有文件。Parameters:input_folder: str要压缩的文件夹路径。output_filename: str输出压缩文件名。"""# 创建一个空的字节…

数据结构绪论

数据元素;数据项;组合项 数据对象 有相同性质的数据元素就属于同一个数据对象; 而数据结构则要求数据元素之间存在特定的关系! 线性数据结构&网状数据结构 数据结构这门课关注的是数据元素之间的关系,和对这些…

做抖音小店需要交钱吗?有门槛吗?都有哪些入驻条件和费用?

大家好,我是电商花花。 在抖音上开店已经成为很多人追逐的方向,因为这些人都看到别人在抖音上赚到钱,然后也想在抖音上尝试一下。 然而,许多人心中仍然存着一个问题,就是做抖音小店需要交钱吗?是否存在门…