简体中文（ZH-CN）English（EN）繁体中文（ZH-TW）日本語（JA）한국어（KO）Melayu（MS）Français（FR）Deutsch（DE）
Rumah
Artikel
Soal Jawab
Kursus
Topik
Muat turun
Permainan
Kamus
kemas kini terkini

Rumah  >  Artikel  >  hujung hadapan web  >  如何通过Js代码实现标题的控制和添加信息

如何通过Js代码实现标题的控制和添加信息

一个新手
一个新手asal
2017-10-10 10:02:111616semak imbas


  • 实现效果

    • showTitle：当点击显示标题按钮时，将所有的标题显示出来

    • hideTitle：当点击隐藏标题按钮时，将所有的标题隐藏起来

    • addCity：当点击添加城市按钮时，会在原有的城市列表下新建一个城市名字

<!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title></title>
    <script>
        //        function showTitle() {
        //            var titleElement = document.getElementById("title");
        //            titleElement.style.display = "block";
        //        }
        //
        //        function hideTitle() {
        //            var titleElement = document.getElementById("title");
        //            titleElement.style.display = "none";
        //        }

        function addCity() {
            var newElement = document.createElement("li"); // <li></li>
            var textNode = document.createTextNode("重庆"); // 重庆
            newElement.appendChild(textNode); // <li>重庆</li>

            document.getElementById("city").appendChild(newElement);
        }    </script></head><body><h3 id="title" style="display: block">八维学院</h3><h3 id="title222" style="display: block">八维学院222</h3><p>选择城市</p><ul id="city">
    <li>北京</li>
    <li id="city_2">上海</li>
    <li>天津</li></ul><input type="button" onclick="showTitle()" value="显示标题"/><input type="button" onclick="hideTitle()" value="隐藏标题"/><input type="button" onclick="addCity()" value="添加城市"/><script>
    /*window.document.getElementById("title");*/
    var arr = document.getElementsByTagName("h3");
    console.log(arr[0]);
    console.log(arr[1]);</script></body></html>

Atas ialah kandungan terperinci 如何通过Js代码实现标题的控制和添加信息. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：如何用html5 canvas实现匀速运动Artikel seterusnya：如何通过JavaScript获取到导航条中的HTTP信息

Artikel berkaitan

Lihat lagi