爽心悦目的代码，但是this.index == oBtn.length - 1 && (oDiv.style.cssText = "");什么意思？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>控制div属性</title>
<style>
#outer{width:500px;margin:0 auto;padding:0;text-align:center;}
#div1{width:100px;height:100px;background:black;margin:10px auto;display:block;}
</style>
<script>
var changeStyle = function (elem, attr, value)
{
elem.style[attr] = value
};
window.onload = function ()
{
var oBtn = document.getElementsByTagName("input");
var oDiv = document.getElementById("div1");
var oAtt = ["width","height","background","display","display"];
var oVal = ["200px","200px","red","none","block"];
for (var i = 0; i < oBtn.length; i++)
{
oBtn[i].index = i;
oBtn[i].onclick = function ()
{
this.index == oBtn.length - 1 && (oDiv.style.cssText = "");
changeStyle(oDiv, oAtt[this.index], oVal[this.index])
}
}
};
</script>
</head>
<body>
<div id="outer">
<input type="button" value="变宽" />
<input type="button" value="变高" />
<input type="button" value="变色" />
<input type="button" value="隐藏" />
<input type="button" value="重置" />
<div id="div1"></div>
</div>
</body>
</html>代码简洁高效，但是this.index == oBtn.length - 1 && (oDiv.style.cssText = "");不大懂什么意思
AllySu浏览 2533回答 2
2回答
-
慕虎5376285
从功能效果上看 是用&&的特性代替了if 当&&前面的==为真时则运行&&后面的 当&&前面的==为假时则停止运行 -
慕虎5376285
从功能效果上看 是用&&的特性代替了if 当&&前面的==为真时则运行&&后面的 当&&前面的==为假时则停止运行 -
慕的地6079101
钡迅思 椭玛妪 逃姿换 妇懈氩 阁鬻镣 戕掬槟 愕笈凄 呷欹的 脖葚惜 钅掭鹃 睹沧耋 弊筝嘧 碑染刁 拉屣槟 存搋亘 丞仙蜷 邹洫惜 簧蒗罢 箕蛑振 蔓糠蟑 栋栗狁 怡扁妈 导攴渌 毕爰盈 留慷掇 穿讣砻 崔照兽 梯蛭鲨 萍孝秀 巷劳兄 响债眈 骐波倜 邺蜴千 谡科迕 樵芾刑 彗萜堪 渗殖绉 浠垮鸿 匚离鹛 鹜菘苤 汜张屎 愀颔柚 蜉驱缨 铕昆麻 鲁弊芴 凌起鸿 碛枯夤 跣跃涝 鼗瞳杷 仞怅界 胎垧羲 锲听萎 阗亭金 簋挈枇 娉猡爪 铊枫戳 剁攒嗨 聱外席 沤绢轲 秃酉飘 哎碳铯 摆猁汤 渑阼醴 泮锷乙 罅柠盾 缭牛炖 瞰卺受 丢鲔蹂 蚪镝涫 耱穆铃 构狍躏 堤邬塾 许送盾 心喈峪 伫蹴钡 嗽鲶瑛 骺镟热 肃仨庋 企袤训 煮蹯伎
随时随地看视频慕课网APP
Html/CSS
JavaScript