三、jQuery的API （三）- 文档筛选、文档处理模块

最新推荐文章于 2024-09-18 10:06:00 发布
最新推荐文章于 2024-09-18 10:06:00 发布
阅读量139 收藏
点赞数
分类专栏： WEB基础-jQuery 文章标签： jquery html html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45602227/article/details/120002533
版权

一、文档筛选模块 – DOM查询

	
	+++ 筛选
			在jQuery对象内部的元素中找出部分匹配的元素，并封装为新的jQuery对象返回。
	
	+++ 查找
			由jQuery对象内部的元素查找其他的子孙/兄弟/父母元素，并封装为新的jQuery对象返回
1.1 过滤

在一个jQuery对象中找出所有的匹配元素，并封装为新的jQuery实例对象返回

	
		筛选
			first()   筛选出第一个元素
			last() 	  筛选出最后一个元素
			eq(index|-index)  筛选出指定索引值元素
			
			filter(selector|ele) 在jQuery对象内部的元素中筛选出与指定表达式匹配的元素
			not(selector|ele)    在jQuery对象内部的元素中删除与指定表达式匹配的元素
			
			slice(start,[end]) 截取jQuery对象内部的元素
			
			has(selector|ele)  在jQuery对象内部的元素中筛选出包含指定后代的元素

			hasClass(class)    判断元素是否有class属性，返回true或false
1）first()、last() 、eq(index|-index)
<body>

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <span>5</span>
    </ul>

    <ul>
        <li>sss</li>
        <li>222</li>
    </ul>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");
    
    //ul下li标签的第一个
    $("ul>li").first().css("background-color","red")

    //ul下li标签的最后一个
    $("ul>li").last().css("background-color","red")

    //ul下li标签的第二个
    $("ul>li").eq(1).css("background-color","red")


</script>

在这里插入图片描述

>>>>>> 注意：如果匹配元素有多个，则可能会依次匹配多个返回集合
>>>>>> 注意：筛选与查找返回jQuery对象，可以流式过滤
2）filter(selector|ele) 、not(selector|ele)
>>>>>> 基础使用
<body>

    <ul>
        <li title="a"><span>3</span></li>
        <li title="box">2</li>
        <li><span>3</span></li>
        <li title="box">4</li>
        <span>5</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");

    //ul下li标签中title=box的元素
    $("ul>li").filter("[title=box]").css("background-color","red");

    //ul下li标签中title!=box的元素
    //方式一
    $("ul>li").not("[title=box]").css("background-color","blue");
    //方式二
    $("ul>li").filter("[title!=box]").css("background-color","blue");

</script>

在这里插入图片描述

>>>>>> 流式使用
<body>

    <ul>
        <li title="a"><span>3</span></li>
        <li title="box">2</li>
        <li><span>3</span></li>
        <li title="box">4</li>
        <span>5</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");

    //ul下li标签中有title属性但是title!=box的元素
    $("ul>li").filter("[title]").not("[title=box]").css("background-color","blue");

</script>

在这里插入图片描述

3）slice(start,[end]) 截取
<body>

    <ul>
        <li title="a"><span>3</span></li>
        <li title="box">2</li>
        <li><span>3</span></li>
        <li title="box">4</li>
        <span>5</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");


    //截取集合中第一个元素
    $("ul>li").slice(0,1).css("background-color","blue")

    //截取集合元素，从第三个开始
    $("ul>li").slice(2).css("background-color","red")



</script>

在这里插入图片描述

4）has(selector|ele)
<body>

    <ul>
        <li title="a"><span>3</span></li>
        <li title="box">2</li>
        <li><span>3</span></li>
        <li title="box">4</li>
        <span>5</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");


    //ul下li元素中含有span后台的元素
    $("ul>li").has("span").css("background-color","blue")



</script>

在这里插入图片描述

5）hasClass(class)
<body>

    <ul>
        <li><span>3</span></li>
        <li>2</li>
        <li class="ccc"><span>3</span></li>
        <li>4</li>
        <span>5</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    $lis=$("ul>li");

    $("ul>li").each(function(){

        var flag=$(this).hasClass("ccc");
        if(flag){
            $(this).css("background-color","red")
        }
    })



</script>

在这里插入图片描述

1.2 查找

