87,989
社区成员
发帖
与我相关
我的任务
分享关于this的选择时机,请教下高手,谢谢啦.
HTML部分:
JS部分:
代码均无问题,只是我没有完全弄懂 calc函数里,关于this和span该如何选择?或者说什么情况下才选择.
其中4个地方用到了span和this . 比如this.parentNode span.innerHTML this.innerHTML 和最后一句 span.innerHTML
最不理解的是span.innerHTML这句,到底是取网页中span的内容,还是函数里变量span的内容? 包括后2句也没完全想通.
-- 更新: --
刚我修改了 var span 和2处: span.innerHTML 的span为sp,代码也可以运行. 难不成获取的都是 span变量里的内容? span获取的不是一个下标为0的类数组值么 , 而且.innerHTML不是这么用的吧,我有点乱...
希望有高手抽空讲下原理,谢谢.
<!DOCTYPE HTML>
<html>
<head>
<title>购物车计算</title>
<meta charset="utf-8" />
<style>
table{width:600px; text-align:center;
border-collapse:collapse;
}
td,th{border:1px solid black}
td[colspan="3"]{text-align:right;}
</style>
</head>
<body>
<table id="data">
<thead>
<tr>
<th>商品名称</th>
<th>单价</th>
<th>数量</th>
<th>小计</th>
</tr>
</thead>
<tbody>
<tr>
<td>iPhone6</td>
<td>¥4488</td>
<td>
<button>-</button>
<span>1</span>
<button>+</button>
</td>
<td>¥4488</td>
</tr>
<tr>
<td>iPhone6 plus</td>
<td>¥5288</td>
<td>
<button>-</button>
<span>1</span>
<button>+</button>
</td>
<td>¥5288</td>
</tr>
<tr>
<td>iPad Air 2</td>
<td>¥4288</td>
<td>
<button>-</button>
<span>1</span>
<button>+</button>
</td>
<td>¥4288</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">Total: </td>
<td>¥14064</td>
</tr>
</tfoot>
</table>
<script src="js/6_2.js"></script>
</body>
</html>
JS部分:
var table=document.getElementById("data");
var btn=table.getElementsByTagName("button");
for(var i=0,len=btn.length;i<len;i++){
btn[i].onclick=calc;
}
function calc(){
var span=this.parentNode.getElementsByTagName("span")[0];
var n=parseInt(span.innerHTML);
n+=this.innerHTML=="+"?1:n>1?-1:0;
span.innerHTML=n;
}代码均无问题,只是我没有完全弄懂 calc函数里,关于this和span该如何选择?或者说什么情况下才选择.
其中4个地方用到了span和this . 比如this.parentNode span.innerHTML this.innerHTML 和最后一句 span.innerHTML
最不理解的是span.innerHTML这句,到底是取网页中span的内容,还是函数里变量span的内容? 包括后2句也没完全想通.
-- 更新: --
刚我修改了 var span 和2处: span.innerHTML 的span为sp,代码也可以运行. 难不成获取的都是 span变量里的内容? span获取的不是一个下标为0的类数组值么 , 而且.innerHTML不是这么用的吧,我有点乱...
希望有高手抽空讲下原理,谢谢.
...全文
请发表友善的回复…
发表回复
