前端基础4——jQuery

news2025/1/27 13:09:25

文章目录

  • 一、基本了解
    • 1.1 导入jQuery库
    • 1.2 基本语法
    • 1.3 选择器
  • 二、操作HTML
    • 2.1 隐藏和显示元素
    • 2.2 获取与设置内容
    • 2.3 获取、设置和删除属性
    • 2.4 添加元素
    • 2.5 删除元素
    • 2.6 设置CSS样式
  • 三、jQuery Ajax
    • 3.1 基本语法
    • 3.2 回调函数
    • 3.3 常用HTTP方法
    • 3.4 案例一
      • 3.4.1 准备工作
      • 3.4.2 准备一个api接口地址
      • 3.4.3 定义Ajax执行逻辑
    • 3.5 案例二：提交表单
    • 3.6 案例三：数据表格

一、基本了解

概念：

  • jQuery 是一个 JavaScript 库。极大地简化了 JavaScript 编程，例如JS原生代码几十行实现的功能，jQuery可能一两行就可以实现，因此得以广泛应用，官方网站。
  • 使用jQuery可以简化代码编写，解决浏览器的兼容性。

发行版本：

  • 1.x：常用版本，运维人员已够使用。
  • 2.x，3.x：除非特殊要求，一般用的少。

1.1 导入jQuery库

  • jQuery代码编写位置与JS位置一样，但需要先head标签里引入jquery.min.js文件。

下载地址：

  • https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js
  • https://cdn.bootcdn.net/ajax/libs/jquery/2.2.4/jquery.min.js
  • https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js

1.下载到本地，引用本地文件方式。
在这里插入图片描述
2.直接指定jquery库文件网址。
在这里插入图片描述

1.2 基本语法

  • 语法格式：$(selector).action()
  • $：代表jQuery本身，只要是使用jQuery语法，就必须使用$符号。
  • (selector)：选择器，查找HTML元素。
  • action()：对元素的操作，和js使用方式大致相同。

1.3 选择器

