单击事件后打印脚本

问题描述

我正在一个项目中，正在使用JavaScript打印到HTML页面上。我希望能够单击 a >，然后执行脚本并以HTML格式打印。我有两个单独的JS文件，一个用于我正在使用的 a >的动画，另一个用于将文本打印到HTML。我已经在锚标记中尝试过onclick =“ document.write（'showFizzBuzz'）），但是在本地主机中遇到了一个违规错误，无法将onclick与document.write一起使用。截至目前，它只是在脚注下打印我的脚本。有什么建议吗？

下面是我的两个JS文件

$(function() {
    $('.btn-6')
        .on('mouseenter',function(e) {
            var parentOffset = $(this).offset(),relX = e.pageX - parentOffset.left,relY = e.pageY - parentOffset.top;
            $(this).find('span').css({ top: relY,left: relX })
        })
        .on('mouSEOut',left: relX })
        });
    $('[href=#]').click(function() { return false });
});

var sum;
var i;

document.write("Results!","<p>");

sum = 0;

for (let i = 1; i <= 1000; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
        document.write("FizzBuzz","<br>");
    } else if (i % 3 === 0) {
        document.write("Fizz","<br>");
    } else if (i % 5 === 0) {
        document.write("Buzz","<br>");
    } else {
        document.write(i,"<br>");
    }
}

和HTML

    <div class="wrap">
      <a class="btn-6" href="#" onclick = "(document.write('showFizzBuzz'))">FizzBuzz<span>. 
      </span></a>
    </div>

解决方法

您应该尽可能避免使用 内联事件 ，并且应该对.innerText()使用a方法。

您应该这样做-

document.querySelector('a.btn-6').addEventListener((e)=> {
  e.target.innerText = 'showFizzBuzz';
});

document.write html javascript