JavaScript-Web学习笔记02

三、事件高级

1、注册事件(绑定事件)

注册事件概述

给元素添加事件,称为注册事件或者绑定事件

注册时间有两种方式:传统方式和方法监听注册方式

  1. 传统注册方式
    • 利用 on 开头的事件 onclick
    • <button onclick= "alert('hi~')"></button>
    • btn.onclick = function() {}
    • 特点:注册事件的唯一性
    • 同一个元素同一个时间只能设置一个处理函数,最后注册的处理函数将会覆盖前面注册的处理函数
  2. 方法监听注册方式
    • w3c 标准 推荐方式
    • addEventListener() 它是一个方法
    • IE9 之前的 IE 不支持此方法,可使用 AttachEvent() 代替
    • 特点:同一个元素同一个时间可以注册多个监听器
    • 按注册顺序依次执行
addEventListener 事件监听方式

eventTarget.addEventListener(type, listener[, useCapture])

  • type:事件类型字符串,比如 click、mouseover,注意这里不要带 on
  • listener:事件处理函数,事件发生时,会调用该监听函数
  • useCapture:可选参数,是一个布尔值,默认是false

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><button>传统注册事件</button><button>方法监听注册事件</button><script>var btn = document.querySelectorAll('button');// 1.传统方式btn[0].onclick = function() {alert('hi');}btn[0].onclick = function() {alert('hoe are you');}// 2.事件侦听// 同一个元素,同一个事件可以添加多个侦听器(事件处理程序)btn[1].addEventListener('click', function() {alert('123');})btn[1].addEventListener('click', function() {alert('456');})</script>
</body>
</html>
attachEvent 事件监听方式

eventTarget.attachEvent(eventNameWithOn, callback)

  • eventNameWithOn:事件类型字符串,比如 onclick、onmouseover,这里要带 on
  • callback:事件处理函数,当目标触发事件是回调函数被调用
注册事件兼容性解决方案
function addEventListener(element, eventName, fn) {// 判断当前浏览器是否支持 addEventListen 方法if (element.addEventListener) {element.addEventListener(eventName, fn); // 第三个参数 默认是false} else if (element.attachEvent) {element.attachEvent('on' + eventName. fn);} else {// 相当于 element.onclick = fn;element['on' + eventName] = fn;}
}

2、删除事件(解绑事件)

删除时间的方式
  1. 传统注册方式
    eventTarget.onclick = null;
  2. 方法监听注册方式
    • eventTarget.removeEventListener(type, listener[, useCapture]);
    • eventTarget.detachEvent(eventNameWithOn, callback);
删除事件兼容性解决方案
function removeEventListener(element, eventName, fn) {// 判断当前浏览器是否支持 removeEventListener 方法if(element.removeEventListener) {element.removeEventListener(eventName, fn); // 第三个参数 默认是 false} else if (element.detachEvent) {element.detachEvent('on' + eventName, fn);} else {element['on' + eventName] = null; }
}

3、DOM 事件流

事件流描述的是从页面中接收时间的顺序。

事件发生时会在元素节点之间按照特定的顺序传播,这个传播过程DOM 事件流

DOM 事件流分为3个阶段:

  1. 捕获阶段
  2. 当前阶段
  3. 冒泡阶段

