javascript - 按钮文本不会切换
问题描述
我不知道我在这里做错了什么,我一直在阅读我的 JS 书并在谷歌上搜索并搞砸了几个小时,但我一生都无法弄清楚我做错了什么。
HTML
<button id="sidebarButton" class="sidebarButton" onclick="toggle()"> >> </button>
JS
function toggle() {
if (document.getElementById("sidebarButton").innerHTML == " >> ") {
document.getElementById("sidebarButton").innerHTML = " << ";
} else if (document.getElementById("sidebarButton").innerHTML == " << ") {
document.getElementById("sidebarButton").innerHTML = " >> ";
}
}
解决方案
要根据切换原理更改元素上的文本,不需要使用if {}
条件。
function toggle(element) {
element.innerText = element.innerText === '>>' ? '<<' : '>>';
}
<button id="sidebarButton" class="sidebarButton" onclick="toggle(this)">>></button>
推荐阅读
- html - 不按比例缩放 SVG 图像以适应剩余空间
- dart - Dart 中的自定义命令行
- sql - Amazon Athena SQL 查询未产生所需结果 - 占总数的百分比
- amazon-web-services - 使用运算符处理失败的任务
- ios - 如何解决 iOS 14 破坏我的应用(在应用商店发布)的问题?
- javascript - Prototype、jQuery 和 Highcharts 的冲突问题
- java - 在 AppCompatActivity 中未调用 onRequestPermissionResult
- python - 在 pytorch 上计算 Monte carlo Dropout 的准确性
- r - RMarkdown 到 Microsoft Word 中的下划线
- node.js - 带有 sequelize 的打字稿:UserAdmin.belongsTo 调用的东西不是 Sequelize.Model 的子类