jQuery选择器发明的目的是准确地选取我们所需要的应用效果的元素。
jQuery元素选择器和属性选择器允许我们通过标签名属性名或内容对HTML元素进行选择。
有三种选择器：
jQuery元素选择器（标签选择器）
jQuery属性选择器（#id选择器）
jQueryCSS选择器（类选择器，.class选择器）
在jQuery中获取和设置样式被封装成了函数：
jQuery对象.csss(“样式名称”);
jQuery对象.csss(“样式名称”,“样式的属性值”);
注意：报错请检查中英文，不同浏览器解析不同
补充：在网页中id只能使用一次，class允许重复使用
举个例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" value="标签选择器改变">
<input type="button" value="id选择器改变" id="idChoose">
<input type="button" value="类选择器改变" class="classChoose">
<div id="testDiv">没改变的</div>
</body>
<script type="text/javascript" src="../static/js/jquery-3.5.1.js"></script>
<script>
//class选择器
var $classChoose = $(".classChoose");
$classChoose.click(
function (){
var divForTest = document.getElementById("testDiv");
divForTest.innerHTML = "class选择器改变";
}
);
//id选择器改变
var $idChoose = $("#idChoose");
$idChoose.click(
function (){
var divForTest = document.getElementById("testDiv");
divForTest.innerHTML = "id选择器改变";
}
);
//标签选择器改变
var $tagChoose = $("input");
// alert( $tagChoose.length );
// alert( $tagChoose.get(0).html().toString() );
// alert( $tagChoose.get(0).text().toString() );
// alert( $tagChoose.get(0).val().toString() );
$tagChoose.get(0).click(
function (){
var divForTest = document.getElementById("testDiv");
alert(divForTest.innerHTML)
divForTest.innerHTML = "标签选择器改变";
}
);
</script>
</html>
运行结果：
1389
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
