Web APIs

本篇学习目标:

能够使用removeChild()方法删除节点

能够完成动态生成表格案例

能够使用传统方式和监听方式给元素注册事件

能够说出事件流执行的三个阶段

能够在事件处理函数中获取事件对象

能够使用事件对象取消默认行为

能够使用事件对象阻止事件冒泡

能够使用事件对象获取鼠标的位置

能够完成跟随鼠标的天使案例

1.1. 节点操作

1.1.1 删除节点

在这里插入图片描述

node.removeChild() 方法从 node节点中删除一个子节点,返回删除的节点。

    <button>删除</button><ul><li>熊大</li><li>熊二</li><li>光头强</li></ul><script>// 1.获取元素var ul = document.querySelector('ul');var btn = document.querySelector('button');// 2. 删除元素  node.removeChild(child)// ul.removeChild(ul.children[0]);// 3. 点击按钮依次删除里面的孩子btn.onclick = function() {if (ul.children.length == 0) {this.disabled = true;} else {ul.removeChild(ul.children[0]);}}</script>

1.1.2 案例:删除留言

在这里插入图片描述

    <textarea name="" id=""></textarea><button>发布</button><ul></ul><script>// 1. 获取元素var btn = document.querySelector('button');var text = document.querySelector('textarea');var ul = document.querySelector('ul');// 2. 注册事件btn.onclick = function() {if (text.value == '') {alert('您没有输入内容');return false;} else {// console.log(text.value);// (1) 创建元素var li = document.createElement('li');// 先有li 才能赋值li.innerHTML = text.value + "<a href='javascript:;'>删除</a>";// (2) 添加元素// ul.appendChild(li);ul.insertBefore(li, ul.children[0]);// (3) 删除元素 删除的是当前链接的li  它的父亲var as = document.querySelectorAll('a');for (var i = 0; i < as.length; i++) {as[i].onclick = function() {// 删除的是 li 当前a所在的li  this.parentNode;ul.removeChild(this.parentNode);}}}}</script>

1.1.3 复制(克隆)节点

在这里插入图片描述

    <ul><li>1111</li><li>2</li><li>3</li></ul><script>var ul = document.querySelector('ul');// 1. node.cloneNode(); 括号为空或者里面是false 浅拷贝 只复制标签不复制里面的内容// 2. node.cloneNode(true); 括号为true 深拷贝 复制标签复制里面的内容var lili = ul.children[0].cloneNode(true);ul.appendChild(lili);</script>

1.1.4 案例:动态生成表格

在这里插入图片描述

在这里插入图片描述

    <script>// 1.先去准备好学生的数据var datas = [{name: '魏璎珞',subject: 'JavaScript',score: 100}, {name: '弘历',subject: 'JavaScript',score: 98}, {name: '傅恒',subject: 'JavaScript',score: 99}, {name: '明玉',subject: 'JavaScript',score: 88}, {name: '大猪蹄子',subject: 'JavaScript',score: 0}];// 2. 往tbody 里面创建行: 有几个人(通过数组的长度)我们就创建几行var tbody = document.querySelector('tbody');// 遍历数组for (var i = 0; i < datas.length; i++) { // 1. 创建 tr行var tr = document.createElement('tr');tbody.appendChild(tr);// 2. 行里面创建单元格td 单元格的数量取决于每个对象里面的属性个数  // 使用for in遍历学生对象for (var k in datas[i]) { // 创建单元格 var td = document.createElement('td');// 把对象里面的属性值 datas[i][k] 给 td  td.innerHTML = datas[i][k];tr.appendChild(td);}// 3. 创建有删除2个字的单元格 var td = document.createElement('td');td.innerHTML = '<a href="javascript:;">删除 </a>';tr.appendChild(td);}// 4. 删除操作 开始 var as = document.querySelectorAll('a');for (var i = 0; i < as.length; i++) {as[i].onclick = function() {// 点击a 删除 当前a 所在的行(链接的爸爸的爸爸)  node.removeChild(child)  tbody.removeChild(this.parentNode.parentNode)}}</script>

1.1.5 创建元素的三种方式

在这里插入图片描述

    <script>// 三种创建元素方式区别 // 1. document.write() 创建元素  如果页面文档流加载完毕,再调用这句话会导致页面重绘var btn = document.querySelector('button');btn.onclick = function() {document.write('<div>123</div>');}// 2. innerHTML 创建元素var inner = document.querySelector('.inner');for (var i = 0; i <= 100; i++) {inner.innerHTML += '<a href="#">百度</a>'}var arr = [];for (var i = 0; i <= 100; i++) {arr.push('<a href="#">百度</a>');}inner.innerHTML = arr.join('');// 3. document.createElement() 创建元素var create = document.querySelector('.create');for (var i = 0; i <= 100; i++) {var a = document.createElement('a');create.appendChild(a);}</script>

1.1.6 innerTHML和createElement效率对比

innerHTML字符串拼接方式(效率低)

<script>function fn() {var d1 = +new Date();var str = '';for (var i = 0; i < 1000; i++) {document.body.innerHTML += '<div style="width:100px; height:2px; border:1px solid blue;"></div>';}var d2 = +new Date();console.log(d2 - d1);}fn();
</script>

createElement方式(效率一般)

<script>function fn() {var d1 = +new Date();for (var i = 0; i < 1000; i++) {var div = document.createElement('div');div.style.width = '100px';div.style.height = '2px';div.style.border = '1px solid red';document.body.appendChild(div);}var d2 = +new Date();console.log(d2 - d1);}fn();
</script>

innerHTML数组方式(效率高)

<script>function fn() {var d1 = +new Date();var array = [];for (var i = 0; i < 1000; i++) {array.push('<div style="width:100px; height:2px; border:1px solid blue;"></div>');}document.body.innerHTML = array.join('');var d2 = +new Date();console.log(d2 - d1);}fn();
</script>

1.2. DOM的核心总结

在这里插入图片描述

在这里插入图片描述

关于dom操作,我们主要针对于元素的操作。主要有创建、增、删、改、查、属性操作、事件操作。

