javascript - 如何在原型(prototype)中更改单击的元素innerHTML

我有一个HTML结构，例如

 <p>
      <a onclick="try {
        toggle_detail(&quot;additional&quot;);
        } catch (e) { alert('RJS error:\n\n' + e.toString()); alert('toggle_detail(\&quot;additional\&quot;);'); throw e }; return false;" href="#">Show            </a>
 </p>

 <div id="additional">
    <p>1</p>
    <p>2</p>
    <p>3</p>
    <p>4</p>
 </div>

我正在编写一个原型，以在单击“显示”和“隐藏”时显示额外的div。

    $$("."+element_id).each(function(el){
        if(el.visible()){el.hide();

          // el.previous(0).innerHTML="Show";

    }
        else {el.show();
          //    el.previous(0).innerHTML="Hide";
    }
    });

其中element_id =“ additional”

如何将链接的innerhtml更新为show / hide？
我不知道如何更新点击链接的innerHtml ..
请提出建议

最佳答案

将此添加到您的click处理程序。

this.innerHTML = (this.innerHTML == 'Show')?'Hide':'Show';

或将调用方作为参数添加到您的toggle_detail函数中

toggle_detail(this, &quot;additional&quot;);

并更改功能以接受该额外参数

function toggle_detail(clickButton, className){
    // do what you want with clickButton //
}

同样，更改each中的文本也没有意义。您只能在each调用之前或之后执行一次。

奖励：代替if(el.visible()) el.hide(); else el.show()，您可以简单地使用el.toggle()。

EL

javascript - 如何在原型(prototype)中更改单击的元素innerHTML