注意:

  1. JS 代码中只能执行捕获或者冒泡其中的一个阶段
  2. onclick 和 attachEvent 只能得到冒泡阶段
  3. addEventListener(type, listener[, useCapture]) 第三个参数如果是 ture,表示再事件捕获阶段调用事件处理程序;如果是 false(不写默认就是false),表示在事件冒泡阶段调用事件处理程序。
  4. 实际开发中很少使用事件捕获,更关注事件冒泡
  5. 有些事件是没有冒泡的,比如 onblur、onfocus、onmouseenter、onmouseleave

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>.father {overflow: hidden;width: 300px;height: 300px;margin: 100px auto;background-color: pink;text-align: center;}.son {width: 200px;height: 200px;margin: 50px;background-color: purple;line-height: 200px;color: #fff;}</style>
</head>
<body><div class="father"><div class="son">son盒子</div></div><script>// 捕获阶段var son = document.querySelector('.son');son.addEventListener('click', function() {alert('son');}, true);var father = document.querySelector('.father');father.addEventListener('click', function() {alert('father');}, true);// 冒泡阶段var son = document.querySelector('.son');son.addEventListener('click', function() {alert('son');}, false);var father = document.querySelector('.father');father.addEventListener('click', function() {alert('father');}, false);document.addEventListener('click', function() {alert('document');})</script>
</body>
</html>

4、事件对象

什么是事件对象
eventTarget.onclick = function() {}
eventTarget.assEventListener('click', function(event) {})

event 对象表示时间的状态,比如键盘按键的状态、鼠标的位置、鼠标按钮的状态等。

事件发生后,跟事件相关的一系列信息数据的集合都放到这个对象里面,这个对象就是事件对象 event

事件对象的兼容性方案

解决:
e = e || window.event;

事件对象的常见属性和方法
事件对象属性方法说明
e.target返回触发事件的对象(标准)
e.srcElement返回触发事件的对象(非标准 ie6~8 使用)
e.type返回事件的类型 比如 click mouseover(不带 on)
e.cancelBubble该属性阻止冒泡(非标准 ie6~8 使用)
e.returnValue该属性 阻止默认事件(默认行为)(非标准 ie6~8 使用)比如不让链接跳转
e.preventDefault()该方法 阻止默认事件(默认行为)(标准)比如不让跳转链接
e.stopPropagation()阻止冒泡(标准)

示例一:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div {width: 100px;height: 100px;background-color: pink;}</style>
</head>
<body><div>123</div><ul><li>abc</li><li>abc</li><li>abc</li></ul><script>// 1. e,target 返回的是触发事件的对象(元素) this 返回的是绑定事件的对象(元素)var div = document.querySelector('div');div.addEventListener('click', function(e) {console.log(e.target);console.log(this);})var ul = document.querySelector('ul');ul.addEventListener('click', function(e) {// 绑定事件对象console.log(this);console.log(e.currentTarget);// 谁触发,返回谁console.log(e.target);})// 了解兼容性// div.onclick = function() {//     e = e || window.event;//     var target = e.target || e.srcElement;//     console.log(target);// }// 跟 this 有个非常相似的属性 currentTarget ie6~8不认识</script>
</body>
</html>

示例二:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><div>123</div><a href="http://www.baidu.com">百度</a><form action="http://www.baidu.com"><input type="submit" value="提交" name="sub"></form><script>// 返回事件类型var div = document.querySelector('div');div.addEventListener('click', fn);div.addEventListener('mouseover', fn);div.addEventListener('mouseout', fn);function fn(e) {console.log(e.type);}// 阻止默认的行为(事件)var a = document.querySelector('a');a.addEventListener('click', function(e) {e.preventDefault(); // dom 标准写法})// 传统的注册方式a.onclick = function(e) {// e.preventDefault();// // 普通// e.returnValue();// return false 也能阻止默认行为 没有兼容性问题return false;}</script>
</body>
</html>

5、阻止事件冒泡

阻止事件冒泡的两种方式
  • 标准写法:利用事件对象里面的 stopPropagation() 方法
    e.stopPropagation()
  • 非标准写法:IE 6~8 利用事件对象 cancaelBubble 属性
阻止事件冒泡的兼容性解决方案
if (e && e.stopPropagation) {e.stopPropagation();
} else {window.event.cancelBubble = true;
}

6、事件委托(代理、委派)

事件委托也称为时间代理,在jQuery里面称为事件委派

事件委托的原理:
不是每个子节点单独设置事件监听器,而是事件监听器设置在其父节点上,然后利用冒泡原理影响设置每个子节点

事件委托的作用:
我们只操作了一次 DOM,提高了程序的性能。

7、常用的鼠标事件

  1. 禁止鼠标右键菜单
    contextmenu主要控制应该何时显示上下文菜单,主要用于程序员取消默认的上下文菜单

    document.addEventListener('contextmenu', function(e) {e.preventDefault();
    })
    
  2. 禁止鼠标选中(selectstart 开始选中)

    document.addEventListener('selectstart', function(e) {e.preventDefault();
    })
    
鼠标事件对象

MouseEvent鼠标事件对象;KeyboardEvent键盘事件对象。

鼠标事件对象说明
e.clientX返回鼠标相对于浏览器窗口可视区的 X 坐标
e.clientY返回鼠标相对于浏览器窗口可视区的 Y 坐标
e.pageX返回鼠标相对于文档页面的 X 坐标(IE9+ 支持)
e.pageY返回鼠标相对于文档页面的 Y 坐标(IE9+ 支持)
e.screenX返回鼠标相对于电脑屏幕的 X 坐标
e.screenY返回鼠标相对于电脑屏幕的 Y 坐标

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>body {height: 3000px;}</style>
</head>
<body><script>// 鼠标事件对象 MouseEventdocument.addEventListener('click', function(e) {// 1.鼠标在可视化窗口的位置console.log(e.clientX);console.log(e.clientY);console.log('----------------');// 2.鼠标在文档的位置console.log(e.pageX);console.log(e.pageY);})</script>
</body>
</html>

8、常用键盘事件

键盘事件触发条件
onkeyup某个键盘按键被松开时触发
onkeydown某个键盘按键被按下时触发
onkeypress某个键盘按键被按下时触发 但是它不识别功能键 比如 ctrl shift 箭头等

注意:
三个事件的执行顺序是:keydwon – keypress – keyup

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>// 1.keyup// document.onkeyup = function() {//     console.log(1);// }document.addEventListener('keyup', function() {console.log(2);})// 2.keydowndocument.addEventListener('keydown', function() {console.log(3);})// 3.keypressdocument.addEventListener('keypress', function() {console.log(4);})// 4. 三个事件的执行顺序:keydown -- keypress -- keyup</script>
</body>
</html>
键盘事件对象
键盘事件对象属性说明
keyCode返回该键的ASCII值

注意:onkeydown 和 onkeyup 不区分字母大小写,onkeypress 区分字母大小写。

四、BOM 浏览器对象模型

1、BOM 概述

什么是 BOM

BOM(Brower Object Model)即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象。其核心对象是 window。

BOM 的构成

window 对象是浏览器的顶级对象,它具有双重角色

  1. 它是 JS 访问浏览器窗口的一个接口。
  2. 它是一个全局对象。定义在全局作用域中的变量、函数都会变成 window 对象的属性和方法

注意:window 下的一个特殊属性 window.name

2、window 对象的常见事件

窗口加载事件
window.onload = function() {};
或者
window.addEventListener('load', function() {});

window.onload 是窗口(页面)加载事件,当文档内容完全加载完成会触发该事件(包括图像、脚本文件、CSS文件等)。

注意:

  1. 有了 window.onload 就可以把 JS、 代码写到页面上方,因为 onload 是等页面内容全部加载完毕,再去执行处理函数。
  2. window.onload 传统注册事件方式只能写一次,如果有多个,会议最后一个 window.onload 为准。
  3. 如果使用 addEventListener 则没有限制·

document.addEventListener('DOMContentLoaded', function() {})

DOMContentLoaded 事件触发时,仅当DOM加载完成,不包括样式表,图片,flash等等。Ie9以上才支持。

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>//     window.onload = function() {//         var btn = document.querySelector('button');//         btn.addEventListener('click', function() {//             alert('click to me');//         })//     }//     window.onload = function() {//         alert(1);//     }window.addEventListener('load', function() {var btn = document.querySelector('button');btn.addEventListener('click', function() {alert('click to me');})})window.addEventListener('load', function() {alert(1);})document.addEventListener('DOMContentLoaded', function() {alert(2);})// load 等页面元素全部加载完毕// DOMContentLoaded 是 DOM 加载完毕直接执行,加载速度比 load 快</script><button>点击</button>
</body>
</html>
调整窗口大小事件
window.onresize = function() {};
window.addEventListener('resize', function() {});

注意:

在开发响应式布局时可用到:window.innerWidth 当前屏幕的宽度

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div {width: 200px;height: 200px;background-color: pink;}</style>
</head>
<body><script>window.addEventListener('load', function() {var div = document.querySelector('div');window.addEventListener('resize', function() {if (window.innerWidth <= 800) {div.style.display = 'none';} else {div.style.display = 'block';}})})</script><div></div>
</body>
</html>

3、定时器

两种定时器
  • setTimeout()
  • setInterval()
setTimeout() 定时器

window..setTimeout(调用函数, [延迟的毫秒数]);

setTimeout() 方法用于设置一个定时器,该定时器在定时器到期后执行调用函数

注意:

  1. window 可以省略
  2. 这个调用函数可以直接写函数,或者写函数名或者采取字符串 ‘函数名()’ 三种方式
  3. 延迟的毫秒数省略默认是0

setTimeout() 这个函数也称为回调函数 callback

停止 setTimeout() 定时器

window.clearTimeout(timeoutID);

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><button>点击停止定时器</button><script>var btn = document.querySelector('button');var timer = setTimeout(function() {console.log(1);}, 5000)btn.addEventListener('click', function() {clearTimeout(timer);})</script>
</body>
</html>
setTnterval() 定时器

window.setInterval(回调函数, [间隔的毫秒数]);

setInterval() 方法重复调用一个函数,每个一段时间,就去调用这个函数

注意:

  1. window 可以省略
  2. 这个调用函数可以直接写函数,或者写函数名或者采取字符串 ‘函数名()’ 三种方式
  3. 延迟的毫秒数省略默认是0

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><script>setInterval(function() {console.log(1);}, 1000)</script>
</body>
</html>
停止 setInterval() 定时器

window.clearInterval(intervalID);

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><button class="begin">开启定时器</button><button class="stop">停止定时器</button><script>var begin = document.querySelector('.begin');var stop = document.querySelector('.stop');var timer = null; // 设置一个空对象begin.addEventListener('click', function() {timer = setInterval(function() {console.log(1);}, 1000)})stop.addEventListener('click', function() {clearInterval(timer);})</script>
</body>
</html>
this
  1. 全局作用域或者普通函数种this指向全局对象window(定时器中的this指向window)
  2. 方法调用中谁调用this指向谁
  3. 构造函数种this指向构造函数的实例

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><button>点击</button><script>// 1.全局作用域或者普通函数种this指向全局对象window(定时器中的this指向window)console.log(this);function fn() {console.log(this);}window.fn();setTimeout(function() {console.log(this);}, 1000)// 2.方法调用中谁调用this指向谁var o = {greet: function() {console.log(this);}}o.greet();var btn = document.querySelector('button');// btn.onclick = function() {//     console.log(this);// }btn.addEventListener('click', function() {console.log(this);})// 3.构造函数种this指向构造函数的实例function Fun() {console.log(this);}var fun = new Fun();</script>
</body>
</html>

4、JS 执行队列

JS 是单线程
同步和异步

同步任务

同步任务都在主线程上执行,形成一个执行栈

异步任务

JS 的异步函数是通过回调函数实现的。

  1. 普通事件,如 click、resize 等
  2. 资源加载,如 load、error 等
  3. 定时器,包括 setTimeout、setInterval 等

异步任务相关回调函数添加到任务队列中(任务队列也称为消息队列)

JS 执行机制
  1. 先执行执行栈中的同步任务
  2. 异步任务(回调函数)放入任务队列中
  3. 一旦执行栈中的所有同步任务执行完毕,系统会按次序读取任务队列中的异步任务,于是被读取的异步任务结束等待状态,进入执行栈,开始执行

由于主线程不断地重复获得任务、执行任务,再获取任务、执行任务,所以这种机制被称为事件循环(even loop)

5、location 对象

什么是 location 对象

window 对象提供的 location 属性用于获取或设置窗体地URL,并且可以用于解析 URL

URL

统一资源定位符 (Uniform Resource Locator, URL) 是互联网上标准资源的地址。

URL 地一般语法格式为:
protocol://host[:port]/path/[?query]#fragment

组成说明
protocol通信协议 常用的http,ftp,maito等
host主机(域名)
port端口号 可选,省略时使用方案的默认端口 如http的默认地址端口为80
path路径 由零个或多个 ‘/’ 符号隔开的字符串,一般用来表示主机上的一个目录或文件地址
query参数 以键值对的形式,通过&符号分隔开来
fragment片段 #后面内容 常见于链接 锚点
location 对象的属性
location对象属性返回值
location.href获取或者设置整个URL
location.host返回主机(域名)
location…port返回端口号(如果未写返回空字符串)
location.pathname返回路径
location.search返回参数
location.hash返回片段(#后面内容 常见于链接、锚点)
location 对象的方法
location对象方法返回值
location,assign()跟 href 一样,可以跳转页面(也称为重定向页面)
location.replace()替换当前页面,因为不记录历史,所以不能后退页面
location.reload()重新加载页面,相当于刷新按钮或者 f5(如果参数为true,则强制刷新:ctrl+f5)

示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><button>点击</button><script>var btn = document.querySelector('button');btn.addEventListener('click', function() {// location.assign('http://www.baidu.com');// location.replace('http://www.baidu.com');location.reload(true);})</script>
</body>
</html>

6、navigator 对象

if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPad|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WenOS|Symbian|Windows Phone)/i))) {windows.location.href = ""; // 手机
} else {windows.location.href = ""; //电脑
}