由jQuery对象内部的元素查找其他的子孙/兄弟/父母元素，并封装为新的jQuery对象返回


		查找
			
			+++ 查找父元素
					parent([expr])  查找所有匹配元素的唯一父元素
					parents([expr]) 查找所有匹配元素的所有祖先元素
					offsetParent()  查找第一个匹配元素用于定位的父节点。

			+++ 查找子元素
				
					children([selector])  查找所有匹配元素的的子元素（不含后代元素）
					find(selector)		  查找所有匹配元素的后代元素


			+++ 查找兄弟元素
					prev([expr])    查找所有匹配元素的上一个兄弟元素
					next([expr]) 	查找所有匹配元素的下一个兄弟元素
		
					prevall([expr]) 查找所有匹配元素的上面的所有兄弟元素
					nextall([expr]) 查找所有匹配元素的下面的所有的兄弟元素
					siblings([expr]) 查找所有匹配元素之后所有的同辈元素
1）查找父元素
>>>>>> 查找父元素

<body>

    <div >
        <ul>
            <li><span>3</span></li>
            <li>2</li>
            <li><span>3</span></li>
            <li id="cc">4</li>
            <span>5</span>
            <span>6</span>
        </ul>
        <span>11</span><br>
        <span>22</span><br>
    </div>

</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    //ul标签的父标签
    $("#cc").parent().css("background-color","red")

</script>

在这里插入图片描述

>>>>>> 查找所有父辈元素
<body>


    <div >
        <ul>
            <li><span>3</span></li>
            <li>2</li>
            <li><span>3</span></li>
            <li id="cc">4</li>
            <span>5</span>
            <span>6</span>
        </ul>
        <span>11</span><br>
        <span>22</span><br>
    </div>

</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    //ul标签的父辈标签
    $("#cc").parents("div").css("background-color","red")

</script>

在这里插入图片描述

2）查找子元素
<body>

    <ul>
        <li><span>3</span></li>
        <li>2</li>
        <li><span>3</span></li>
        <li>4</li>
        <span>5</span>
        <span>6</span>
    </ul>


</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    //ul下所有的子元素
    $("ul").children().css("color","pink")

    //ul标签内的第2个span子元素
    $("ul").children("span:eq(1)").css("background-color","red")

    //ul标签内的第2个span后代元素
    $("ul").find("span:eq(1)").css("background-color","blue")


</script>

在这里插入图片描述

3）查找兄弟元素
<body>


    <div >
        <ul>
            <li><span>3</span></li>
            <li>2</li>
            <li><span>3</span></li>
            <li id="cc">4</li>
            <span>5</span>
            <span>6</span>
        </ul>
        <span>11</span><br>
        <span>22</span><br>
    </div>

</body>

<script type="text/javascript" src="js/jquery-1.12.4.js" ></script>
<script>

    //id为cc的所有兄弟标签
    $("#cc").siblings().css("background-color","red")

    // id为cc的前面的兄弟标签
    $("#cc").prev().css("background-color","red")
    // id为cc的前面的所有兄弟标签
    $("#cc").prevAll().css("background-color","red")


    // id为cc的后面的兄弟标签
    $("#cc").next().css("background-color","red")
    // id为cc的后面的所有兄弟标签
    $("#cc").nextAll().css("background-color","red")


</script>
>>>>>> 案例
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <form>
        你爱好的运动是?<input type="checkbox" id="checkAllBox"> 全选/全不选 <br>
        <input type="checkbox" name="items" value="足球">足球</input>
        <input type="checkbox" name="items" value="篮球">篮球</input>
        <input type="checkbox" name="items" value="黑球">黑球</input>
        <input type="checkbox" name="items" value="白球">白球</input> <br>

        <input type="button" id="checkAllBtn"  value="全  选">
        <input type="button" id="checkNoBtn"  value="全不选">
        <input type="button" id="checkReoBtn"  value="反选">
        <input type="button" id="sendBtn"  value="提交">

    </form>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

    var $lo=$(":checkbox").filter("[name=items]");


    //全选/全不选
    $("#checkAllBox").click(function(){
        
        if($("#checkAllBox").prop("checked")){
            $lo.prop("checked",true);
        }else{
            $lo.prop("checked",false);
        }  
    })


    //全选
    $("#checkAllBtn").click(function(){
            $lo.prop("checked",true);
    })
  
    
    //全不选
    $("#checkNoBtn").click(function(){
            $lo.prop("checked",false);
    })


     //反选
     $("#checkReoBtn").click(function(){
            $lo.each(function(){
                console.log(!$(this).prop("checked"))
                $(this).prop("checked",!$(this).prop("checked"))
            })
    })


     //提交
     $("#sendBtn").click(function(){
        var arr=new Array();
        $lo.each(function(){
            if($(this).prop("checked")){
                arr.push(this)
            }
        })

        console.log(arr)
    })


</script>
</html>

在这里插入图片描述

