<body>
<!--
<div data='x'>(其中x自增,如1、2、3、4...)
<button type="button" onclick='test()'>Click Me!</button>
</div>
当点击该按钮时改变div中的内容,比如呈现一些其他如lable,input之类的。
我的想法是js那边需要知道是哪个div,这样才能定位div改变它的内容,
问题是不知道怎么在点击按钮事件发生时,把该button的父元素中的data属性的值传递到js那边,求各位大大的帮助。
-->
<div data='1'>
<button type="button" onclick='test(this)'>Click Me_1!</button>
</div>
<div data='2'>
<button type="button" onclick='test(this)'>Click Me_2!</button>
</div>
<div data='3'>
<button type="button" onclick='test(this)'>Click Me_3!</button>
</div>
<script type="text/javascript">
function test(ele) {
var pNode = ele.parentNode;
switch(pNode.getAttribute('data')) {
case '1':
pNode.innerHTML = "<lable>我是lable_1</lable>";
break;
case '2':
pNode.innerHTML = "<lable>我是lable_2</lable>";
break;
case '3':
pNode.innerHTML = "<lable>我是lable_3</lable>";
break;
}
}
</script>
</body>