7、history 对象

history对象方法作用
back()可以后退功能
forward()前进功能
go(参数)前进后退功能(参数如果是 1 则前进一个页面,如果是 -1 则后退一个页面)

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

软考高级架构师:MVP 架构概念和例题

作者&#xff1a;明明如月学长&#xff0c; CSDN 博客专家&#xff0c;大厂高级 Java 工程师&#xff0c;《性能优化方法论》作者、《解锁大厂思维&#xff1a;剖析《阿里巴巴Java开发手册》》、《再学经典&#xff1a;《Effective Java》独家解析》专栏作者。 热门文章推荐&am…

Spring - AOP/事务 实现原理

AOP 基本概念 官方文档&#xff1a; Aspect Oriented Programming with Spring Spring AOP supports the following AspectJ pointcut designators (PCD) for use in pointcut expressions: within - limits matching to join points within certain types (simply the exec…

Visual Studio项目编译和运行依赖第三方库的项目

1.创建项目&#xff0c;这里创建的项目是依赖于.sln的项目&#xff0c;非CMake项目 2.添加第三方库依赖的头文件和库文件路劲 3.添加第三方依赖库文件 4.项目配置有2个&#xff0c;一个是Debug&#xff0c;一个是Release&#xff0c;如果你只配置了Debug&#xff0c;编译和运行…