二、文档处理模块 - DOM增删改（CUD）

		
		+++ 增
			  1) 插入后部（内部插入）
					append(content|fn)  在元素内部追加内容
					appendTo(selector) 	将元素追加到某个元素的内部
					
					prepend(content|fn) 在元素内部前置内容
					prependTo(content)  将元素前置到某个元素的内部
				
		 	  2) 外部插入（插入后面）
					after(content|fn)   在元素后面添加内容
					insertAfter(selector) 
	
					before(content|fn)  在元素前面添加内容
					insertBefore(selector) 

				


		+++ 删除
				empty() 	 删除元素中的内部内容（掏空，自己还在）
				remove([selector]) 	 删除自身/删除匹配的元素
					
							empty()和remove()的区别在于：
											1、empty()是清空内部元素。
											2、remove()是吧自己也删除了。




		+++ 改
				replaceWith(content|fn)  将匹配的元素替换为指定的内容
				
				replaceAll(selector)     将匹配的元素替换掉指定的元素
											注意：相当于将匹配的元素移到指定的元素的位置。
1.1 增
1）内部插入
>>>>>> 内部追加（在元素内部的后面添加）
<body>
    
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

    //在ul元素的内部追加内容
    $("ul").append("<span>追加的内容1</span>")

    //将内容追加到元素的内部
    $("<span>追加的内容2</span>").appendTo("ul")

</script>

在这里插入图片描述

>>>>>> 内部前置（在元素内部的前面添加）
<body>
    
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

 

    //在ul元素的内部前置内容
    $("ul").prepend("<span>前置的内容1</span>")

    //将内容前置到元素的内部
    $("<span>前置的内容2</span>").prependTo("ul")   
    
</script>

在这里插入图片描述

2）外部插入
>>>>>> 外部追加（在元素的后面添加）
<body>
    
    <ul>
        <li>1</li>
        <li class="sss">2</li>
        <li>3</li>
    </ul>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

    
    //在元素后面追加内容
    $(".sss").after("<span>在元素后面添加的内容1<span>")

    //将内容追加到元素后面
    $("<span>在元素后面添加的内容2<span>").insertAfter(".sss")

</script>

在这里插入图片描述

>>>>>> 外部前置（在元素的前面添加）
<body>
    
    <ul>
        <li>1</li>
        <li class="sss">2</li>
        <li>3</li>
    </ul>
</body>

<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

    
    //在元素后面追加内容
    $(".sss").before("<span>在元素前面添加的内容1<span>")

    //将内容追加到元素后面
    $("<span>在元素前面添加的内容2<span>").insertBefore(".sss")

</script>

在这里插入图片描述

1.2 删
1）empty() 删除元素内部元素
<body>

    <div>123<span>456<span></div>

    
</body>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

        //删除span内部的内容，但是span标签还存在
        $("span").empty();
</script>

在这里插入图片描述

2）remove([selector]) 删除指定的元素
>>>>>> remove() 删除元素
<body>

    <div>
        xxxxxxxxxxxxx
        <span>1</span>
        <span class="tt">2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>

    </div>

    
</body>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>
        //删除所有匹配的元素
        $("span").remove();
</script>

在这里插入图片描述

>>>>>> remove(selector) 删除指定的元素
<body>

    <div>
        xxxxxxxxxxxxx
        <span>1</span>
        <span class="tt">2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>

    </div>

    
</body>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>
        //删除指定的元素
        $("span").remove(".tt");
</script>

在这里插入图片描述

1.3 改
1）replaceWith(content|fn) 将匹配的元素替换为指定的内容
<body>

    <div>
        xxxxxxxxxxxxx
        <span>1</span>
        <span class="tt">2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>

    </div>

    
</body>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

        //将选中的替换为指定的内容
        $(".tt").replaceWith("替换的内容")

</script>

在这里插入图片描述

2）replaceAll(selector) 将匹配的元素替换掉指定的元素
<body>
    <span class="cc">xxxxxxxx</span>
    <div>
        xxxxxxxxxxxxx
        <span>1</span>
        <span class="tt">2</span>
        <span>3</span>
        <span>4</span>
        <span>5</span>

    </div>

    
</body>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

        //将匹配的元素替换到指定的元素。
        $(".tt").replaceAll(".cc")

</script>

在这里插入图片描述

三、案例
>>>>>> 案例
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>


    <style>

        table:first-of-type{
            width:400px;
            margin:30px auto;
            border:1px solid red;
        }

        table:last-of-type{
            width:300px;
            margin:50px auto;

            border:2px solid black;
            padding:20px;
        }

        td{
            padding:2px
        }

        .cc{
            padding-top:10px;
            text-align: center;
        }

        .cc input{
            width:80px;
            height:30px;
        }

    </style>



