多分支else if条件判断失效求助：按数值范围设置元素高度异常

这个问题的核心是条件判断的顺序逻辑错误，另外还要注意元素选择器的写法是否正确，我来帮你拆解修复：

1. 核心问题：条件顺序导致后续判断失效 #

你当前的代码中，else if(y >= 1)这个条件会匹配所有y≥1的情况（包括2、3、4、5、6），一旦进入这个分支，后面的else if(y <=4)和else if(y >=5)就永远不会被执行——这就是为什么不管y是1-6都只会返回70px的原因。

2. 次要问题：元素选择器与样式设置的正确性 #

• 如果你用的是jQuery，直接写$('slpage')会匹配标签名为<slpage>的元素，大概率不是你要的目标元素，应该用$('#slpage')（id选择器）或$('.slpage')（类选择器），并且jQuery设置样式要用.css()方法，而非.style.height。
• 如果是原生JS，要确保$函数是正确获取DOM元素的封装（比如基于document.querySelector），否则直接用document.querySelector('#slpage')更稳妥。

3. 修复后的代码示例 #

版本一：jQuery写法 #

// 假设目标元素的id是slpage
if (y === 0) {
  $('#slpage').css('height', '0px');
} else if (y >= 1 && y <= 2) {
  $('#slpage').css('height', '70px');
} else if (y >= 3 && y <= 4) {
  $('#slpage').css('height', '140px');
} else if (y >= 5 && y <= 6) {
  $('#slpage').css('height', '210px');
}

版本二：原生JS写法 #

// 先确保正确获取目标元素
const slpage = document.querySelector('#slpage');
if (!slpage) return; // 避免元素不存在时报错

if (y === 0) {
  slpage.style.height = '0px';
} else if (y >= 1 && y <= 2) {
  slpage.style.height = '70px';
} else if (y >= 3 && y <= 4) {
  slpage.style.height = '140px';
} else if (y >= 5 && y <= 6) {
  slpage.style.height = '210px';
}

关键说明 #

• 我们把条件改成了精准的区间判断，每个分支只匹配对应的y值范围，避免了范围覆盖的问题。
• 使用===严格相等判断，能避免隐式类型转换带来的意外问题。
• 增加了元素存在性判断（原生JS版本），防止因元素未加载或选择器错误导致的控制台报错。

内容的提问来源于stack exchange，提问作者Bandarbola855