表的创建,删除,插入,修改

目录 一、表的创建 二、表的删除 三、插入数据insert (DML) 四、函数format str_to_date date_format 五、date和datetime两个类型的区别? 六、数据库修改update&#xff08;DML&#xff09; 七、删除数据delete 一、表的创建 1、建表的语法格式:(建表属…

Unity 视频组件 VideoPlayer

组件添加&#xff1a; 在自己定义的组件下&#xff08;例如&#xff1a;Panel&#xff09; 点击 Inspector 面板中的 AddComponent &#xff0c;输入“VideoPlayer”。 资源 这里 视频资源有两种形式&#xff0c;第一种是 VideoClip &#xff0c;需要将视频文件拖拽到该属性字段…

喜报 | 聚合科技荣获江苏省数字经济学会科学技术奖

近日&#xff0c;江苏省数字经济学会公布了2023年度江苏省数字经济学会科学技术奖获奖名单。本次在全省范围内共评选出科学技术进步奖、科学技术创新奖、优秀成果奖获奖项目共计19项。“聚合数据资产服务API平台”凭借其前沿的创新性和优秀的应用前景成功获得科学技术创新奖二等…

说说Loader和Plugin的区别?编写Loader,Plugin的思路?

文章目录 一、区别二、编写loader三、编写plugin参考文献 一、区别 前面两节我们有提到Loader与Plugin对应的概念&#xff0c;先来回顾下 loader 是文件加载器&#xff0c;能够加载资源文件&#xff0c;并对这些文件进行一些处理&#xff0c;诸如编译、压缩等&#xff0c;最终…