名称语法示例
标签选择器element$(“h2”) 选取所有h2元素
类选择器.class$(“.title“) 选取所有class为title的元素
ID选择器#id$(“#title”) 选取id为title的元素
并集选择器selector1,selector2,…$(“div,p,.title”) 选取所有div、p和拥有class为title的元素
属性选择器$(“input[name=‘username’]”) 选取input标签名为username的元素。
$(“[href=‘#’]”) 选取href值等于“#”的元素

二、操作HTML

2.1 隐藏和显示元素

  • hide() ：隐藏某个元素。
  • show() ：显示某个元素。
  • toggle() ：hide()和show()方法之间切换。

1.设置三个按钮，点击”隐藏“按钮，则隐藏标签内容；点击"显示"按钮，则显示标签内容。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<p id="demo">我的名字是：卿君</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
<button id="toggle" type="button">切换</button>

<script type="text/javascript">
    $("#hide").click(function () {
        $("p").hide();
    });
    $("#show").click(function () {
        $("p").show();
    });
    $("#toggle").click(function () {
        $("p").toggle();
    })
</script>
</body>
</html>

2.查看效果。
在这里插入图片描述

2.2 获取与设置内容

  • text()：设置或返回所选元素的文本内容。
  • html()：设置或返回所选元素的HTML内容。
  • val()：设置或返回表单字段的值。

1.对比文本内容和html内容区别。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>

<p id="txt">
    演讲主题：
    <b>正文</b>。
</p>
<button type="button" id="1">显示文本</button>
<button type="button" id="2">显示HTML</button>
<p id="3"></p>

<script type="text/javascript">
    $("#1").click(function () {
        x = $("#txt").text();   //打印id=txt标签的文本内容。
        $("#3").text(x);   //将获取的内容传入id=3的标签。
        $("#3").text(x).css("color","red") //不会解析b标签
    });
    $("#2").click(function () {
        x = $("#txt").html(); //获取html内容。
        $("#3").html(x).css("color","blue") //会解析b标签，.html()设置
    })
</script>
</body>
</html>

在这里插入图片描述
在这里插入图片描述

2.设置返回表单字段的值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<h1>欢迎访问运维管理系统</h1>
用户名：<input type="text" id="uname" name="username"><br>
密码：<input type="password" id="pwd" name="password"><br>
<button type="button" id="btn">显示输入内容</button>
<p id="demo"></p>
<script type="text/javascript">
    $("#btn").click(function () {
        a = $("#uname").val();
        b = $("#pwd").val();
        $("#demo").text(a + ',' + b).css("color","red")
    })
</script>
</body>
</html>

在这里插入图片描述

2.3 获取、设置和删除属性

  • attr()：设置或返回所选元素的属性值。
  • removeAttr()：删除属性值。

1.获取元素属性值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<a href="http://www.baidu.com" id="a1">百度一下</a><br>
<button type="button" id="btn">查看CSS属性值</button>
<p id="demo"></p>
<script type="text/javascript">
    $("#btn").click(function () {
        x = $("#a1").attr("href"); //获取属性值
        $("#demo").text(x) //将属性值作为内容设置元素
    })
</script>
</body>
</html>

在这里插入图片描述
2.设置超链接，从第一个网址跳转到第二个网址。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<a href="http://www.baidu.com" id="a1">百度一下</a><br>
<button type="button" id="btn">查看CSS属性值</button>
<p id="demo"></p>
<script type="text/javascript">
    $("#btn").click(function () {
        x = $("#a1").attr("href","http://www.redis.cn/"); //从百度跳转到redis官网。
    })
</script>
</body>
</html>

3.删除属性值。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<a href="http://www.baidu.com" id="a1">百度一下</a><br>
<button type="button" id="btn">删除CSS属性值</button>
<p id="demo"></p>
<script type="text/javascript">
    $("#btn").click(function () {
        x = $("#a1").removeAttr("href");   //删除href属性。
    })
</script>
</body>
</html>

在这里插入图片描述

2.4 添加元素

  • append() 在被选中元素的结尾插入内容。
  • prepend() 在被选中元素的开头插入内容。
  • after() 在被选中元素之后插入内容。
  • before() 在被选中元素之前插入内容。

1.示例代码。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div id="main">
    <p>我爱中华</p>
    <p>大好河山</p>
    <p>华夏九州</p>
</div>
<button type="button" id="wenben1">追加文本</button>
<button type="button" id="wenben2">开头新增文本</button>
<button type="button" id="wenben3">追加段落</button>
<script type="text/javascript">
    $("#wenben1").click(function () {
        $("#main").append("追加的文本内容");
    })
    $("#wenben2").click(function () {
        $("#main").prepend("新增的文本内容");
    })
    $("#wenben3").click(function () {
        $("#main").append("<p>追加的段落</p>");
    })
</script>
</body>
</html>

2.查看效果。
在这里插入图片描述

2.5 删除元素

  • remove()：删除被选元素及子元素。
  • empty()：清空被选元素（删除下面所有子元素）。

1.删除div标签内容，包括其下所有的标签内容。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div id="main">
    <p>我爱中华</p>
    <p>大好河山</p>
    <p>华夏九州</p>
</div>

<button type="button" id="wenben1">追加文本</button>
<button type="button" id="wenben2">开头新增文本</button>
<button type="button" id="wenben3">追加段落</button>
<button type="button" id="wenben4">删除</button>
<script type="text/javascript">
    $("#wenben1").click(function () {
        $("#main").append("追加的文本内容");
    })
    $("#wenben2").click(function () {
        $("#main").prepend("新增的文本内容");
    })
    $("#wenben3").click(function () {
        $("#main").append("<p>追加的段落</p>");
    })
    $("#wenben4").click(function () {
        $("#main").remove();
    })
</script>
</body>
</html>

在这里插入图片描述
2.隐藏div标签内容。
在这里插入图片描述

2.6 设置CSS样式

  • css() 设置或返回样式属性（键值）。
  • addClass() 向被选元素添加一个或多个类样式。
  • removeClass() 从被选元素中删除一个或多个类样式。
  • toggleClass() 对被选元素进行添加/删除类样式的切换操作。

1.直接设置样式属性。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div id="main">
    <p>我爱中华</p>
    <p>大好河山</p>
    <p>华夏九州</p>
</div>
<button type="button" id="ziti">修改字体大小</button>    //点击按钮修改字体大小。
<button type="button" id="color">修改字体颜色和样式</button>    //点击按钮修改字体颜色和样式。

<script type="text/javascript">
    $("#ziti").click(function () {
        $("#main").css("font-size","6px");
    })
    $("#color").click(function () {
        $("#main").css({"color":"blue","font-style":"italic"});
    })
</script>
</body>
</html>

在这里插入图片描述
2.引用类修改样式属性。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <style>    //定义通用属性样式。
        .mm {
        color: orange;
        font-size: 10px;
        }
    </style>
</head>
<body>
<div id="main">
    <p>我爱中华</p>
    <p>大好河山</p>
    <p>华夏九州</p>
</div>
<button type="button" id="ziti">修改字体颜色和大小</button>  //点击按钮修改字体颜色。
<script type="text/javascript">
    $("#ziti").click(function () {
        $("#main").addClass("mm");
    })
</script>
</body>
</html>

在这里插入图片描述
3.删除属性样式。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ测试</title>
    <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <style>    //定义通用属性样式。
        .mm {
        color: orange;
        font-size: 10px;
        }
    </style>
</head>
<body>
<div id="main" class="mm">
    <p>我爱中华</p>
    <p>大好河山</p>
    <p>华夏九州</p>
</div>
<button type="button" id="ziti">删除字体属性</button>   //点击按钮去除原本的字体颜色。
<script type="text/javascript">
    $("#ziti").click(function () {
        $("#main").removeClass("mm");
    })
</script>
</body>
</html>

在这里插入图片描述

三、jQuery Ajax

概念：

  • Ajax（Asynchronous JavaScript And XML，异步JavaScript和XML），AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。例如在不刷新页面的情况下查询数据、登录验证等。
  • 可以减少带宽、服务器负载；提高用户体验。
  • 使用场景：网页局部刷新

工作流程：

  1. 浏览器第一次访问网站一个页面时，Web服务器处理完后会以消息体方式返回浏览器，浏览器自动解析HTML内容。
  2. 当有局部有新数据需要更新时，Ajax会在背后去请求服务端拿到数据，再交给js处理html，最后渲染填充到那个div板块。此时就达到不需要刷新网页，就可以加载刷新局部数据的功能。
    在这里插入图片描述

3.1 基本语法

  • jQuery Ajax主要使用$.ajax()方法实现，用于向服务端发送HTTP请求。
  • 基本语法：$.ajax([settings]);
  • settings 是$.ajax ( )方法的参数列表，用于配置 Ajax 请求的键值对集合。
参数类型描述
urlstring发送请求的地址，默认为当前页地址
typestring请求方式，默认为GET
dataobejct、array、string发送到服务器的数据
dataTypestring预期服务器返回的数据类型，包括JSON、XML、text、HTML等
contentTypestring发送信息至服务器时内容编码类型。默认值: “application/xwww-form-urlencoded”。
timeoutnumber设置请求超时时间
globalBoolean表示是否触发全局Ajax事件，默认为true
headersobejct设置请求头信息
asyncBoolean默认true，所有请求均为异步请求。设置false发送同步请求

3.2 回调函数

  • 回调函数：参数引用一个函数，并将数据作为参数传递给该函数。
  • jqXHR：一个XMLHttpRequest对象
参数函数格式描述
beforeSendfunction(jqXHR,object)发送请求前调用的函数，例如添加自定义HTTP头
successfunction(data, String textStatus,jqXHR)请求成功后调用的函数，参数data：可选，由服务器返回的json数据
errorfunction(jqXHR,String textStatus,errorThrown)请求失败时调用的函数
completefunction(jqXHR, String textStatus)请求完成后（无论成功还是失败）调用的函数

3.3 常用HTTP方法

  • HTTP方法：向服务器提交数据，服务器根据对应方法操作。
HTTP方法数据处理说明
POST新增新增一个资源
GET获取取得一个资源
PUT更新更新一个资源
DELETE删除删除一个资源

3.4 案例一

3.4.1 准备工作

1.创建好一个Django基础项目。

###########################################################
1.项目根url路由规则。
from django.urls import path,re_path
from qingjun import views
urlpatterns = [
    re_path('^$',views.qingjun)
]
###########################################################
2.创建一个应用模块qingjun。
python manage.py startapp qingjun
###########################################################
3.qingjun.views.py视图文件。
from django.shortcuts import render
def qingjun(request):
    return render(request,'index.html')
###########################################################
4.定义index.html模板。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>平台首页</title>
    <script src="/static/js/jquart.min.js"></script>
</head>
<body>
首页
</body>
</html>
###########################################################
5.导入jquery库文件，存放目录/static/js/jquart.min.js。
库文件下载地址：https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js
###########################################################
6.更改django默认静态文件地址，settings.py文件末尾追加以下内容。
STATICFILES_DIRS = (
    os.path.join(BASE_DIR,'static'),
)

在这里插入图片描述

3.4.2 准备一个api接口地址

1.添加代码。
在这里插入图片描述
2.查看效果。
在这里插入图片描述

3.4.3 定义Ajax执行逻辑

1.html文件中写js脚本，使用jQuery Ajax编写。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>平台首页</title>
    <script src="/static/js/jquart.min.js"></script>
</head>
<body>
首页
<p id="a">这是Ajax请求的数据</p>
<script>
    $.ajax({
        type: "GET",
        url: "/user_api/",   //ajax请求地址。
        success: function (abc) {        //abc位置参数，是服务端返回的json数据。
            console.log(abc);
            $("#a").text(abc)   //将请求结果打印到p标签显示。
        },
        error: function () {
            alert("请求错误")
        }
    })
</script>
</body>
</html>

2.查看结果。
在这里插入图片描述

3.5 案例二：提交表单

  • 新增数据，Ajax向后端API发起数据。

1.项目url路由规则代码。

from django.urls import path,re_path
from qingjun import views
urlpatterns = [
    re_path('server/', views.server),
]

2.应用qingjun中的视图函数server代码。

from django.shortcuts import render
from django.http import JsonResponse
def server(request):
    if request.method == "GET":
        return render(request, 'server.html')
    elif request.method == "POST":
        print(request.POST)
        try:
            pass
            # 获取提交的字段，使用模型类入库。
            code = 0
            msg = "数据库添加成功！"
        except Exception:
            code = 1
            msg = "数据库添加失败！"
        result = {'code': code, 'msg': msg}
        return JsonResponse(result)

3.html模板内容。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新增服务器</title>
    <script src="/static/js/jquart.min.js"></script>
</head>
<body>
<h1>添加服务器信息</h1>

##默认from表单是通过submit提交按钮来触发事件进行提交数据，默认提交到action的url地址，为空则是当前页面。
##若要使用from表单的submit提交按钮，需要在from标签中添加参数onsubmit="return false，可以去掉触发提交事件。
##Ajax提交from表单会重复提交url，添加#表示不触发from提交事件。
<form action="#" method="post">   //创建一个post提交表单。
    {% csrf_token %}
    主机名：<input type="text" name="hostname"><br>
    IP地址：<input type="text" name="ip"><br>
    操作系统：<input type="text" name="os"><br>
{#    <input type="submit" value="提交" id="btn"> onsubmit="return false" #}
    <button type="button" id="btn">提交</button>
</form>

<p id="notice"></p>
<script>
    $("#btn").click(function () {
        // 1.先获取表单中所有值。
        var hostname = $("input[name='hostname']").val();  //通过jquery的属性选择器获取表单输入的值。
        var ip = $("input[name='ip']").val();
        var os = $("input[name='os']").val();
        var csrf_token = $("input[name='csrfmiddlewaretoken']").val();
        // 2.将表单的值统一放到对象。
        data = {'hostname': hostname, 'ip': ip, 'os': os, 'csrfmiddlewaretoken':csrf_token};
        // 3.通过ajax将这个对象提交到服务端数据接口。
        $.ajax({
            type: "POST",
            url: "/server/",  //数据接口
            data: data,
            success: function (result) {
                if(result.code == 0) {
                    $("#notice").text(result.msg).css("color", "blue")
                } else if(result.code == 1){
                    $("#notice").text(result.msg).css("color", "red")
                }
            },
            error: function(){
                alert("服务器异常！")
            }
        })
    });
</script>
</body>
</html>

4.测试效果。
在这里插入图片描述

在这里插入图片描述

3.6 案例三：数据表格

  • 批量删除，Ajax向后端API发送要删除的数据ID。

1.项目url路由规则代码。

from django.urls import path,re_path
from qingjun import views
urlpatterns = [
   re_path('server_table/', views.server_table),
]

2.应用qingjun中的视图函数server代码。

from django.shortcuts import render
from django.http import JsonResponse
def server_table(request):
    if request.method == "GET":
        return render(request,'server_table.html')
    elif request.method == "POST":
        ids = request.POST.get("ids")
        try:
            # a = b
            for i in ids.split(','):
                print(i)
                # 基于ID，使用模型类从数据库中删除
            code = 0
            msg = "删除数据成功！"
        except Exception:
            code = 1
            msg = "删除数据失败！"
        result = {'code': code, 'msg': msg}
        return JsonResponse(result)

3.html模板内容。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>服务器列表</title>
    <script src="/static/js/jquart.min.js"></script>
</head>
<body>
{% csrf_token %}
<table border="1">
    <thead>
        <tr>
            <th><input type="checkbox" id="selectAll">全选</th>
            <th>主机名</th>
            <th>IP</th>
            <th>操作系统</th>
        </tr>
    </thead>
    <tbody id="tb">
        <tr>
            <td><input type="checkbox" value="1" name="id"></td>
            <td>test1</td>
            <td>192.168.1.10</td>
            <td>CentOS7</td>
        </tr>
        <tr>
            <td><input type="checkbox" value="2" name="id"></td>
            <td>test2</td>
            <td>192.168.1.11</td>
            <td>CentOS7</td>
        </tr>
        <tr>
            <td><input type="checkbox" value="3" name="id"></td>
            <td>test3</td>
            <td>192.168.1.11</td>
            <td>CentOS7</td>
        </tr>
    </tbody>
</table>

<button id="btn">批量删除（发送AJAX请求）</button>
<p id="notice"></p>

<script>
    $("#selectAll").click(function(){
        var all_num = $("#tb input").length; // 获取总行数
        var select_num = $("#tb input:checked").length; // 获取选择的数量
        if(all_num == select_num) { // 如果等于说明是全选，再点击的目的是取消全选
            $("#tb input").prop("checked",false)  // 设置未选中
        } else {
            $("#tb input").prop("checked",true)  // 设置未选中
        }
        // 获取当前选中的input值
        var check = $("#tb input:checked"); //获取是一个数组，check[0].value获取第一个input值
        // 将选中的input的id放到数组
        var ids = new Array()
        for(var i=0;i<check.length;i++) {
        // for(i in check){
            console.log(check[i].value);
            ids.push(check[i].value);
            {#ids[i] = check[i].value#}
        }
        ids = ids.join(',');
        console.log(ids);
        var csrf_token = $("input[name='csrfmiddlewaretoken']").val();
        // 2.将表单的值统一放到对象
        data = {'ids': ids, 'csrfmiddlewaretoken':csrf_token};
        // 3.通过ajax将这个对象提交到服务端数据接口
    });
    $("#btn").click(function(){
        $.ajax({
            type: "POST",
            url: "/server_table/",  //数据接口
            data: data,
            success: function (result) {
                if(result.code == 0) {
                    $("#notice").text(result.msg).css("color", "blue")
                } else if(result.code == 1){
                    $("#notice").text(result.msg).css("color", "red")
                }
            },
            error: function(){
                alert("服务器异常！")
            }
        })
    })
</script>
</body>
</html>

4.查看效果。
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

SpringBoot完整项目部署流程(软件安装-前后端部署)

SpringBoot完整项目部署流程(软件安装-前后端部署)

SpringBoot完整项目部署流程 安装Jdk 使用XTFP工具将jdk的二进制发布包上传到Linux 解压安装包 tar -zxvf jdk-8u171-linux-x64.tar.gz -C /usr/local解压完毕 配置环境变量&#xff0c;使用vim命令修改 /etc/profile文件&#xff0c;在文件末尾加入如下配置 JAVA_HOME/usr…
阅读更多...
LeetCode 45题：跳跃游戏

LeetCode 45题：跳跃游戏

题目 给定一个长度为 n 的 0 索引整数数组 nums。初始位置为 nums[0]。 每个元素 nums[i] 表示从索引 i 向前跳转的最大长度。换句话说&#xff0c;如果你在 nums[i] 处&#xff0c;你可以跳转到任意 nums[i j] 处: 0 < j < nums[i] i j < n 返回到达 nums[n - …
阅读更多...
ctfshow—萌新赛—给她

ctfshow—萌新赛—给她

0x00 前言 CTF 加解密合集CTF Web合集网络安全知识库 文中工具皆可关注 皓月当空w 公众号 发送关键字 工具 获取 0x01 题目 0x02 Write Up 首先看到访问页面&#xff0c;正常情况下这种都是sql注入&#xff0c;尝试发现被转义了 尝试无果之后&#xff0c;扫描目录&#xff…
阅读更多...
zookeeper 理论合集

zookeeper 理论合集

目录 系统背景 集群结构 多个节点之间的角色 节点的状态 为什么引入 Observer 存储结构 ZNode 节点结构 ZNode 创建类型 内存数据存储 数据持久化 zookeeper 的容量大小 数据同步 消息广播 崩溃恢复 如何保证顺序一致性 核心流程 Leader 选举流程 脑裂问题 …
阅读更多...
Python基础篇（17）：模块与包

Python基础篇（17）：模块与包

一、as 关键字的使用 1、as 关键字的作用&#xff1a;给导入的模块取别名 import 测试1 as Test_1 import 测试2 as Test_2Test_1.say_hello() Test_2.say_hello() 二、if __name__ __main__ 1、作用 测试当前模块所编写的代码块&#xff0c;根据业务自主选择需要运行的代…
阅读更多...
李宏毅hw1_covid19预测_代码研读+想办法降低validation的loss(Kaggle目前用不了)

李宏毅hw1_covid19预测_代码研读+想办法降低validation的loss(Kaggle目前用不了)

1.考虑调整这个neural network的结构尝试让这个loss降低 &#xff08;1&#xff09;Linear(inputdim,64) - ReLU-Linear(64,1), loss0.7174 &#xff08;2&#xff09;Linear(inputdim,64) - ReLU-Linear(64,64) -ReLU-Linear(64,1),loss 0.6996 &#xff08;3&#xff09;这…
阅读更多...
spring boot + Consul 示例 (Kotlin版)

spring boot + Consul 示例 (Kotlin版)

文章目录 1.docker 安装consul2.创建基于springboot的client2.1 依赖版本2.2 pom.xml2.3 启动类2.4 application.properties 3 搭建完成4. 总结 1.docker 安装consul docker-compose.yaml version: "3"services:consul:image: consul:1.4.4container_name: consule…
阅读更多...
DevEco Studio 介绍、下载及安装

DevEco Studio 介绍、下载及安装

DevEco Studio 简介 HUAWEI DevEco Studio面向App、HAG快服务、IoT智能硬件设备3类开发者&#xff0c;提供设计、编码、编译、调测和云端测试等端到端一站式服务。一次开发&#xff0c;多端部署&#xff1a;支持18N全场景泛终端软件应用和服务开发开放能力一站集成&#xff1a…
阅读更多...
5 大虚拟数字人工具：视频内容创作的未来

5 大虚拟数字人工具：视频内容创作的未来

人工智能&#xff08;AI&#xff09;给视频内容创作领域带来了一场革命。这一领域的显着进步之一是人工智能生成的会说话的化身的出现&#xff0c;它已经成为制作高质量视频的游戏规则改变者&#xff0c;而无需专业演员或昂贵的视频编辑软件。在这篇博文中&#xff0c;我们将深…
阅读更多...
上半年净利润同比改善22.18%，赛力斯的韧性从何而来？

上半年净利润同比改善22.18%，赛力斯的韧性从何而来？

2023年上半年&#xff0c;伴随特斯拉一声全球大降价&#xff0c;新能源汽车行业价格混战拉开帷幕&#xff0c;车企业绩纷纷承压。“卷”风盛行之下&#xff0c;谁抗住了压力&#xff1f; 8月30日&#xff0c;赛力斯发布了中期业绩报告。根据财报&#xff0c;2023年上半年&…
阅读更多...
10. selenium API （二）

10. selenium API （二）

目录 1. 多层框架/窗口定位 2. 下拉框处理 2.1 前端界面 2.2 代码 3. 针对 alert 弹窗进行操作 3.1 前端界面 3.2 代码 4. 文件提交 4.1 前端界面 4.2 代码 5. 显示等待 6. 操作浏览器滚动条 7. 截图 8. 浏览器关闭 9. 窗口切换 在上篇文章中&#xff0c;我们学…
阅读更多...
Laravel 集合的使用 集合的常用方法 模型的数据集合 ⑩

Laravel 集合的使用 集合的常用方法 模型的数据集合 ⑩

作者 : SYFStrive 博客首页 : HomePage &#x1f4dc;&#xff1a; THINK PHP &#x1f4cc;&#xff1a;个人社区&#xff08;欢迎大佬们加入&#xff09; &#x1f449;&#xff1a;社区链接&#x1f517; &#x1f4cc;&#xff1a;觉得文章不错可以点点关注 &#x1f44…
阅读更多...
【Linux】文件

【Linux】文件

Linux 文件 什么叫文件C语言视角下文件的操作文件的打开与关闭文件的写操作文件的读操作 & cat命令模拟实现 文件操作的系统接口open & closewriteread 文件描述符进程与文件的关系重定向问题Linux下一切皆文件的认识文件缓冲区缓冲区的刷新策略 stuout & stderr 什…
阅读更多...
学信网学历电子注册备案表 下载方法

学信网学历电子注册备案表 下载方法

如果你需要成人高考的专升本 那么就会需要 学信网学历电子注册备案表 全称叫 教育部学历证书电子注册备案表 是学信网依托全国高等教育学生信息数据库&#xff0c;对学生的学历信息提供的在线验证报告&#xff0c;是我们验证学历真伪的一份报告 学历电子注册备案表在 考研、考…
阅读更多...
shell脚本中时间的编写规范20230902

shell脚本中时间的编写规范20230902

背景&#xff1a;经常写shell&#xff0c;但是很多种时间格式规范真是记不住哈&#xff0c;&#x1f604;&#xff0c;索性记录一下 一、 获取-年 下面的这两种写法都成 year$(date "%Y") yeardate "%Y"echo -e "测试输出 年: ${year}"输出结…
阅读更多...
springboot web开发springmvc自动配置原理

springboot web开发springmvc自动配置原理

前言 我们也知道springboot启用springmvc基本不用做什么配置可以很方便就使用了但是不了解原理,开发过程中遇到点问题估计就比较头疼,不管了解的深不深入,先巴拉一番再说… 下面我们先看看官网…我的版本是2.3.2版本,发现官网改动也比较大…不同版本自己巴拉下吧,结构虽然变化…
阅读更多...
PMD代码检查：过长的变量名字（LongVariable）

PMD代码检查：过长的变量名字（LongVariable）

https://docs.pmd-code.org/pmd-doc-6.55.0/pmd_rules_java_codestyle.html#longvariable 属性、正式变量、局部变量的名字如果太长&#xff0c;会使代码难理解。例如&#xff0c;下面的代码报违反项&#xff1a; 可以通过属性minimum配置报违反规则的最小长度&#xff08;默…
阅读更多...
qt.qpa.plugin:找不到Qt平台插件“wayland“|| （下载插件）Ubuntu上解决方案

qt.qpa.plugin:找不到Qt平台插件“wayland“|| （下载插件）Ubuntu上解决方案

相信大家也都知道这个地方应该做什么&#xff0c;当然是下载这个qt平台的插件wayland,但是很多人可能不知道怎么下载这个插件。 那么我现在要说的这个方法就是针对这种的。 sudo apt install qtwayland5完事儿了奥兄弟们。 看看效果 正常了奥。
阅读更多...
总结ADX指标交易的好处

总结ADX指标交易的好处

股神巴菲特从一个穷小子变成世界富豪&#xff0c;而闻名世界。anzo capital昂首资本以为这辈子再也不会和巴菲特产生任何交集&#xff0c;直到我看了巴菲特的发家史&#xff0c;才发现原来我们都使用过ADX指标盈利过&#xff0c;下面anzo capital昂首资本就总结一下使用ADX指…
阅读更多...
如何大批量、低成本获取精准客户

如何大批量、低成本获取精准客户

身为一个企业或广告投放的决策人&#xff0c;当你在做每一次营销决策的时候&#xff0c;一定会回答一个问题&#xff1a;如何把产品卖给对的人&#xff1f; 目前经济形势下&#xff0c;消费活跃&#xff0c;但是获客却越来越难&#xff0c;在大数据弥漫的今天&#xff0c;我们仿…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023