使用角色按钮从span触发javascript函数时面临的问题

<div id="parentElement">
  <span id="triggerSpan">点击我触发函数</span>
</div>

<script>
  var parentElement = document.getElementById('parentElement');
  parentElement.addEventListener('click', function(event) {
    if (event.target.id === 'triggerSpan') {
      // 执行你的JavaScript函数
      yourFunction();
    }
  });

  function yourFunction() {
    // 在这里编写你的函数逻辑
    console.log('函数被触发了');
  }
</script>

<span id="triggerSpan">点击我触发函数</span>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  $('#triggerSpan').click(function() {
    // 执行你的JavaScript函数
    yourFunction();
  });

  function yourFunction() {
    // 在这里编写你的函数逻辑
    console.log('函数被触发了');
  }
</script>