1.2.1. 创建

在这里插入图片描述

1.2.2. 增加

在这里插入图片描述

1.2.3. 删

在这里插入图片描述

1.2.4. 改

在这里插入图片描述

1.2.5. 查

在这里插入图片描述

1.2.6. 属性操作

在这里插入图片描述

1.3. 事件高级

1.3.1. 注册事件(2种方式)

在这里插入图片描述

案例演示:

<body><div class="box"></div><button id="btn">事件</button><script>var btn=document.querySelector('#btn')var box=document.querySelector('.box')// 采用onclick 方式绑定单击事件btn.onclick=function(){box.style.width='200px'}// 只有第2个事件起作用btn.onclick=function(){box.style.height='200px'}// 使用 addeventlistener 方式注册事件// btn.addEventListener('click',function(){//     box.style.width='200px'// })// btn.addEventListener('click',function(){//     box.style.height='200px'// })</script>

1.3.2 事件监听

addEventListener()事件监听(IE9以后支持)

在这里插入图片描述

eventTarget.addEventListener()方法将指定的监听器注册到 eventTarget(目标对象)上,当该对象触发指定的事件时,就会执行事件处理函数。

在这里插入图片描述

attacheEvent()事件监听(IE678支持)

在这里插入图片描述

​ eventTarget.attachEvent()方法将指定的监听器注册到 eventTarget(目标对象) 上,当该对象触发指定的事件时,指定的回调函数就会被执行。
在这里插入图片描述

<script>btn.attachEvent('onclick',function(){box.style.width='200px'})btn.attachEvent('onclick',function(){box.style.height='200px'})
</script>

事件监听兼容性解决方案

封装一个函数,函数中判断浏览器的类型:
在这里插入图片描述

1.3.3. 删除事件(解绑事件)

