HTML DOM - 샘플 By 팽

6. HTML DOM
    b. 選單開合操作範例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"></meta>
    <title>HTML DOM 選單開合操作</title>
    <script type="text/javascript">
    //alert("hello");
    function toggleMenu(number){
        var menu = document.getElementById("menu-" + number);
        menu.classList.toggle("hide");//切換標簽物件class的 hide的設定
    /*  if(menu.style.display == "none"){// 目前是none
            menu.style.display = "block";
        }else{
        menu.style.display = "none";// 目前是block
        }*/
    }
    </script>
    <style type = "text/css">
    .hide{display:none;}
    </style>
</head>
    <body>
    <div onclick = "toggleMenu(1);">florence1</div>
    <ul id = "menu-1">
        <li>1-0825</li>
        <li>1-0826</li>
        <li>1-0827</li>
    </ul>

    <div onclick = "toggleMenu(2);">florence2</div>
    <ul id = "menu-2">
        <li>2-0825</li>
        <li>2-0826</li>
        <li>2-0827</li>
    </ul>

    <div onclick = "toggleMenu(3);">florence3</div>
    <ul id = "menu-3">
        <li>3-0825</li>
        <li>3-0826</li>
    </ul>
    </body>
</html>

Reference

이 문제에 관하여(HTML DOM - 샘플 By 팽), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/oxiaobaio/items/e8aea503610a9e86c338

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

HTML DOM - 샘플 By 팽

Reference

좋은 웹페이지 즐겨찾기