<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script>

        function removeTr(obj){
            $(obj).parent().parent().remove();
        }

        $(function(){
            //新增
            $(".btn").click(function(){
                            
                //判断非空
                var str='';
                $(":text").each(function(){

                    var key=$(this).parent().prev().html();
                    var value=$(this).val();
                    if( value==''){
                        str=str+ key+"为空！！";
                    }
                })

                if(str !=''){
                    alert(str);
                    return;
                }

                var name =$(":text").eq(0).val();
                var age =$(":text").eq(1).val();
                var email =$(":text").eq(2).val();
                var remark =$(":text").eq(3).val();

                $("table").first().find("tr").last().after(
                    " <tr><td>"+name+"</td><td>"+age+"</td><td>"+email+"</td><td>"+remark+"</td> <th><a href='javascript:;' οnclick='removeTr(this)''>删除</a></th></tr>"
                )

                //置空
                $(":text").prop("value","");

             })
        })
      
      
</script>
</head>
<body>

    <table border="1" >
        <tr>
            <th>Name</th>
            <th>age</th>
            <th>Email</th>
            <th>remark</th>
            <th></th>
        </tr>
        <tr>
            <td>王帅</td>
            <td>12</td>
            <td>554030344@qq.com</td>
            <td>xxx</td>
            <th><a href="javascript:;" onclick="removeTr(this)">删除</a></th>
        </tr>
        <tr>
            <td>王帅</td>
            <td>12</td>
            <td>554030344@qq.com</td>
            <td>xxx</td>
            <th><a href="javascript:;" onclick="removeTr(this)">删除</a></th>
        </tr>
    </table>
    
    <table>
        <caption>添加新员工</caption>
        <tr>
            <td>name</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td>age</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td>Email</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td>remark</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td colspan="2" class="cc"><input type="submit" value="添加员工" class="btn"></td>
        </tr>
    </table>
</body>
</html>

在这里插入图片描述