在这里插入图片描述

    <div>1</div><div>2</div><div>3</div><script>var divs = document.querySelectorAll('div');divs[0].onclick = function() {alert(11);// 1. 传统方式删除事件divs[0].onclick = null;}// 2. removeEventListener 删除事件divs[1].addEventListener('click', fn) // 里面的fn 不需要调用加小括号function fn() {alert(22);divs[1].removeEventListener('click', fn);}// 3. detachEventdivs[2].attachEvent('onclick', fn1);function fn1() {alert(33);divs[2].detachEvent('onclick', fn1);}</script>

**删除事件兼容性解决方案 **

在这里插入图片描述

1.3.4. DOM事件流

html中的标签都是相互嵌套的,我们可以将元素想象成一个盒子装一个盒子,document是最外面的大盒子。
当你单击一个div时,同时你也单击了div的父元素,甚至整个页面。那么是先执行父元素的单击事件,还是先执行div的单击事件 ???

在这里插入图片描述

比如:我们给页面中的一个div注册了单击事件,当你单击了div时,也就单击了body,单击了html,单击了document。

在这里插入图片描述

在这里插入图片描述

当时的2大浏览器霸主谁也不服谁!
IE 提出从目标元素开始,然后一层一层向外接收事件并响应,也就是冒泡型事件流。
Netscape(网景公司)提出从最外层开始,然后一层一层向内接收事件并响应,也就是捕获型事件流。江湖纷争,武林盟主也脑壳疼!!!最终,w3c 采用折中的方式,平息了战火,制定了统一的标准 —--— 先捕获再冒泡。
现代浏览器都遵循了此标准,所以当事件发生时,会经历3个阶段。
网景虽死,精神永存!

DOM 事件流会经历3个阶段:

  1. 捕获阶段

  2. 当前目标阶段

  3. 冒泡阶段

​ 我们向水里面扔一块石头,首先它会有一个下降的过程,这个过程就可以理解为从最顶层向事件发生的最具体元素(目标点)的捕获过程;之后会产生泡泡,会在最低点( 最具体元素)之后漂浮到水面上,这个过程相当于事件冒泡。

在这里插入图片描述

在这里插入图片描述

事件冒泡

    <div class="father"><div class="son">son盒子</div></div><script>// onclick 和 attachEvent(ie) 在冒泡阶段触发// 冒泡阶段 如果addEventListener 第三个参数是 false 或者 省略 // son -> father ->body -> html -> documentvar son = document.querySelector('.son');// 给son注册单击事件son.addEventListener('click', function() {alert('son');}, false);// 给father注册单击事件var father = document.querySelector('.father');father.addEventListener('click', function() {alert('father');}, false);// 给document注册单击事件,省略第3个参数document.addEventListener('click', function() {alert('document');})</script>

事件捕获

    <div class="father"><div class="son">son盒子</div></div><script>// 如果addEventListener() 第三个参数是 true 那么在捕获阶段触发// document -> html -> body -> father -> sonvar son = document.querySelector('.son');// 给son注册单击事件,第3个参数为trueson.addEventListener('click', function() {alert('son');}, true);var father = document.querySelector('.father');// 给father注册单击事件,第3个参数为truefather.addEventListener('click', function() {alert('father');}, true);// 给document注册单击事件,第3个参数为truedocument.addEventListener('click', function() {alert('document');}, true)</script>

1.3.5. 事件对象

什么是事件对象

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

比如:

  1. 谁绑定了这个事件。

  2. 鼠标触发事件的话,会得到鼠标的相关信息,如鼠标位置。

  3. 键盘触发事件的话,会得到键盘的相关信息,如按了哪个键。

事件对象的使用

事件触发发生时就会产生事件对象,并且系统会以实参的形式传给事件处理函数。

所以,在事件处理函数中声明1个形参用来接收事件对象。

在这里插入图片描述

事件对象的兼容性处理

事件对象本身的获取存在兼容问题:

  1. 标准浏览器中是浏览器给方法传递的参数,只需要定义形参 e 就可以获取到。

  2. 在 IE6~8 中,浏览器不会给方法传递参数,如果需要的话,需要到 window.event 中获取查找。

在这里插入图片描述

只要“||”前面为false, 不管“||”后面是true 还是 false,都返回 “||” 后面的值。
只要“||”前面为true, 不管“||”后面是true 还是 false,都返回 “||” 前面的值。
    <div>123</div><script>var div = document.querySelector('div');// 为了简单,这里使用 onclick 方式注册事件,如果使用addeventLisenter 还要考虑兼容性写法div.onclick = function(e) {// 事件对象e = e || window.event;console.log(e);}</script>

事件对象的属性和方法

在这里插入图片描述

代码示例

btn.onclick=function(e){e=e || window.event    console.log(e.target || e.srcElement.outerHTML)
}

e.target 和 this 的区别

  • this 是事件绑定的元素(绑定这个事件处理函数的元素) 。

  • e.target 是事件触发的元素。

常情况下terget 和 this是一致的,
但有一种情况不同,那就是在事件冒泡时(父子元素有相同事件,单击子元素,父元素的事件处理函数也会被触发执行),这时候this指向的是父元素,因为它是绑定事件的元素对象,而target指向的是子元素,因为他是触发事件的那个具体元素对象。
    <div>123</div><script>var div = document.querySelector('div');div.addEventListener('click', function(e) {// e.target 和 this指向的都是divconsole.log(e.target);console.log(this);});</script>

事件冒泡下的e.target和this

    <ul><li>abc</li><li>abc</li><li>abc</li></ul><script>var ul = document.querySelector('ul');ul.addEventListener('click', function(e) {// 我们给ul 绑定了事件  那么this 就指向ul  console.log(this); // ul// e.target 触发了事件的对象 我们点击的是li e.target 指向的就是liconsole.log(e.target); // li});</script>

1.3.6 阻止默认行为

html中一些标签有默认行为,例如a标签被单击后,默认会进行页面跳转。

    <a href="http://www.baidu.com">百度</a><script>// 2. 阻止默认行为 让链接不跳转 var a = document.querySelector('a');a.addEventListener('click', function(e) {e.preventDefault(); //  dom 标准写法});// 3. 传统的注册方式document.querySelector('a').onclick=function(e){e=e||window.eventif(e.preventDefault){e.preventDefault()}        e.returnValue=false// 或者上面两种方式都不使用,直接使用下面代码也可以,没有兼容问题// 说说这种方法有什么问题// return false}</script>

1.3.7 阻止事件冒泡

事件冒泡本身的特性,会带来坏处,也会带来好处。

在这里插入图片描述

    <div class="father"><div class="son">son儿子</div></div><script>var son = document.querySelector('.son');// 给son注册单击事件son.addEventListener('click', function(e) {alert('son');e.stopPropagation(); // stop 停止  Propagation 传播window.event.cancelBubble = true; // 非标准 cancel 取消 bubble 泡泡}, false);var father = document.querySelector('.father');// 给father注册单击事件father.addEventListener('click', function() {alert('father');}, false);// 给document注册单击事件document.addEventListener('click', function() {alert('document');})</script>

阻止事件冒泡的兼容性处理

在这里插入图片描述

1.3.8 事件委托

什么是事件委托

把事情委托给别人,代为处理。

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

说白了就是,不给子元素注册事件,给父元素注册事件,把处理代码在父元素的事件中执行。

举例说明

快递员手里有100个快递,小区中有100个居民,挨个派送到家太麻烦了,速度也慢,居民等的也着急

处理方式:将100个快递放到菜鸟驿站,100个居民去菜鸟驿站取货,快递省事,速度也快,居民也不用等待

本来送快递是快递员自己的事,结果把这个事情委派给了菜鸟驿站,这就是事件委派

js事件中的代理:

在这里插入图片描述

事件委托的原理

​ 给父元素注册事件,利用事件冒泡,当子元素的事件触发,会冒泡到父元素,然后去控制相应的子元素。

事件委托的作用

  • 我们只操作了一次 DOM ,提高了程序的性能。

  • 动态新创建的子元素,也拥有事件。

    <ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li></ul><script>// 事件委托的核心原理:给父节点添加侦听器, 利用事件冒泡影响每一个子节点var ul = document.querySelector('ul');ul.addEventListener('click', function(e) {// e.target 这个可以得到我们点击的对象e.target.style.color = 'blue';})</script>

1.4. 常用鼠标事件

在这里插入图片描述

1.4.1 案例:禁止选中文字和禁止右键菜单

在这里插入图片描述

<body>我是一段不愿意分享的文字<script>// 1. contextmenu 我们可以禁用右键菜单document.addEventListener('contextmenu', function(e) {e.preventDefault();})// 2. 禁止选中文字 selectstartdocument.addEventListener('selectstart', function(e) {e.preventDefault();})</script>
</body>

1.4.2 鼠标事件对象

在这里插入图片描述

1.4.3 获取鼠标在页面的坐标

    <script>// 鼠标事件对象 MouseEventdocument.addEventListener('click', function(e) {// 1. client 鼠标在可视区的x和y坐标console.log(e.clientX);console.log(e.clientY);console.log('---------------------');// 2. page 鼠标在页面文档的x和y坐标console.log(e.pageX);console.log(e.pageY);console.log('---------------------');// 3. screen 鼠标在电脑屏幕的x和y坐标console.log(e.screenX);console.log(e.screenY);})</script>

1.4.4 案例:和魔鬼赛跑

在这里插入图片描述

    <img src="images/devil.gif" alt=""><script>var img = document.querySelector('img');document.addEventListener('mousemove', function(e) {// 1. mousemove只要我们鼠标移动1px 就会触发这个事件// 2.核心原理: 每次鼠标移动,我们都会获得最新的鼠标坐标, // 把这个x和y坐标做为图片的top和left 值就可以移动图片var x = e.pageXvar y = e.pageYimg.style.left = x-img.width + 'px'img.style.top = y-img.height/2 + 'px'});</script>
查看全文
如若内容造成侵权/违法违规/事实不符,请联系编程学习网邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!

相关文章

  1. 民法典中抚养子女义务有哪些呢

    对于不具有独立生活能力的子女&#xff0c;父母有抚养能力时&#xff0c;就要承担抚养的责任。抚养子女的责任比较多&#xff0c;如果不抚养子女的&#xff0c;子女可以主张抚养费&#xff0c;那么民法典中抚养子女义务有什么?小编已经整理了如下的内容供大家做法律参考。 一、…...

    2024/3/4 15:14:22
  2. 巩固好基础,才能学好Linux

    我们平时使用的操作系统是windows&#xff0c;但是除此之外&#xff0c;还有一个非常强大的操作系统就是linux&#xff0c;相信在座的各位都听说过Linux&#xff0c;但是在此之前都是只有在windows上学习的经验&#xff0c;所以一换到linux环境上面&#xff0c;就比较迷茫&…...

    2024/3/25 9:37:01
  3. tensorRT相关问题

    FP 16量化推理的结果不一致的原因 (抛砖引玉)TensorRT的FP16不得劲&#xff1f;怎么办&#xff1f;在线支招&#xff01; 模型中某一层的计算FP 16因为动态范围和精度不够&#xff0c;导致某个OP节点的计算值溢出。迁一发而动全身&#xff0c;整个模型后面的所有层都崩塌了。…...

    2024/3/4 15:14:21
  4. 舞钢高建钢Q460GJCZ25钢板(厚度能够到达120mm)

    Q460GJC是国标高层建筑用钢中的一个商标&#xff0c;GJ即为高层建筑的意思。C为它的一个等级的显现。此商标因具有杰出的功能还可依据客户的需求增加一些其他的功能&#xff0c;而被广阔运用于种高层建筑的制作中所运用。 Q460GJC意义&#xff1a;Q是屈从首字母&#xff0c;46…...

    2024/3/4 15:14:19
  5. 诚之和:元宇宙的“诸神之战” 风口还是风险

    1992年&#xff0c;美国著名科幻大师尼尔斯蒂芬森在其小说《雪崩》中曾这样描述元宇宙&#xff1a;“戴上耳机和目镜&#xff0c;找到连接终端&#xff0c;就能够以虚拟分身的方式进入由计算机模拟、与真实世界平行的虚拟空间。”30年后&#xff0c;小说开始照进现实。从设备到…...

    2024/3/6 9:53:11
  6. 2021-11-04 多文件本地复制 IO流

    package com.test;import java.io.*;public class Demo {public static void main(String[] args) throws IOException {//原目录File filesnew File("C:\\img1\\");//上传后的目录String src "C:\\img2\\";//扫描该目录是否存在File srcFilenew File(src)…...

    2024/3/6 9:53:10
  7. 函数指针与状态机的用法

    函数指针与状态机的用法1 函数指针与状态机2 使用函数指针来代替switch case2.1 一个简单的switch场景2.2 使用函数指针来替换switch3 状态机应用的注意事项原文链接&#xff1a;https://blog.csdn.net/liebecl/article/details/76718767 1 函数指针与状态机 在很多大型的集成…...

    2024/3/6 9:53:09
  8. 深入解读Redis之数据类型解析-ZipList

    Redis源码之数据类型解析-ZipList 当前分析 Redis 版本为6.2&#xff0c;需要注意。 ZipList&#xff0c;压缩列表&#xff0c;可以任意包含多个节点。 基础结构 ZipList 压缩列表。其整体布局&#xff0c;<zlbytes> <zltail> <zllen> <entry> &l…...

    2024/3/26 2:32:36
  9. 安信可WIFI模组海思系列AT指令测试低功耗模式教程

    目录前期准备1.1 硬件准备1.2 软件准备HI-12FL模组测试2.1 HI-12FL模组连接路由后进入浅度睡眠模式2.2 HI-12FL模组连接路由后进入深度睡眠模式2.3 HI-12FL模组进入超深度睡眠模式HI-12F模组测试3.1 HI-12F模组连接路由后进入浅度睡眠模式3.2 HI-12F模组连接路由后进入深度睡眠…...

    2024/3/29 8:15:58
  10. 《天天数学》连载36:二月五日

    格言作者:阿尔伯特爱因斯坦(Albert Einstein 1879年3月14日—1955年4月18日),出生于德国巴登-符腾堡州乌尔姆市,现代物理学家。爱因斯坦出生于德国乌尔姆市的一个犹太人家庭(父母均为犹太人)。1900年毕业于瑞士苏黎世联邦理工学院,入瑞士国籍。1905年,爱因斯坦获苏黎…...

    2024/3/6 9:53:06
  11. Outlook Express 使用技巧大全之应用篇

    很多朋友使用IE软件包中的OutLook Express(以下简称OE)来收发电子邮件。对初学者来说,根据提示或向导的确很容易使用这个软件,但对一些想深入了解它和高效使用它的用户来说,向导和在线帮助却又显得有点力不从心。由于没有掌握其中的一些技巧和方法,就经常遇到这样或者那样…...

    2024/3/6 9:53:06
  12. 青岛大学OnlineJudge搭建

    OnlineJudge 环境准备 ubuntu 18.04dockerdocker-composer 换源 sudo cp /etc/apt/sources.list /etc/apt/sources.list.bak sudo vim /etc/apt/sources.list替换内容为 deb http://mirrors.aliyun.com/ubuntu/ bionic main restricted universe multiverse deb-src http://m…...

    2024/3/6 9:53:04
  13. ajax获取文件流中文乱码解决之jQuery-fileDownload

    1.引入jquery.fileDownload.js GitHub地址&#xff1a;点击跳转 2.使用 $.fileDownload(../license/download, {httpMethod: GET,data: {"path": path},failCallback: function (html, url) {alert("下载失败");}});...

    2024/3/6 9:53:03
  14. 诚之和:巨头互联互通“拆墙”记“一键分享”半路被堵

    “双十一看到优惠的东西想分享给朋友&#xff0c;结果并不能一键分享”。 这是互联网巨头身上的槽点&#xff0c;也是App之间筑起的“围墙”。 10月27日&#xff0c;淘宝上线购物车分享功能&#xff0c;市场一度猜测这将成为互联网巨头之间推倒的第一堵墙——如果淘宝购物车能直…...

    2024/3/6 9:53:02
  15. JavaScript的学习日记六(数组对象的补充)

    文章目录一、数组的创建二、检测是否为数组2.1 instanceof 运算符2.2 Array.isArray()三、添加删除数组元素的方法3.1 添加数组元素方法3.2 删除数组元素方法四、数组排序五、数组索引方法六、数组转换为字符串七、字符串对象7.1 字符串操作方法7.2 根据字符返回位置7.3 根据位…...

    2024/3/6 9:53:01
  16. 时间日期处理函数

    /*** 日期转化函数* param {*} value 需要转化的日期* param {*} type 控制输出的样式* returns*/ function getDateTime(value, type) {if (value) {value valueif (value.indexOf(-) > -1) {value value.replace(/-/g, /)}}const time value? isNaN(new Date(value)…...

    2024/3/4 15:14:30
  17. python11.4

    len():用于获取一个对象的长度 range():生成一个数字序列&#xff0c;参数只能是整型 range(stop) range(start,stop) range(start,stop,step)step跨度&#xff0c;如跨度为2&#xff0c;打印为5&#xff0c;7&#xff0c;9&#xff0c;跨度可为负 a b # 这里只涉及两个变…...

    2024/3/4 15:14:29
  18. CSS面试(三)

    css中超出省略如何实现 浏览器显示效果...

    2024/3/4 15:14:28
  19. typescript基础--接口、类、函数

    接口 ts的接口与其他语言接口不太一样&#xff0c;其作用可能只是为类型命名或第三方代码定义契约&#xff0c;一开始接触到的时候&#xff0c;看见公司代码里有interface&#xff0c;以为是java一样的接口&#xff0c;但主管告诉我这只是一个数据结构&#xff0c;就像你看见屎…...

    2024/3/4 15:14:27
  20. 老杜 | Mysql的34道作业题

    MySQL34道作业题 1、取得每个部门最高薪水的人员名称 mysql> select e.ename,t.* from emp e join (select deptno,max(sal) as maxsal from emp group by deptno) t on t.deptno e.deptno and t.maxsal e.sal; ------------------------ | ename | deptno | maxsal | …...

    2024/3/4 15:14:28

最新文章

  1. PCM /G711音频播放器 :Audacity

    下载路径&#xff1a; Audacity | Free Audio editor, recorder, music making and more!...

    2024/3/29 16:56:38
  2. 梯度消失和梯度爆炸的一些处理方法

    在这里是记录一下梯度消失或梯度爆炸的一些处理技巧。全当学习总结了如有错误还请留言&#xff0c;在此感激不尽。 权重和梯度的更新公式如下&#xff1a; w w − η ⋅ ∇ w w w - \eta \cdot \nabla w ww−η⋅∇w 个人通俗的理解梯度消失就是网络模型在反向求导的时候出…...

    2024/3/20 10:50:27
  3. ensp中pc机访问不同网络的服务器

    拓扑图如下&#xff0c;资源已上传 说明&#xff1a;pc通过2个路由访问server服务器 三条线路分别是192.168.1.0网段&#xff0c;192.168.2.0网段和192.168.3.0网段&#xff0c;在未配置的情况下&#xff0c;pc设备是访问不到server的 具体操作流程 第一&#xff1b;pc设备…...

    2024/3/29 16:24:48
  4. 基于Springboot的个人博客系统的设计与实现

    目录 1. 第1章 绪论 1.1. 1.1 研究背景 1.2. 1.2 研究意义和目的 2. 第2章 主要技术介绍 2.1. 2.1 SpringBoot框架 2.2. 2.2 IntelliJ IDEA开发工具 2.3. 2.3 Thymeleaf模版引擎 基于Springboot的个人博客系统的设计与实现...

    2024/3/29 5:18:14
  5. 【SpringSecurity】十五、完成系统支持Github三方登录

    文章目录 1、需求2、在对接系统中完成客户端注册3、创建客户端应用4、CommonOAuth2Provider SpringSecurity OAuth2.0文档&#xff1a; https://docs.spring.io/spring-security/reference/servlet/oauth2/index.html 1、需求 对接Github&#xff0c;在自己系统实现支持Githu…...

    2024/3/29 0:55:27
  6. 【外汇早评】美通胀数据走低,美元调整

    原标题:【外汇早评】美通胀数据走低,美元调整昨日美国方面公布了新一期的核心PCE物价指数数据,同比增长1.6%,低于前值和预期值的1.7%,距离美联储的通胀目标2%继续走低,通胀压力较低,且此前美国一季度GDP初值中的消费部分下滑明显,因此市场对美联储后续更可能降息的政策…...

    2024/3/27 10:21:24
  7. 【原油贵金属周评】原油多头拥挤,价格调整

    原标题:【原油贵金属周评】原油多头拥挤,价格调整本周国际劳动节,我们喜迎四天假期,但是整个金融市场确实流动性充沛,大事频发,各个商品波动剧烈。美国方面,在本周四凌晨公布5月份的利率决议和新闻发布会,维持联邦基金利率在2.25%-2.50%不变,符合市场预期。同时美联储…...

    2024/3/24 20:11:25
  8. 【外汇周评】靓丽非农不及疲软通胀影响

    原标题:【外汇周评】靓丽非农不及疲软通胀影响在刚结束的周五,美国方面公布了新一期的非农就业数据,大幅好于前值和预期,新增就业重新回到20万以上。具体数据: 美国4月非农就业人口变动 26.3万人,预期 19万人,前值 19.6万人。 美国4月失业率 3.6%,预期 3.8%,前值 3…...

    2024/3/29 2:45:46
  9. 【原油贵金属早评】库存继续增加,油价收跌

    原标题:【原油贵金属早评】库存继续增加,油价收跌周三清晨公布美国当周API原油库存数据,上周原油库存增加281万桶至4.692亿桶,增幅超过预期的74.4万桶。且有消息人士称,沙特阿美据悉将于6月向亚洲炼油厂额外出售更多原油,印度炼油商预计将每日获得至多20万桶的额外原油供…...

    2024/3/29 16:26:39
  10. 【外汇早评】日本央行会议纪要不改日元强势

    原标题:【外汇早评】日本央行会议纪要不改日元强势近两日日元大幅走强与近期市场风险情绪上升,避险资金回流日元有关,也与前一段时间的美日贸易谈判给日本缓冲期,日本方面对汇率问题也避免继续贬值有关。虽然今日早间日本央行公布的利率会议纪要仍然是支持宽松政策,但这符…...

    2024/3/29 5:19:52
  11. 【原油贵金属早评】欧佩克稳定市场,填补伊朗问题的影响

    原标题:【原油贵金属早评】欧佩克稳定市场,填补伊朗问题的影响近日伊朗局势升温,导致市场担忧影响原油供给,油价试图反弹。此时OPEC表态稳定市场。据消息人士透露,沙特6月石油出口料将低于700万桶/日,沙特已经收到石油消费国提出的6月份扩大出口的“适度要求”,沙特将满…...

    2024/3/28 17:01:12
  12. 【外汇早评】美欲与伊朗重谈协议

    原标题:【外汇早评】美欲与伊朗重谈协议美国对伊朗的制裁遭到伊朗的抗议,昨日伊朗方面提出将部分退出伊核协议。而此行为又遭到欧洲方面对伊朗的谴责和警告,伊朗外长昨日回应称,欧洲国家履行它们的义务,伊核协议就能保证存续。据传闻伊朗的导弹已经对准了以色列和美国的航…...

    2024/3/29 11:11:56
  13. 【原油贵金属早评】波动率飙升,市场情绪动荡

    原标题:【原油贵金属早评】波动率飙升,市场情绪动荡因中美贸易谈判不安情绪影响,金融市场各资产品种出现明显的波动。随着美国与中方开启第十一轮谈判之际,美国按照既定计划向中国2000亿商品征收25%的关税,市场情绪有所平复,已经开始接受这一事实。虽然波动率-恐慌指数VI…...

    2024/3/29 1:13:26
  14. 【原油贵金属周评】伊朗局势升温,黄金多头跃跃欲试

    原标题:【原油贵金属周评】伊朗局势升温,黄金多头跃跃欲试美国和伊朗的局势继续升温,市场风险情绪上升,避险黄金有向上突破阻力的迹象。原油方面稍显平稳,近期美国和OPEC加大供给及市场需求回落的影响,伊朗局势并未推升油价走强。近期中美贸易谈判摩擦再度升级,美国对中…...

    2024/3/29 8:28:16
  15. 【原油贵金属早评】市场情绪继续恶化,黄金上破

    原标题:【原油贵金属早评】市场情绪继续恶化,黄金上破周初中国针对于美国加征关税的进行的反制措施引发市场情绪的大幅波动,人民币汇率出现大幅的贬值动能,金融市场受到非常明显的冲击。尤其是波动率起来之后,对于股市的表现尤其不安。隔夜美国股市出现明显的下行走势,这…...

    2024/3/29 7:41:19
  16. 【外汇早评】美伊僵持,风险情绪继续升温

    原标题:【外汇早评】美伊僵持,风险情绪继续升温昨日沙特两艘油轮再次发生爆炸事件,导致波斯湾局势进一步恶化,市场担忧美伊可能会出现摩擦生火,避险品种获得支撑,黄金和日元大幅走强。美指受中美贸易问题影响而在低位震荡。继5月12日,四艘商船在阿联酋领海附近的阿曼湾、…...

    2024/3/24 20:11:18
  17. 【原油贵金属早评】贸易冲突导致需求低迷,油价弱势

    原标题:【原油贵金属早评】贸易冲突导致需求低迷,油价弱势近日虽然伊朗局势升温,中东地区几起油船被袭击事件影响,但油价并未走高,而是出于调整结构中。由于市场预期局势失控的可能性较低,而中美贸易问题导致的全球经济衰退风险更大,需求会持续低迷,因此油价调整压力较…...

    2024/3/29 9:57:23
  18. 氧生福地 玩美北湖(上)——为时光守候两千年

    原标题:氧生福地 玩美北湖(上)——为时光守候两千年一次说走就走的旅行,只有一张高铁票的距离~ 所以,湖南郴州,我来了~ 从广州南站出发,一个半小时就到达郴州西站了。在动车上,同时改票的南风兄和我居然被分到了一个车厢,所以一路非常愉快地聊了过来。 挺好,最起…...

    2024/3/29 0:49:46
  19. 氧生福地 玩美北湖(中)——永春梯田里的美与鲜

    原标题:氧生福地 玩美北湖(中)——永春梯田里的美与鲜一觉醒来,因为大家太爱“美”照,在柳毅山庄去寻找龙女而错过了早餐时间。近十点,向导坏坏还是带着饥肠辘辘的我们去吃郴州最富有盛名的“鱼头粉”。说这是“十二分推荐”,到郴州必吃的美食之一。 哇塞!那个味美香甜…...

    2024/3/24 20:11:15
  20. 氧生福地 玩美北湖(下)——奔跑吧骚年!

    原标题:氧生福地 玩美北湖(下)——奔跑吧骚年!让我们红尘做伴 活得潇潇洒洒 策马奔腾共享人世繁华 对酒当歌唱出心中喜悦 轰轰烈烈把握青春年华 让我们红尘做伴 活得潇潇洒洒 策马奔腾共享人世繁华 对酒当歌唱出心中喜悦 轰轰烈烈把握青春年华 啊……啊……啊 两…...

    2024/3/27 7:12:50
  21. 扒开伪装医用面膜,翻六倍价格宰客,小姐姐注意了!

    原标题:扒开伪装医用面膜,翻六倍价格宰客,小姐姐注意了!扒开伪装医用面膜,翻六倍价格宰客!当行业里的某一品项火爆了,就会有很多商家蹭热度,装逼忽悠,最近火爆朋友圈的医用面膜,被沾上了污点,到底怎么回事呢? “比普通面膜安全、效果好!痘痘、痘印、敏感肌都能用…...

    2024/3/24 20:11:13
  22. 「发现」铁皮石斛仙草之神奇功效用于医用面膜

    原标题:「发现」铁皮石斛仙草之神奇功效用于医用面膜丽彦妆铁皮石斛医用面膜|石斛多糖无菌修护补水贴19大优势: 1、铁皮石斛:自唐宋以来,一直被列为皇室贡品,铁皮石斛生于海拔1600米的悬崖峭壁之上,繁殖力差,产量极低,所以古代仅供皇室、贵族享用 2、铁皮石斛自古民间…...

    2024/3/26 11:21:23
  23. 丽彦妆\医用面膜\冷敷贴轻奢医学护肤引导者

    原标题:丽彦妆\医用面膜\冷敷贴轻奢医学护肤引导者【公司简介】 广州华彬企业隶属香港华彬集团有限公司,专注美业21年,其旗下品牌: 「圣茵美」私密荷尔蒙抗衰,产后修复 「圣仪轩」私密荷尔蒙抗衰,产后修复 「花茵莳」私密荷尔蒙抗衰,产后修复 「丽彦妆」专注医学护…...

    2024/3/28 18:26:34
  24. 广州械字号面膜生产厂家OEM/ODM4项须知!

    原标题:广州械字号面膜生产厂家OEM/ODM4项须知!广州械字号面膜生产厂家OEM/ODM流程及注意事项解读: 械字号医用面膜,其实在我国并没有严格的定义,通常我们说的医美面膜指的应该是一种「医用敷料」,也就是说,医用面膜其实算作「医疗器械」的一种,又称「医用冷敷贴」。 …...

    2024/3/28 12:42:28
  25. 械字号医用眼膜缓解用眼过度到底有无作用?

    原标题:械字号医用眼膜缓解用眼过度到底有无作用?医用眼膜/械字号眼膜/医用冷敷眼贴 凝胶层为亲水高分子材料,含70%以上的水分。体表皮肤温度传导到本产品的凝胶层,热量被凝胶内水分子吸收,通过水分的蒸发带走大量的热量,可迅速地降低体表皮肤局部温度,减轻局部皮肤的灼…...

    2024/3/28 20:09:10
  26. 配置失败还原请勿关闭计算机,电脑开机屏幕上面显示,配置失败还原更改 请勿关闭计算机 开不了机 这个问题怎么办...

    解析如下&#xff1a;1、长按电脑电源键直至关机&#xff0c;然后再按一次电源健重启电脑&#xff0c;按F8健进入安全模式2、安全模式下进入Windows系统桌面后&#xff0c;按住“winR”打开运行窗口&#xff0c;输入“services.msc”打开服务设置3、在服务界面&#xff0c;选中…...

    2022/11/19 21:17:18
  27. 错误使用 reshape要执行 RESHAPE,请勿更改元素数目。

    %读入6幅图像&#xff08;每一幅图像的大小是564*564&#xff09; f1 imread(WashingtonDC_Band1_564.tif); subplot(3,2,1),imshow(f1); f2 imread(WashingtonDC_Band2_564.tif); subplot(3,2,2),imshow(f2); f3 imread(WashingtonDC_Band3_564.tif); subplot(3,2,3),imsho…...

    2022/11/19 21:17:16
  28. 配置 已完成 请勿关闭计算机,win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机...

    win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机”问题的解决方法在win7系统关机时如果有升级系统的或者其他需要会直接进入一个 等待界面&#xff0c;在等待界面中我们需要等待操作结束才能关机&#xff0c;虽然这比较麻烦&#xff0c;但是对系统进行配置和升级…...

    2022/11/19 21:17:15
  29. 台式电脑显示配置100%请勿关闭计算机,“准备配置windows 请勿关闭计算机”的解决方法...

    有不少用户在重装Win7系统或更新系统后会遇到“准备配置windows&#xff0c;请勿关闭计算机”的提示&#xff0c;要过很久才能进入系统&#xff0c;有的用户甚至几个小时也无法进入&#xff0c;下面就教大家这个问题的解决方法。第一种方法&#xff1a;我们首先在左下角的“开始…...

    2022/11/19 21:17:14
  30. win7 正在配置 请勿关闭计算机,怎么办Win7开机显示正在配置Windows Update请勿关机...

    置信有很多用户都跟小编一样遇到过这样的问题&#xff0c;电脑时发现开机屏幕显现“正在配置Windows Update&#xff0c;请勿关机”(如下图所示)&#xff0c;而且还需求等大约5分钟才干进入系统。这是怎样回事呢&#xff1f;一切都是正常操作的&#xff0c;为什么开时机呈现“正…...

    2022/11/19 21:17:13
  31. 准备配置windows 请勿关闭计算机 蓝屏,Win7开机总是出现提示“配置Windows请勿关机”...

    Win7系统开机启动时总是出现“配置Windows请勿关机”的提示&#xff0c;没过几秒后电脑自动重启&#xff0c;每次开机都这样无法进入系统&#xff0c;此时碰到这种现象的用户就可以使用以下5种方法解决问题。方法一&#xff1a;开机按下F8&#xff0c;在出现的Windows高级启动选…...

    2022/11/19 21:17:12
  32. 准备windows请勿关闭计算机要多久,windows10系统提示正在准备windows请勿关闭计算机怎么办...

    有不少windows10系统用户反映说碰到这样一个情况&#xff0c;就是电脑提示正在准备windows请勿关闭计算机&#xff0c;碰到这样的问题该怎么解决呢&#xff0c;现在小编就给大家分享一下windows10系统提示正在准备windows请勿关闭计算机的具体第一种方法&#xff1a;1、2、依次…...

    2022/11/19 21:17:11
  33. 配置 已完成 请勿关闭计算机,win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机”的解决方法...

    今天和大家分享一下win7系统重装了Win7旗舰版系统后&#xff0c;每次关机的时候桌面上都会显示一个“配置Windows Update的界面&#xff0c;提示请勿关闭计算机”&#xff0c;每次停留好几分钟才能正常关机&#xff0c;导致什么情况引起的呢&#xff1f;出现配置Windows Update…...

    2022/11/19 21:17:10
  34. 电脑桌面一直是清理请关闭计算机,windows7一直卡在清理 请勿关闭计算机-win7清理请勿关机,win7配置更新35%不动...

    只能是等着&#xff0c;别无他法。说是卡着如果你看硬盘灯应该在读写。如果从 Win 10 无法正常回滚&#xff0c;只能是考虑备份数据后重装系统了。解决来方案一&#xff1a;管理员运行cmd&#xff1a;net stop WuAuServcd %windir%ren SoftwareDistribution SDoldnet start WuA…...

    2022/11/19 21:17:09
  35. 计算机配置更新不起,电脑提示“配置Windows Update请勿关闭计算机”怎么办?

    原标题&#xff1a;电脑提示“配置Windows Update请勿关闭计算机”怎么办&#xff1f;win7系统中在开机与关闭的时候总是显示“配置windows update请勿关闭计算机”相信有不少朋友都曾遇到过一次两次还能忍但经常遇到就叫人感到心烦了遇到这种问题怎么办呢&#xff1f;一般的方…...

    2022/11/19 21:17:08
  36. 计算机正在配置无法关机,关机提示 windows7 正在配置windows 请勿关闭计算机 ,然后等了一晚上也没有关掉。现在电脑无法正常关机...

    关机提示 windows7 正在配置windows 请勿关闭计算机 &#xff0c;然后等了一晚上也没有关掉。现在电脑无法正常关机以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容&#xff0c;让我们赶快一起来看一下吧&#xff01;关机提示 windows7 正在配…...

    2022/11/19 21:17:05
  37. 钉钉提示请勿通过开发者调试模式_钉钉请勿通过开发者调试模式是真的吗好不好用...

    钉钉请勿通过开发者调试模式是真的吗好不好用 更新时间:2020-04-20 22:24:19 浏览次数:729次 区域: 南阳 > 卧龙 列举网提醒您:为保障您的权益,请不要提前支付任何费用! 虚拟位置外设器!!轨迹模拟&虚拟位置外设神器 专业用于:钉钉,外勤365,红圈通,企业微信和…...

    2022/11/19 21:17:05
  38. 配置失败还原请勿关闭计算机怎么办,win7系统出现“配置windows update失败 还原更改 请勿关闭计算机”,长时间没反应,无法进入系统的解决方案...

    前几天班里有位学生电脑(windows 7系统)出问题了&#xff0c;具体表现是开机时一直停留在“配置windows update失败 还原更改 请勿关闭计算机”这个界面&#xff0c;长时间没反应&#xff0c;无法进入系统。这个问题原来帮其他同学也解决过&#xff0c;网上搜了不少资料&#x…...

    2022/11/19 21:17:04
  39. 一个电脑无法关闭计算机你应该怎么办,电脑显示“清理请勿关闭计算机”怎么办?...

    本文为你提供了3个有效解决电脑显示“清理请勿关闭计算机”问题的方法&#xff0c;并在最后教给你1种保护系统安全的好方法&#xff0c;一起来看看&#xff01;电脑出现“清理请勿关闭计算机”在Windows 7(SP1)和Windows Server 2008 R2 SP1中&#xff0c;添加了1个新功能在“磁…...

    2022/11/19 21:17:03
  40. 请勿关闭计算机还原更改要多久,电脑显示:配置windows更新失败,正在还原更改,请勿关闭计算机怎么办...

    许多用户在长期不使用电脑的时候&#xff0c;开启电脑发现电脑显示&#xff1a;配置windows更新失败&#xff0c;正在还原更改&#xff0c;请勿关闭计算机。。.这要怎么办呢&#xff1f;下面小编就带着大家一起看看吧&#xff01;如果能够正常进入系统&#xff0c;建议您暂时移…...

    2022/11/19 21:17:02
  41. 还原更改请勿关闭计算机 要多久,配置windows update失败 还原更改 请勿关闭计算机,电脑开机后一直显示以...

    配置windows update失败 还原更改 请勿关闭计算机&#xff0c;电脑开机后一直显示以以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容&#xff0c;让我们赶快一起来看一下吧&#xff01;配置windows update失败 还原更改 请勿关闭计算机&#x…...

    2022/11/19 21:17:01
  42. 电脑配置中请勿关闭计算机怎么办,准备配置windows请勿关闭计算机一直显示怎么办【图解】...

    不知道大家有没有遇到过这样的一个问题&#xff0c;就是我们的win7系统在关机的时候&#xff0c;总是喜欢显示“准备配置windows&#xff0c;请勿关机”这样的一个页面&#xff0c;没有什么大碍&#xff0c;但是如果一直等着的话就要两个小时甚至更久都关不了机&#xff0c;非常…...

    2022/11/19 21:17:00
  43. 正在准备配置请勿关闭计算机,正在准备配置windows请勿关闭计算机时间长了解决教程...

    当电脑出现正在准备配置windows请勿关闭计算机时&#xff0c;一般是您正对windows进行升级&#xff0c;但是这个要是长时间没有反应&#xff0c;我们不能再傻等下去了。可能是电脑出了别的问题了&#xff0c;来看看教程的说法。正在准备配置windows请勿关闭计算机时间长了方法一…...

    2022/11/19 21:16:59
  44. 配置失败还原请勿关闭计算机,配置Windows Update失败,还原更改请勿关闭计算机...

    我们使用电脑的过程中有时会遇到这种情况&#xff0c;当我们打开电脑之后&#xff0c;发现一直停留在一个界面&#xff1a;“配置Windows Update失败&#xff0c;还原更改请勿关闭计算机”&#xff0c;等了许久还是无法进入系统。如果我们遇到此类问题应该如何解决呢&#xff0…...

    2022/11/19 21:16:58
  45. 如何在iPhone上关闭“请勿打扰”

    Apple’s “Do Not Disturb While Driving” is a potentially lifesaving iPhone feature, but it doesn’t always turn on automatically at the appropriate time. For example, you might be a passenger in a moving car, but your iPhone may think you’re the one dri…...

    2022/11/19 21:16:57