大家好,我一直堅持這個例子,我不明白分配 var classNames 后會發生什么。attr("class") 和 split 扮演什么角色?
$(document).ready(function() {
$(".box").on("click", function() {
var classNames = $(this).attr("class").split(" ");
$("." classNames[1]).css("background-color", "red");
});
});
uj5u.com熱心網友回復:
如果我正確理解您的問題,兩種方法都有不同的“角色”。
attr() 方法用于獲取屬性值——特別是與“類”關聯的值。attr() 方法通常用于 DOM 操作。
split() 方法用于拆分文本或將另一種方式將字串拆分為子字串陣列。split() 方法不修改原始字串而是回傳一個新陣列
uj5u.com熱心網友回復:
考慮這個例子。attr("class")獲取標簽擁有的所有類并將split它們組成一個陣列,以便您可以通過索引參考它們:classNames[1]
在這個例子中,classNames[1]是類center并且添加.css("background-color", "red");到它相當于.center{ background-color:red; }
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<style>
.box {
color: green;
font-size: 32px;
}
</style>
</head>
<body>
<button class="box center" value="click">Click</button>
<script>
$(".box").on("click", function() {
console.log($(this).attr("class")); //returns 'box center'
var classNames = $(this).attr("class").split(" ");
console.log(classNames); //returns ['box', 'center']
$("." classNames[1]).css("background-color", "red");
});
</script>
</body>
</html>
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/407056.html
標籤:
上一篇:附加jQuery后聚焦輸入欄位