二旬、
关注
专栏目录
jQuery-筛选-文档处理
m0_67140851的博客
04-21 52
jQuery-筛选-文档处理1 思维导图2 筛选2.1过滤2.2过滤案例2.3 查找2.4 查找案例3 文档处理3.1 文档增加3.2 文档增加案例3.3 文档删除3.4 文档删除案例3.5 文档修改3.6 文档修改案例 1 思维导图 2 筛选 2.1过滤 first():获取匹配的第一个元素 last():获得匹配的最后一个元素 eq():获取匹配的第或N个元素 fite iselector():选出与指定表达式匹配的元素集合 hasiselector():筛选包含特特点的元素的集 notiselec
jQuery_03 筛选与文档处理
m0_64043477的博客
03-18 615
jQuery_03 (筛选&文档处理)
jQuery常用API（三）
m0_45659764的博客
05-13 257
5. jQuery属性操作 5.1 设置或获取元素固有属性值prop() 所谓元素固有属性就是元素本身自带的属性，比如<a>元素里面的href，比如<input>元素里面的type 1. 获取属性语法 prop("属性") <a href="http://www.itcast.cn" title="都挺好"></a> <script> $(function () { //1.element.pr
vue仿淘宝京东商品多条件筛选（vue实现）
09-02 4415
<template> <div id="warp"> 你选择的是： <mark v-for="(item,index) in arr"> <span>{{item.name}}</span><a style="color: red;" href="javascript:;" @click="remove(index,item.id)">X</a> </mark> <!-- <s
jQuery-3.3.1、JavaScript API中文文档
11-14
总结，这个压缩包包含了jQuery 3.3.1的中文API文档，可以帮助开发者快速理解和应用jQuery的功能；而微软的JavaScript手册则提供了全面的语言参考，有助于深入理解JavaScript的核心概念和特性。两者结合，为前端开发...
jquery 1.11.3 中文API帮助文档 工具源码版
07-16
这个工具源码版提供了离线查看的功能，用户只需下载并解压文件，然后打开`index.html`，就能在本地浏览完整的API文档，无需依赖网络。 **jQuery** 是一个广泛使用的JavaScript库，它简化了HTML文档遍历、事件处理、...
jquery-api-1.7
06-05
三、文档处理 jQuery提供了丰富的文档处理方法，如$(document).ready()用于在DOM加载完成后执行函数，确保所有元素都已准备就绪。$.load()用于异步加载HTML片段并插入到指定元素中。$.getScript()则用于动态加载...
ArcGIS API for JavaScript 3.26 离线帮助文档
09-29
- **第三方库集成**：如Bootstrap、jQuery等，提高开发效率。 6. **故障排查**： - **常见问题**：列举了开发过程中可能遇到的问题及其解决方案。 - **错误代码解释**：解释API返回的错误代码含义，帮助开发者...
jquery easyui 中文帮助文档(最完整的API).docx
05-04
jQuery EasyUI 是一个基于 jQuery 的前端框架，用于构建富客户端应用程序。它提供了许多组件，如面板、表单、菜单、窗口、数据表格等，这些组件都具有丰富的功能和易用的API。以下是对jQuery EasyUI核心知识点的详细...
html知识点框架
爱敲代码的卡拉米的博客
09-18 623
一、HTML基础
HTML 揭秘：HTML 编码快速入门
m0_53117341的博客
09-09 1377
HTML 揭秘：HTML 编码快速入门一 . 前端知识介绍二 . HTML 介绍三 . HTML 快速入门四 . HTML 编辑器 - VSCode4.1 插件安装4.2 修改主题配色4.3 修改快捷键4.4 设置自动保存4.5 创建 HTML 文件4.5 书写 HTML 代码4.6 常见快捷键五 . 基础标签5.1 字体标签5.1.1 color 属性5.1.2 size 属性5.1.3 face 属性5.2 i 标签、b 标签5.3 hr 标签5.4 br 标签5.5 center 标签5.6 练习5.
HTML、CSS实现树状图
p_s_p的博客
09-09 934
【代码】HTML、CSS实现树状图。
炫酷HTML蜘蛛侠登录页面
bjjgff的博客
09-14 1598
全篇使用HTML、CSS、JavaScript，建议有过基础的进行阅读。
XWiki中添加 html 二次编辑失效
galoiszhou的博客
09-12 443
使用 XWiki 中的 HTML 宏：如果标准的 Markdown 语法和 XWiki 的链接语法都无法工作，可以考虑使用 HTML 宏，它可以让你在 XWiki 页面中插入纯 HTML 代码，而不会被自动转换回 Markdown。如果直接在 XWiki 中添加 html, 例如 修改颜色, 新窗口打开主页面等功能, 首次保存是生效的. 如果再次编辑, 则失效, 原因是被转换成了 Markdown 的代码, 而 Markdown 不支持.解决这个问题可以使用 HTML 宏.
网页打开时，下载的文件text/html/重定向类型有什么作用？
最新发布
2301_79698214的博客
09-18 816
Text类型在数据库设计中的应用非常广泛，主要因为它能够满足存储大量文本数据的需要，而不会成为性能瓶颈，尽管其存储效率相对较低，特别是在进行大量的数据读取和写入操作时‌1。通过重定向，可以将旧的URL指向新的URL，确保用户和搜索引擎能够顺利访问到更新后的内容，同时防止因结构调整导致的404错误。总的来说，Text类型在数据库中的应用主要是为了存储大量的文本信息，无论是普通文本还是特定格式的文本数据，如HTML或JSON格式的内容，它都提供了灵活且高效的存储解决方案。综上所述，当网页打开时下载的。
HTML讲解（一）body部分
2301_80349538的博客
09-18 379
HTML 是用来描述网页的一种语言。HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本，添加图片，创建链接、输入表单、框架和表格等等，并可将之存为文本文件，浏览器即可读取和显示。HTML 指的是超文本标记语言: HyperText Markup LanguageHTML 不是一种编程语言，而是一种标记语言标记语言是一套标记标签 (markup tag)HTML 使用标记标签来描述网页HTML 文档包含了HTML 标签及文本内容HTML文档也叫做web 页面。
HTML贪吃蛇游戏
weixin_65477256的博客
09-15 1448
贪吃蛇是一款经典的休闲益智游戏。本文将通过HTML5和JavaScript详细解析如何实现一个简易版的贪吃蛇游戏。游戏的主要逻辑包括蛇的移动、碰撞检测、食物生成等功能。以下是游戏的完整代码及注释解析。（纯属好玩）
requests-html的具体使用方法有哪些？
2301_79698214的博客
09-12 767
requests-html库还支持使用XPath表达式来查找元素，提供了丰富的功能来满足各种网页数据抓取和分析的需求‌。‌：通过pip安装requests-html库，命令为。‌：通过继续跟踪网页中的链接，可以获取到更多相关内容。
jQuery1.4.2 API中文帮助文档CHM版下载
"JQuery1.4.2API帮助文档简体中文chm版" 这篇资源提供了JQuery 1.4.2的API帮助文档的简体中文版本，它是一个非常实用的工具，对于那些在开发过程中需要快速查阅JQuery 1.4.2函数和方法的开发者来说尤其有价值。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值