grid布局生成奇偶行选择器
// 生成奇数行和偶数行的选择器
function generateSelectors(colNum) {
let evenSelectors = []; // 偶数行的选择器
let oddSelectors = []; // 奇数行的选择器
// 生成偶数行的选择器
for (let k = 1; k <= colNum; k++) {
evenSelectors.push(`div:nth-child(${2 * colNum}n + ${k + colNum})`);
}
// 生成奇数行的选择器
for (let k = 1; k <= colNum; k++) {
oddSelectors.push(`div:nth-child(${2 * colNum}n + ${k})`);
}
// 将选择器拼接成字符串
const evenSelectorString = evenSelectors.join(',');
const oddSelectorString = oddSelectors.join(',');
return {
even: evenSelectorString,
odd: oddSelectorString
};
}
// 调用示例
const colNum = 3; // 列数
const selectors = generateSelectors(colNum);
console.log("/* 偶数行的选择器 */");
console.log(selectors.even);
console.log("/* 奇数行的选择器 */");
console.log(selectors.odd);