简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
按钮的innerHTML在屏幕上无法显示
P粉024986150
P粉024986150 2023-09-10 09:17:02
0
1
465

所以我在innerHTML上遇到了问题。我有一个空数组buttons，我使用for循环填充它。然后使用另一个for循环将每个按钮的innerHTML设置为"Info"，但是当我检查我的网站时，按钮仍然为空。

//数组
                let buttons = [];

                //循环问题
                for(let i = 0; i < 2; i++)
                {
                    //填充按钮数组的循环
                    for(let l = 0; l < 4; l++)
                {
                    buttons[l] = $(`#btn${l}`);
                } 

                //循环设置按钮的innerHTML
                for(let s = 0; s < buttons.length; s++)
                {
                    buttons[s].innerHTML = "Info";
                }


                }


            <!DOCTYPE html>
            <html lang="en">
            <head>
                <meta charset="UTF-8">
                <meta http-equiv="X-UA-Compatible" content="IE=edge">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title>Quiz Game</title>
            </head>
            <body>
            <!-- 主容器 -->
                <div class="main-container">
                    <!-- 头部 -->
                    <h1 class="header" id="header">Quiz Game</h1>

                    <!-- 按钮 -->
                    <button id="btn0"></button>

                    <button id="btn1"></button>

                    <button id="btn2"></button>

                    <button id="btn3"></button>
                </div>


            <script src="/library/jquery-3.6.3.min.js"></script>
            <script src="test1.js"></script>
            </body>
            </html>
P粉024986150
P粉024986150

全部回复(1)
P粉667649253
P粉6676492532023-09-11 00:06:53 1 楼

使用jQuery，你应该调用buttons[s].html("Info");来设置innerHTML。然而，在这里使用buttons[s].text("Info");更好，因为实际上字符串中没有任何HTML标签。

你也可以使用一个选择器来选择所有以"btn"开头的按钮，然后一次性设置它们的文本。

const buttons = $('[id^=btn]');
buttons.text('Info');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="btn0"></button>
<button id="btn1"></button>
<button id="btn2"></button>
<button id="btn3"></button>
点赞 +0
添加回复
热门专题
更多>
热门文章
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！