FFmpeg开发笔记(十四)音频重采样的缓存

FFmpeg在很多地方都运用了缓存机制&#xff0c;比如《FFmpeg开发实战&#xff1a;从零基础到短视频上线》一书的“3.3.2 对视频流重新编码”介绍了编解码的数据缓存&#xff0c;不单是视频编码过程和视频解码过程有缓存&#xff0c;甚至连音频重采样都用到了缓存。 也就是说&a…

基于TensorFlow的花卉识别(算能杯)%%%

Anaconda Prompt 激活 TensorFlow CPU版本 conda activate tensorflow_cpu //配合PyCharm环境 直接使用TensorFlow1.数据分析 此次设计的主题为花卉识别&#xff0c;数据为TensorFlow的官方数据集flower_photos&#xff0c;包括5种花卉&#xff08;雏菊、蒲公英、玫瑰、向日葵…

4、Jenkins持续集成-用户权限和凭证管理

文章目录 一、用户权限管理1、安装用户权限管理插件2、开启权限全局安全配置3、创建角色4、创建用户5、给用户分配角色6、创建项目测试权限二、凭证管理1、安装凭证管理插件2、安装Git插件和工具2.1 用户密码类型2.2 SSH密钥类型一、用户权限管理 利用Role-based Authorizatio…

