jQuery 的基本语法涉及使用选择器（CSS 样式选择器）和操作所选元素的方法。 以下是 jQuery 的一些基本语法示例：
选择元素
-
通过 HTML 标签名称选择元素：
$("tagname")示例：$("p")选择<p>页面上的所有元素。 -
按 CSS 类选择元素：
$(".classname")示例：$(".myClass")选择类为“myClass”的所有元素。 -
按 ID 选择元素：
$("#idname")示例：$("#myElement")选择 ID 为“myElement”的元素。 -
按属性选择元素：
$("[attribute='value']")示例：$("[data-type='button']")选择属性data-type设置为“button”的元素。 -
组合选择：
$("tagname.classname"),$("#idname .classname"), ...
操作选定的元素
-
更改元素的内容：
.html()示例.text()：$("#myElement").html("New content")设置 ID 为“myElement”的元素的 HTML 内容。 -
修改元素属性：
.attr()，.prop()示例：$("img").attr("src", "newimage.jpg")更改src所有<img>元素的属性。 -
操作元素的 CSS 类：
.addClass()、.removeClass()、.toggleClass()示例：$("#myElement").addClass("highlight")将类“highlight”添加到 ID 为“myElement”的元素。 -
隐藏/显示元素：
.hide(),.show(),.toggle()示例：$(".myClass").hide()隐藏类为“myClass”的所有元素。 -
处理元素上的事件：
.click(),.hover(),.submit(), ... 示例：$("button").click(function() { ... })注册单击事件处理程序
处理元素集合
-
迭代集合：
.each()示例：$("li").each(function() { ... })迭代<li>页面上的每个元素。 -
过滤集合：
.filter()示例.not()：$("div").filter(".myClass")过滤<div>元素并选择类为“myClass”的元素。 -
将元素插入集合：
.append()、.prepend()、.after()、.before()示例：$("#myElement").append("<p>New paragraph</p>")将新<p>元素附加到 ID 为“myElement”的元素。
效果和动画
-
执行淡入/淡出效果：
.fadeIn()，.fadeOut()示例：$("#myElement").fadeIn(1000)在 1 秒的持续时间内淡入 ID 为“myElement”的元素。 -
执行slideUp/slideDown效果：
.slideUp()，.slideDown()示例：$(".myClass").slideUp(500)在0.5秒的持续时间内向上滑动类为“myClass”的所有元素。 -
执行自定义动画：
.animate()示例：$("#myElement").animate({ left: '250px', opacity: '0.5' })通过更改 ID 为“myElement”的元素的左侧位置和不透明度来对其进行动画处理。
这些示例演示了如何使用 jQuery 基本语法的不同方面来选择元素、操作其属性以及应用效果或动画。 jQuery 提供了一组丰富的方法和功能来简化和增强 Web 开发任务。