Irohabook
JavaScript JavaScriptの基本

JavaScriptでjQueryのshowとhideをつくる

広告

jQueryを使わないで要素を消したり表示したりするには、JavaScriptのstyle.displayを使います。

function hide(array) {
    array.forEach(function (id) {
        document.getElementById(id).style.display = 'none';
    })
}
function show(array) {
    array.forEach(function (id) {
        document.getElementById(id).style.display = 'block';
    })
}

jQueryのhideとshowをJavaScriptでつくると上のようになる。上の関数は配列を引数にしているので

hide(['buttonID1', 'buttonID2']);
show(['div1', 'div2']);

と呼びます。本当は引数が存在するかどうかなどをチェックするべきですが、上の関数が show と hide の基本形になるでしょう。ちなみに、例えば下のように大カッコを抜くとうまくいきません。

hide('buttonID1', 'buttonID2');
show('div1', 'div2');

広告

コンピューター コンピューター
プログラミング プログラミング
数学 数学
英語 英語
国語 国語
理科 理科
社会 社会