如何将执行mainApp.logOut()的按钮改为同功能可点击文本？

其实很容易实现，你只需要把按钮元素替换成普通的文本容器或者模拟链接的标签，保留原有的点击事件逻辑就行，下面给你两种常用的可行方案：

• 方案一：用<span>标签（推荐非跳转场景）
  这种方式更适合纯粹触发点击逻辑的场景，不会自带链接跳转的默认行为，同时可以通过简单的CSS让它看起来像可点击元素：

  <span onclick="mainApp.logOut()" style="cursor: pointer; color: #007bff; text-decoration: underline;">logOut</span>
  

  这里的cursor: pointer会让鼠标悬停时变成手型，color和text-decoration则模拟了网页链接的视觉样式，用户一眼就能识别这是可点击的内容。

• 方案二：用<a>标签（模拟传统链接样式）
  如果你想让它更贴近传统网页链接的外观，可以用<a>标签，但要注意阻止它的默认跳转行为，避免页面不必要的刷新或跳转：

  <a href="javascript:void(0)" onclick="mainApp.logOut()">logOut</a>
  

  href="javascript:void(0)"会让点击时只执行你的mainApp.logOut()函数，不会触发任何跳转动作。

最后提醒下：要确保mainApp.logOut()这个函数在全局作用域是可访问的，不然点击时可能会出现函数未定义的报错哦～

内容的提问来源于stack exchange，提问作者Joseph