day28_JQuery

今日内容

零、 复习昨日
一、正则表达式
二、JQuery

零、 复习昨日

js已经学完,js是让页面动态变化
1) 基本语法(变量,运算,逻辑,函数)
2) 事件(给标签绑定不同的事件)
3) dom(改变标签内容,属性,样式)

一、引言

1.1 jQuery概述

原生js获得dom对象: var obj = document.getElementById(“id”)

jq获得dom对象: var obj = $(“#id”)

jQuery是一个快速、简洁的JavaScript代码库。jQuery设计的宗旨是“Write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript操作方式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

Logo
image-20230311161635225

1.2 jQuery特点

  • 具有独特的链式调用语法。
  • 支持高效灵活的CSS选择器。
  • 拥有丰富的插件。
  • 兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。

1.3 为什么要用jQuery

  • 目前网络上有大量开源的 JS 框架, 但是 jQuery 是目前最流行的 JS 框架，而且提供了大量的扩展。很多大公司都在使用 jQuery， 例如：Google、Microsoft、IBM、Netflix

二、jQuery安装

2.1 直接引用jQuery

从 jQuery.com 官网或从GitHub下载合适版本（本课程使用2.1.0版本），放入项目的合适目录中，在页面中直接引用。

有两个版本的 jQuery 可供下载：

  • Production version - 用于生产实际的网站中，已被精简和压缩。
  • Development version - 用于测试和开发（未压缩，便于可读）。

jQuery 库是一个 JavaScript 文件，使用 HTML 的 < script src=“”>< /script> 标签引用

<head>
	<script src="jquery-2.1.0.js"></script>
    <!-- <script src="jquery-2.1.0.min.js"></script> -->
</head>

2.2 CDN引用

2.2.1 什么是CDN？

CDN的全称是Content Delivery Network，即内容分发网络 , 使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。

2.2.2 常见 CDN

百度 CDN

<head>
	<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
	</script>
</head>

新浪 CDN

<head>
	<script src="http://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
	</script>
</head>

Google CDN

<head>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
	</script>
</head>

Microsoft CDN

<head>
	<script src="http://ajax.htmlnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js">
	</script>
</head>

三、选择器[重点]

学习JQuery,主要学习DOM操作,事件处理,动画效果,AJAX交互

其他JS语法,例如:基本数据类型,运算,分支循环,数组,日期,JSON等等基础语法一样使用.

选择器就是js中dom查找的简化

document.getElementById() --> $("#id")
document.getElementsByTagName() --> $("div")
document.getElementsByClassName() --> $(".c1")

选择器有很多种,具体查询APIjQuery 参考手册 - 选择器 (w3school.com.cn)

主要学习几个基本即可

  • 标签名
  • id
  • 类

3.1 元素选择器

  • 元素选择器：jQuery 元素选择器基于元素名选取元素。

  • 示例：在页面中选取所有

    元素 

  <body>
    <div>曹操</div>
    <div>曹植</div>
    <div>曹丕</div>
    <span>曹冲</span>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      // 标签名选择器,选到所有同名标签,返回数组
      var divArr = $("div");
      console.log(divArr);
    </script>
  </body>

3.2 id选择器

  • id选择器：jQuery #id 选择器通过 HTML 元素的 id 属性选取指定的元素。

  • 页面中元素的 id 应该是唯一的，所以要在页面中选取唯一的元素需要通过 #id 选择器。通过 id 选取元素语法如下：

  <body>
    <div id="d1">曹操</div>
    <div id="d2">曹植</div>
    <div id="d3">曹丕</div>
    <span id="d4">曹冲</span>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
     
      // id选择器,标签加id属性,$()内要#号
      // 选择到一个标签
      var div1 = $("#d1");
      console.log(div1);
    </script>
  </body>

3.3 类选择器

  • class选择器：jQuery 类选择器可以通过指定的 class 查找元素。

  • 语法如下：

  <body>
    <div id="d1">曹操</div>
    <div id="d2" class="son">曹植</div>
    <div id="d3" class="son">曹丕</div>
    <span id="d4" class="son">曹冲</span>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      // 类选择器,标签加class属性,$()内要.class
      // 选择到同class的多个标签,返回数组
      var sonArr = $(".son");
      console.log(sonArr);
    </script>
  </body>

3.4 其他选择器

查看API

五、事件

5.1 常见事件

鼠标事件键盘事件表单事件文档/窗口事件
clickkeypresssubmitload
dblclickkeydownchangeresize
mouseenterkeyupfocusscroll
mouseleaveblurunload

5.2 事件语法

js中
js对象.on事件 = function(){}

jq中
jq对象.事件(function(){}) ==> jq对象.事件(()=>{})
  • jQuery 事件方法语法：

  • 在 jQuery 中，大多数 DOM 事件都有一个等效的 jQuery 方法。

  • jq对象.事件方法(),例如

  • $(“#i1”).click()

5.3 鼠标事件

  <body>
    <button id="btn-1">点单击事件</button>
    <button id="btn-2">点双击击事件</button>
    <div
      id="box"
      style="width: 200px; height: 200px; border: 2px red solid"
    ></div>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      var count = 0;
      /**
       * 1 选择事件源
       * 2 绑定事件
       * 3 设置响应函数
       */
      $("#btn-1").click(function () {
        count++;
        console.log("单击:" + count);
      });
      // 箭头函数 es6的新语法
       $("#btn-1").click(() => {
         alert("jq-点击事件")
       })
        
      $("#btn-2").dblclick(function () {
        console.log("双击");
      });
      //   $("#box").mouseover(function () {
      //     console.log("鼠标进入");
      //   });
      //   $("#box").mouseout(function () {
      //     console.log("鼠标离开");
      //   });

      // 链式语法,其实就是链式调用,连着调用
      $("#box").mouseover(function () {
          console.log("鼠标进入");
      }).mouseout(function () {
          console.log("鼠标离开");
      }).mousemove(function () {
          console.log("鼠标移动");
      });
    </script>
  </body>

5.4 键盘事件

  • keydown
  • keyup
  • keypress
  <body>
    <!-- 演示键盘事件 -->
    <input id="input-1" />
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      /**
       * 1 选择事件源
       * 2 绑定事件
       * 3 设置响应函数
       */
      $("#input-1").keydown((event) => {
          console.log("键盘按下");
          if (event.keyCode == 13) {
            console.log("按下回车,提交表单");
          }
        }).keyup(() => {
          console.log("键盘弹起");
        }).keypress(function () {
          console.log("键盘按压");
        });
    </script>
  </body>

5.5 表单事件[重点]

jq对象.事件(function(){

})
  • focus
  • blur
  • change
  • submit
  <body>
    <form accept="/java2217">
      用户名<input type="text" name="username" /><br />
      密码<input type="password" name="password" /><br />
      技能<input type="checkbox" name="skill" value="Java" /> Java
      <input type="checkbox" name="skill" value="HTML" /> HTML
      <input type="checkbox" name="skill" value="MySQL" /> MySQL <br />
      <input type="submit" value="提交" />
    </form>
    <!-- 引入js标签,内部不能写代码 -->
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      //  获得焦点失去焦点
      $("input[type=text]").focus(() => {
          console.log("用户名输入框获得焦点");
        }).blur(() => {
          console.log("用户名输入框失去焦点");
        });
      // 内容改变(下拉框,单选复选,都可以实现改变事件)
      $("input[type=checkbox]").change(() => {
        console.log("内容改变");
      });

      // 表单提交
      // 选中表单,	绑定事件
      // form是标签名选择器,:first是选中第一个
      $("form:first").submit(function () {
        console.log("提交了");
        // return false; // 阻止表单提交
        return true; // 允许表单提交
          // 通过测试,你怎么知道是否是提交了呢?
          // 通过看url中是否?后拼接参数
      });
    </script>
  </body>

5.6 加载事件

  • 加载事件,当页面加载完再触发的事件
  • js时加载事件是onload
  • 在jquery中ready来加载事件
<html lang="en">
  <head>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      // 设置页面加载事件-标准写法
      $(document).ready(function () {
        $("#btn").click(() => {
          console.log("点击");
        });
      });

      // 以上页面加载事件,会简写
      $(function () {
        $("#btn").click(() => {
          console.log("点击222");
        });
      });
    </script>
  </head>
  <body>
    <button id="btn">按钮</button>
  </body>

六、DOM

查dom,$(“选择器”)

6.1 获取设置标签内容

js中

  • obj.innerHTML
  • innerText
  • value

jQuery中

  • jq对象.html(内容)
  • jq对象.text(内容)
  • jq对象.val(内容)
  <body>
    <div id="div-1">
      <span>获得设置标签内容</span>
    </div>
    <button id="btn-1">点击获得div中html</button>
    <button id="btn-2">点击获得div中text</button>
    <hr />
    <button id="btn-3">点击设置div中html</button>
    <button id="btn-4">点击设置div中text</button>
    <hr />
    <input id="input-1" />
    <button id="btn-5">点击获得input中的value</button>
    <button id="btn-6">点击设置input中的value</button>
    <hr>
    <form id="form1">
        <input name="username"><br>
        <input name="password"><br>
        <input type="submit" value="提交">
    </form>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      // 获得html标签,及内容
      $("#btn-1").click(() => {
        console.log($("#div-1").html());
      });
      // 获得纯文本内容
      $("#btn-2").click(() => {
        console.log($("#div-1").text());
      });
      // 设置html.其中有标签和属性,会解析
      $("#btn-3").click(() => {
        $("#div-1").html("<p style='color:red'>这是重新设置的内容</p>");
      });
      // 设置text,其中全部都以文本展现
      $("#btn-4").click(() => {
        $("#div-1").text("<p style='color:red'>这是重新设置的内容</p>");
      });

      // 获得输入框的值
      $("#btn-5").click(() => {
        console.log($("#input-1").val());
      });

      // 获得输入框的值
      $("#btn-6").click(() => {
        $("#input-1").val("黑发不知勤学早,白首方悔读书迟.");
      });
	  // [重要: 表单校验]
        $("#form1").submit(() => {
            var username = $("input[name=username]").val();
            var password = $("input[name=password]").val();
            if(username == "" || password == "") {
                alert("用户名或密码为空!");
                return false;
            } else {
                return true;
            }
        })
        
    </script>
  </body>

6.2 获取设置标签属性[了解]

js中

dom.属性 = 值

var a = dom.属性;

属性(attribute)操作

  • attr(name) 获得指定名字的属性
  • attr(name,value) 给指定属性设置值
  • attr(properties) 给多个属性设置值
    • properties其实是json对象
    • {key:value,key:value}
  • removeAttr(name) 移除指定属性的值
  <body>
    <input id="input-1" type="text" />
    <button id="btn-1">获得type的属性值</button>
    <button id="btn-2">设置type的属性值password</button>
    <button id="btn-3">设置type的多个属性值</button>
    <button id="btn-4">移除属性</button>

    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      $("#btn-1").click(function () {
        // 获得属性值
        console.log($("#input-1").attr("type"));
      });
      $("#btn-2").click(function () {
        // 设置属性值
        $("#input-1").attr("type", "password");
      });

      // 同时设置多个属性值
      $("#btn-3").click(function () {
        // 同时设置类型是密码框,再设置默认值
        // 使用的是json {key:"value"}
        $("#input-1").attr({ type: "password", value: "111111" });
      });

      // 移除属性
      $("#btn-4").click(function () {
        // 设置属性值,移除该属性,
        $("#input-1").removeAttr("type");
      });
    </script>
  </body>

6.3 获取设置标签样式

JQuery操作样式有两种方案

  • 给标签设置class类
  • 给标签的style设置css属性

6.3.1 设置class类

通过给标签设置/删除class类来改变样式

  • addClass(class)
  • removeClass(class)
  • toggleClass(class)
  <head>
    <title>获得设置class类</title>
    <style>
      .box1 {
        width: 100px;
        height: 100px;
        background-color: red;
      }
      .box2 {
        width: 200px;
        height: 200px;
        background-color: green;
      }
    </style>
  </head>
  <body>
    <div id="box" class="box1">块</div>
    <button id="btn-1">设置box2样式类</button>
    <button id="btn-2">移除box2样式类</button>
    <button id="btn-3">切换样式</button>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      $("#btn-1").click(() => {
        $("#box").addClass("box2");
      });

      $("#btn-2").click(() => {
        $("#box").removeClass("box2");
      });

      $("#btn-3").click(() => {
        // 切换box2
        // 当前有box2样式,那我就移除
        // 当前没有box2样式,那我就添加
        $("#box").toggleClass("box2");
      });
    </script>
  </body>

6.3.2 设置获得css属性

设置获得css属性

  • css(属性) 获得指定css属性值
  • css(属性,值) 设置指定属性和值
  • css(properties) 设置多个属性
  <body>
    <div id="box" style="background-color: red">块</div>
    <button id="btn-1">点击获得属性</button>
    <button id="btn-2">点击设置1个属性</button>
    <button id="btn-3">点击设置多个属性</button>
    <script src="./js/jquery-2.1.0.js"></script>
    <script>
      $("#btn-1").click(() => {
        // 获得指定css属性值
        console.log($("#box").css("background-color"));
      });
      $("#btn-2").click(() => {
        // 设置指定css属性值
        $("#box").css("background-color", "green");
      });
      $("#btn-3").click(() => {
        // 同时设置多个css属性
        $("#box").css({
          backgroundColor: "yellow",
          width: "200px",
          height: "200px",
        });
      });
    </script>
  </body>

七、正则表达式[重点|CV]

Regular expression

RegExp

7.1 正则表达式

  • 正则表达式是描述字符模式的对象。
  • 正则表达式用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。
  • 语法：
    • var patt=new RegExp(pattern,modifiers);
    • var patt=/pattern/modifiers;

7.2 基本知识

var reg = new RegExp("模板");
var reg = /模板/;

方括号：用于查找某个范围内的字符

表达式描述
[abc]查找方括号之间的任何字符。
[^abc]查找任何不在方括号之间的字符。
[0-9]查找任何从 0 至 9 的数字。
[a-z]查找任何从小写 a 到小写 z 的字符。
[A-Z]查找任何从大写 A 到大写 Z 的字符。
[A-z]查找任何从大写 A 到小写 z 的字符。
(red|blue|green)查找任何指定的选项。

元字符（Metacharacter）：是拥有特殊含义的字符：

元字符描述
.查找单个字符，除了换行和行结束符。
\w查找单词字符。
\W查找非单词字符。
\d查找数字。
\D查找非数字字符。
\s查找空白字符。
\S查找非空白字符。
\b匹配单词边界。
\B匹配非单词边界。
\0查找 NULL 字符。
\n查找换行符。
\f查找换页符。
\r查找回车符。
\t查找制表符。
\v查找垂直制表符。
\xxx查找以八进制数 xxx 规定的字符。
\xdd查找以十六进制数 dd 规定的字符。
\uxxxx查找以十六进制数 xxxx 规定的 Unicode 字符。

量词：用于表示重复次数的含义

量词描述
n+匹配任何包含至少一个 n 的字符串。例如，/a+/ 匹配 “candy” 中的 “a”，“caaaaaaandy” 中所有的 “a”。
n*匹配任何包含零个或多个 n 的字符串。例如，/bo*/ 匹配 “A ghost booooed” 中的 “boooo”，“A bird warbled” 中的 “b”，但是不匹配 “A goat grunted”。
n?匹配任何包含零个或一个 n 的字符串。例如，/e?le?/ 匹配 “angel” 中的 “el”，“angle” 中的 “le”。
n{X}匹配包含 X 个 n 的序列的字符串。例如，/a{2}/ 不匹配 “candy,” 中的 “a”，但是匹配 “caandy,” 中的两个 “a”，且匹配 “caaandy.” 中的前两个 “a”。
n{X,}X 是一个正整数。前面的模式 n 连续出现至少 X 次时匹配。例如，/a{2,}/ 不匹配 “candy” 中的 “a”，但是匹配 “caandy” 和 “caaaaaaandy.” 中所有的 “a”。x到正无穷
n{X,Y}X 和 Y 为正整数。前面的模式 n 连续出现至少 X 次，至多 Y 次时匹配。例如，/a{1,3}/ 不匹配 “cndy”，匹配 “candy,” 中的 “a”，“caandy,” 中的两个 “a”，匹配 “caaaaaaandy” 中的前面三个 “a”。注意，当匹配 “caaaaaaandy” 时，即使原始字符串拥有更多的 “a”，匹配项也是 “aaa”。
n{X}前面的模式 n 连续出现X 次时匹配
n$匹配任何结尾为 n 的字符串。
^n匹配任何开头为 n 的字符串。
?=n匹配任何其后紧接指定字符串 n 的字符串。
?!n匹配任何其后没有紧接指定字符串 n 的字符串。

RegExp 对象方法

方法描述
compile编译正则表达式。
exec检索字符串中指定的值。返回找到的值，并确定其位置。
test检索字符串中指定的值。返回 true 或 false。

正则表达式的使用

  • test方法：搜索字符串指定的值，根据结果并返回真或假
  • exec() 方法：检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配，则返回 null。
var patt1=new RegExp("e");
document.write(patt1.test("The best things in life are free"));

var patt1=new RegExp("e");
document.write(patt1.exec("The best things in life are free"));

7.3 演示

<body>
    数据<input id="i1" onblur="checkData()" />
    <script>
      var i1 = $("#i1");
      function checkData() {
        var val = i1.val();
        // 创建正则表达式1
        // var reg = new RegExp("[0-9]");
        // 创建正则表达式2
        var reg = /[0-9]/; // 模板1: 判断内容是否包含0-9之间任何一个数字
        var reg2 = /[a]/; // 模板2: 是否包含a
        var reg3 = /[abc]/; // 模板3: 是否包含abc中任何一个
        var reg4 = /[a-z]/; // 模板4: 是否包含a-z中任何一个
        var reg5 = /[A-Z]/; // 模板5: 是否包含A-Z中任何一个
        var reg6 = /[a-zA-Z]/; // 模板6: 是否包含大小写中任何一个
        var reg7 = /[A-z]/; // 模板7: 是否包含大小写中任何一个(因为ascll码值)
        var reg8 = /[0-9A-Za-z]/; // 模板8: 是否包含数字或者字母
        var reg9 = /[\dA-Za-z]/; // 模板9: 是否包含数字或者字母
        var reg10 = /\d+/; // 匹配至少一个数字
        var reg11 = /\d*/; // 匹配0或者多个数字
        var reg12 = /\d?/; // 匹配0或者1个,只要字符串内有1个或0个就对
        var reg13 = /^\d?$/; // 匹配整个内容中只能有0或者1个数字
        var reg14 = /^\d{4}$/; // 整个内容中只能有数字,且数字个数是4位
        var reg15 = /^\d{4,6}$/; // 整个内容中只能有数字,且数字个数是4-6位
        var reg16 = /^\d{4,}$/; // 整个内容中只能有数字,且数字个数是至少4位
        // 匹配手机号
        // 手机号开头必须是1,第二位可以是3,5,6,8,9,后续数字任意,总长得11位
        var reg17 = /^1[35689]\d{9}$/;

        // 匹配邮箱 237876779@qq.com
        // 开头是数字或者字母,其中必须包含@符号,@后可以是数字和字母,必须有.符号,后面必须是字母
        // .是正则表达式的特殊符号,需要转移
        var reg18 = /^[\dA-Za-z]+@[\da-z]+\.[a-z]+$/;
        console.log(reg18.test(val));
        // 置空
        // i1.value = "";

        // 重点是能看懂就行,会写简单模板
      }
    </script>
  </body>

7.4 练习

image-20230309170043184

image-20230309170051385

八、Ajax

async JavaScript and xml,主要是和交互,发送请求

前端总结

HTML : 展示内容

  • 掌握必要的标签
    • h1,p,img,a,ul,li,div,span
    • form,input,select,button
      • 表单系列最重要
    • table tr td
  • 合理嵌套
  • 常见先写div,div写其他东西
  • 最终能写出类似登录注册的页面即可

CSS: 美化

  • 引入方式
  • 三个选择器,美化的前提是先选到标签元素
  • 样式属性
    • color,font-size,background-color,width,height,border
    • position: relative,absolute , top,bottom,left,right
    • margin-top,margin-left

JS/JQ: 动态

  • 基本语法(变量,运算,分支,循环,函数)
  • jq
    • 选择器
    • 操作dom
      • 获得dom对象,取输入框值
    • 正则熟悉

最后利用HTML,CSS,JS/JQ写出一个页面

经典: 注册框,数据校验

 // 重点是能看懂就行,会写简单模板
  }
</script>
```

7.4 练习

[外链图片转存中…(img-csckYz5I-1700047333280)]

[外链图片转存中…(img-HDORNLbZ-1700047333281)]

八、Ajax

async JavaScript and xml,主要是和交互,发送请求

前端总结

HTML : 展示内容

  • 掌握必要的标签
    • h1,p,img,a,ul,li,div,span
    • form,input,select,button
      • 表单系列最重要
    • table tr td
  • 合理嵌套
  • 常见先写div,div写其他东西
  • 最终能写出类似登录注册的页面即可

CSS: 美化

  • 引入方式
  • 三个选择器,美化的前提是先选到标签元素
  • 样式属性
    • color,font-size,background-color,width,height,border
    • position: relative,absolute , top,bottom,left,right
    • margin-top,margin-left

JS/JQ: 动态

  • 基本语法(变量,运算,分支,循环,函数)
  • jq
    • 选择器
    • 操作dom
      • 获得dom对象,取输入框值
    • 正则熟悉

最后利用HTML,CSS,JS/JQ写出一个页面

经典: 注册框,数据校验

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

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

相关文章

李宏毅机器学习入门笔记——第三节

李宏毅机器学习入门笔记——第三节

Convolutional Neural Network&#xff08;CNN&#xff09; 卷积神经网络 padding表示超过图片矩阵的距离 stride表示步长 常见的卷积都是3*3&#xff0c;同时可以知道图片的组成就是rgb也就是三个矩阵组成 使用卷积就是共用参数&#xff0c;减少参数量&#xff0c;不需要看整张…
阅读更多...
Opengauss到Oracle增量同步， 使用debezium

Opengauss到Oracle增量同步， 使用debezium

一、概述 PG到Oracle的同步方案使用debezium kafka kafka-connect-jdbc。debezium是一款开源的变更捕获软件&#xff0c;它以kafka的connector形式运行&#xff0c;可以捕获PostgreSQL、MySQL、Oracle中的变更数据&#xff0c;保存到kafka。kafka-connect-jdbc是confluent公…
阅读更多...
第一型曲面积分的第二型曲面积分的区别与联系【从几何知识的角度思考】

第一型曲面积分的第二型曲面积分的区别与联系【从几何知识的角度思考】

此处为曲线积分------>【问题思考总结】第一型曲线积分和第二型曲线积分的区别与联系【从几何知识的角度思考】 一二型曲面积分有什么区别&#xff1f;&#xff08;了解&#xff09; 一型曲面积分&#xff1a; 由dS进行表示。可以想像&#xff0c;dS是一个面积微元&#x…
阅读更多...
MySQL数据库清理Relay_Log_File日志

MySQL数据库清理Relay_Log_File日志

背景 “Relay_Log_File” 是 MySQL 中用于复制的参数之一。在 MySQL 复制中&#xff0c;当一个服务器作为主服务器&#xff08;master&#xff09;时&#xff0c;它会将其更改写入二进制日志文件&#xff08;binary log file&#xff09;。而另一个服务器作为从服务器&#xf…
阅读更多...
阿里云99元VS腾讯云88元，双11云服务器价格战，谁胜谁负？

阿里云99元VS腾讯云88元，双11云服务器价格战，谁胜谁负？

在2023年的双十一优惠活动中&#xff0c;阿里云推出了一系列令人惊喜的优惠活动&#xff0c;其中包括99元一年的超值云服务器。本文将带您了解这些优惠活动的具体内容&#xff0c;以及与竞争对手腾讯云的价格对比&#xff0c;助您轻松选择最适合的云服务器。 99元一年服务器优…
阅读更多...
每日汇评：积极的数据可能会推动澳元/美元的上涨

每日汇评：积极的数据可能会推动澳元/美元的上涨

继 9 月份增加 6700 个就业岗位之后&#xff0c;澳大利亚 10 月份预计将增加 18000 个就业岗位&#xff1b; 失业率预计将从 3.6% 升至 3.7%&#xff0c;维持在历史低点附近&#xff1b; 澳元/美元在美元疲软的支撑下维持看涨基调&#xff0c; 其面临关键阻力位0.6520&#xff…
阅读更多...
【Linux】初识网络

【Linux】初识网络

目录 背景 协议 什么是协议 协议分层 OSI七层模型 TCP/IP模型 网络协议栈与 OS 的关系 网络传输 局域网中直接通信 数据的封装与分用 局域网通信原理 数据碰撞 跨路由器进行远端通信 IP的介绍 传输演示 背景 &#x1f9ca;一开始&#xff0c;计算机都是一台台独…
阅读更多...
Java实现拼图游戏

Java实现拼图游戏

拼图游戏是一种智力类游戏&#xff0c;玩家需要将零散的拼图块按照一定的规律组合起来&#xff0c;最终拼成完整的图案。拼图游戏的难度可以根据拼图块数量、拼图的形状、图案的复杂程度等因素来调整。这种游戏适合各个年龄层的玩家&#xff0c;能够提高大脑的观察力、空间感知…
阅读更多...
WPF xaml Command用法介绍

WPF xaml Command用法介绍

WPF (Windows Presentation Foundation) 中的命令设计模式是一种用于分离用户界面逻辑和业务逻辑的方法。在WPF中&#xff0c;这种模式通过命令接口&#xff08;如 ICommand&#xff09;实现&#xff0c;使得用户界面组件&#xff08;如按钮、菜单项等&#xff09;可以触发不直…
阅读更多...
工厂自动化中DCS软件

工厂自动化中DCS软件

概述 Monitor.Analog是新一代运行监控系统&#xff0c;是物联网时代数据驱动的智能工厂的神经中枢。通过连接到阿自倍尔专有的在线故障预测系统&#xff08;该系统利用 AI&#xff08;人工智能&#xff09;&#xff09;以及利用来自各个智能设备的监控和诊断数据的系统&#x…
阅读更多...
Unity Meta Quest 一体机开发（六）：HandGrabInteractor 和 HandGrabInteractable 知识点

Unity Meta Quest 一体机开发（六）：HandGrabInteractor 和 HandGrabInteractable 知识点

文章目录 &#x1f4d5;教程说明&#x1f4d5;HandGrabInteractor⭐HandGrabAPI⭐HandWristPoint⭐GripPoint⭐PinchPoint⭐PinchArea⭐HandGrabVisual⭐HandGrabGlow &#x1f4d5;HandGrabInteractable⭐Support Grab Type⭐Pinch Grab Rules 和 Palm Grab Rules⭐Unselect M…
阅读更多...
2023版Idea创建JavaWeb时，右键new没有Servlet快捷键选项

2023版Idea创建JavaWeb时，右键new没有Servlet快捷键选项

问题&#xff1a;右键时&#xff0c;没有创建servlet的快捷键&#xff0c;如下图&#xff1a; 解决方法&#xff1a; 1.打开idea&#xff0c;点击File>settings(设置)&#xff0c;进入settings页面&#xff0c;如下 从上图中的Files选项中没看到有servlet选项&#xff0c;…
阅读更多...
拿到信创天翼云电脑账号后，我又傻眼了...

拿到信创天翼云电脑账号后，我又傻眼了...

在《面向国产系统的 App 发布&#xff0c;含泪总结》中&#xff0c;我就吐槽过信创产品的不靠谱。用户购买一台终端&#xff0c;都没法用&#xff0c;得经历复杂的账号申请。 紧催慢催&#xff0c;等待了半个月之后&#xff0c;今天终于拿到了账号。然而&#xff0c;满怀期待登…
阅读更多...
人工智能+游戏 会带来什么

人工智能+游戏 会带来什么

“人工智能游戏” 写在前面 随着人类生活水平的日益提高&#xff0c;游戏正在为越来越多的人们带去欢乐。同时&#xff0c;作为21世纪新兴科学技术的人工智能&#xff0c;也正在研究人员的努力下不断向前突破。那么&#xff0c;这两列高速前进的“火车”能否接轨并行呢&#…
阅读更多...
【数据结构】线段树（点修区查）

【数据结构】线段树（点修区查）

数据结构-线段树&#xff08;点修区查&#xff09; 前置知识 分治递归二叉树 思路 我们需要维护一个支持单点修改&#xff0c;区间查询的数据结构&#xff0c;并且要求在线&#xff0c;一般使用线段树解决。 线段树是一个二叉树形的数据结构。 线段树的思想很简单&#xff0c…
阅读更多...
算法学习打卡day45｜动态规划：股票问题总结

算法学习打卡day45｜动态规划：股票问题总结

Leetcode股票问题总结篇 动态规划的股票问题一共六道题&#xff0c;买卖股票最佳时机和买卖股票手续费都是一个类型的问题&#xff0c;维护好买入和卖出两个状态即可&#xff0c;方法一摸一样。而冷冻期也差不多就是状态多了点&#xff0c;买入、保持卖出、当日卖出、以及冷冻期…
阅读更多...
OpenGL_Learn12（光照）

OpenGL_Learn12（光照）

续OpenGL_Learn11&#xff08;光照&#xff09;-CSDN博客 1. 镜面高光 和漫反射光照一样&#xff0c;镜面光照也决定于光的方向向量和物体的法向量&#xff0c;但是它也决定于观察方向&#xff0c;例如玩家是从什么方向看向这个片段的。镜面光照决定于表面的反射特性。 我们通…
阅读更多...
IDEA没有Add Framework Support解决办法

IDEA没有Add Framework Support解决办法

点击File—>Settings 点击第一个设置快捷键 点击apply和ok即可 我们要点击一下项目&#xff0c;再按快捷键ctrlk 即可
阅读更多...
LeetCode（15）分发糖果【数组/字符串】【困难】

LeetCode（15）分发糖果【数组/字符串】【困难】

目录 1.题目2.答案3.提交结果截图 链接&#xff1a; 135. 分发糖果 1.题目 n 个孩子站成一排。给你一个整数数组 ratings 表示每个孩子的评分。 你需要按照以下要求&#xff0c;给这些孩子分发糖果&#xff1a; 每个孩子至少分配到 1 个糖果。相邻两个孩子评分更高的孩子会获…
阅读更多...
Unity反编译：IL2CPP 打包输出的cpp文件和dll(程序集)位置、Mono打包输出的dll(程序集)位置

Unity反编译：IL2CPP 打包输出的cpp文件和dll(程序集)位置、Mono打包输出的dll(程序集)位置

目录 如题&#xff1a;IL2CPP 打包输出的cpp文件和dll位置(并不会出现在APK里) 如题&#xff1a;Mono打包输出的dll位置 校验平台&#xff1a;Android 如题&#xff1a;IL2CPP 打包输出的cpp文件和dll位置(并不会出现在APK里) Unity Assets同级目录下 Temp/StagingArea/Il2…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站