UI自动化_id 元素定位

## 导包selenium from selenium import webdriver import time1、创建浏览器驱动对象 driver webdriver.Chrome() 2、打开测试网站 driver.get("你公司的平台地址") 3、使浏览器窗口最大化 driver.maximize_window() 4、在用户名输入框中输入admin driver.find_ele…

RSTP环路避免实验(思科)

华为设备参考&#xff1a;RSTP环路避免实验&#xff08;华为&#xff09; 一&#xff0c;技术简介 RSTP (Rapid Spanning Tree Protocol) 是从STP发展而来 • RSTP标准版本为IEEE802.1w • RSTP具备STP的所有功能&#xff0c;可以兼容STP运行 • RSTP和STP有所不同 减少了…

MVC框架里的几种对象

Java语言是一门面向对象的编程语言&#xff0c;所有都用类表达&#xff0c;入口都是一个类&#xff0c;没有独立的main&#xff08;&#xff09;函数&#xff0c;类的实例化就是对象。 简单来讲类包括数据和方法&#xff0c;方法就是操作&#xff0c;是实现业务逻辑的地方&…

天秀洛谷专题 - 素数筛

素数筛 Almost Prime Almost Prime #include<bits/stdc.h> using namespace std;const int N 3000; vector<bool> is_prime(N1, true); vector<int> primes;// 线性筛生成所有小于N的质数 void sieve() {is_prime[0] is_prime[1] false; // 0和1不是质…

数据结构作业整理:扩展字符

题目展示&#xff1a; 【问题描述】 从键盘输入包含扩展符-的字符串&#xff0c;将其扩展为等价的完整字符&#xff0c;例如将a-d扩展为abcd&#xff0c;并输出扩展后的字符串。 要求&#xff1a;只处理[a-z]、[A-Z]、[0-9]范围内的字符扩展&#xff0c;即只有当扩展符前后的字…

5、Jenkins持续集成-Maven和Tomcat的安装与配置

文章目录 一、Maven的安装与配置1、安装maven并配置环境2、全局工具配置关联jdk和maven3、添加Jenkins全局变量4、修改settings.xml文件5、测试是否配置成功二、Tomcat的安装与配置1、安装tomcat8+2、配置Tomcat用户角色权限3、测试是否配置成功一、Maven的安装与配置 在Jenki…

安全点安全区的通俗理解

想象一下&#xff0c;JVM&#xff08;Java虚拟机&#xff09;是一个忙碌的工厂&#xff0c;而Java程序中的线程就像是工厂里的工人。在这个工厂中&#xff0c;有时需要进行一些大规模的清理工作&#xff0c;比如垃圾回收&#xff0c;来确保工厂运行得更加高效。但是&#xff0c…

Facebook是什么?有什么功能?如何利用Facebook运营?

Facebook&#xff0c;也常被人们称为“脸书”、“脸谱”等&#xff0c;是美国的社交网络服务及社会化媒体网站&#xff0c;拥有超过20亿的月活跃用户&#xff0c;对于众多商家而言&#xff0c;Facebook以其广泛的用户基础和强大的社交影响力&#xff0c;成为了一个理想的社媒营…

Qt源码分析:QMetaObject实现原理

Qt基于QMetaObject实现了信号/槽机制、属性机制等多个功能特性&#xff0c;而QMetaObject实际上是实现了一种反射机制。 Ref. from Reflection in Java The term "RTTI" is a C-specific term referring to the functionality of the core language that allows the…

视频推拉流EasyDSS点播平台云端录像播放异常的问题排查与解决

视频推拉流EasyDSS视频直播点播平台可提供一站式的视频转码、点播、直播、视频推拉流、播放H.265视频等服务&#xff0c;搭配RTMP高清摄像头使用&#xff0c;可将无人机设备的实时流推送到平台上&#xff0c;实现无人机视频推流直播、巡检等应用。 有用户反馈&#xff0c;项目现…