jQuery是一款流行的JavaScript库，支持各种DOM操作和事件处理。本文将为您介绍一个jQuery+查询列表示例，帮助您快速学习jQuery的使用方法。
下面是一个简单的查询列表示例：
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#searchBtn").click(function(){
var inputVal = $("#searchInput").val();
if(inputVal){
$.ajax({
url: "https://api.github.com/search/users?q="+inputVal,
method: "GET",
success: function(response){
var arrUser = response.items;
var html = "";
for(var i=0;i<arrUser.length;i++){
html += "<li><a target='_blank' href='"+arrUser[i].html_url+"'>"+arrUser[i].login+"</a></li>";
}
$("#result").html(html);
}
});
}else{
alert("请输入关键字");
}
});
});
</script>
</head>
<body>
<div>
<input type="text" id="searchInput" placeholder="请输入用户名">
<button id="searchBtn">查询</button>
</div>
<ul id="result"></ul>
</body>
</html>上面的代码中，我们创建了一个文本输入框和一个查询按钮，当用户输入用户名并点击查询按钮后，ajax请求会向GitHub的API发送一个get请求，获取用户名对应的用户信息，并使用jQuery将结果以列表形式展示。
该示例主要的jQuery语句有：
$("#searchBtn").click(function(){...}) //给查询按钮绑定click事件
$("#searchInput").val() //获取文本输入框的值
$.ajax({...}) //发送ajax请求
$("#result").html(html) //将列表结果放置到HTML布局中通过这个简单的示例，您可以快速入门jQuery的使用，在您的网页开发中方便地使用DOM操作和事件处理。
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://www.haodehen.cn/did250217