版权声明：进击的葱 https://blog.csdn.net/qlwangcong518/article/details/86518231
描述：
jquery标签属性和css样式
实现：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="node_modules/jquery/dist/jquery.js"></script>
</head>
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<script>
// $("div").attr("class","abc");
/*var arr=["a","b","c"];
// 给jQuery列表中每个元素添加class标签属性，并且设置不同的值
$("div").attr("class",function (index,value) {
return arr[index%arr.length];
})*/
// 给jQuery列表的每个元素添加多个标签属性
/*$("div").attr({
a:1,
b:2,
c:"a"
})*/
/*
*
* 给jQuery列表的每个元素添加多个标签，设置每个标签有不同的值
*
* */
var arr=["a","b","c"];
/* $("div").attr({
a:function (index,value) {
return arr[index%2];
},
c:function (index) {
return arr[index%3]
}
})*/
/* $("div").attr({
a:index=>arr[index%2],
c:index=>arr[index%3]
})
*/
/*
* 获取标签属性
*
* */
// console.log($("div").attr("a"));//打印jQuery列表中第一个元素的标签属性a的值
// $("div").css("backgroundColor","red");
/* var arr1=["red","green","blue"];
$("div").css("backgroundColor",function (index) {
return arr1[index%3];
})*/
/*$("div").css({
width:"100px",
height:"100px",
backgroundColor:"red",
float:"left"
})*/
var arr1=["red","green","blue"];
$("div").css({
width:index=>(index+1)*50+"px",
height:index=>(index+1)*50+"px",
backgroundColor:index=>arr1[index%3],
float:"left"
})
console.log($("div").css("backgroundColor"));//第一个元素的背景色
</script>
</body>
</html>