与编写到文件中的普通JavaScript相比，您将如何编写嵌入HTML的JavaScript语句? [英] How would you write a statement that is JavaScript imbedded in HTML vs normal JavaScript that would be written into a file?

问题描述

您将如何编写下面的语句，即将JavaScript嵌入HTML并将其写入将要写入文件的普通JavaScript中?我正在进行拨动开关，我想在单击并完成转换后将拨动开关转到新的文件页面.为了使之成为可能，我需要知道该函数的非嵌入式版本.这就是它:

How would you write the statement bellow, that is JavaScript imbedded in HTML into normal JavaScript that would be written into a file? I am making a toggle switch, and I want to have the toggle after being clicked and going through the transformation go to a new file page. To make this possible I need to know the non-imbedded version of the function. This is what it is:

<div class="statement">Slide to Play!</div>
<div class="container">
<div class="play" onclick= "this.classId.toggle('active')"> 
<div class="inner-square"></div>
</div></div>

在JavaScript中，这是我无法使用的:

And in JavaScript this is what I have that doesn't work:

const transition = document.querySelector('play');
Promise.all(
    document.getElementById("play").onclick = function() {
        transition.addEventListener('transitionend', () => {
            console.log('Transition ended');
            location.assign("gamepage.html")
    }
);

Promise.all(
    
    })
).then(transition.addEventListener('transitionend', () => {
    console.log('Transition ended');location.assign("gamepage.html")});

推荐答案

是否有可能在DOM加载之前运行了javascript?根据此处的准则 $(document).ready等效，无需jQuery

Is it possible that the javascript is running before the DOM has loaded? Per the guidelines here $(document).ready equivalent without jQuery

使用以下代码包装您的JavaScript:

Wrap your javascript with the following:

document.addEventListener("DOMContentLoaded", function(event) { 
  //do work
});

这应确保在执行JavaScript之前已加载页面的整个HTML.如果它在嵌入时能正常工作，则可能是因为您提到过您的javascript先前已放置在结束标记之前-届时整个页面都已加载.

This should ensure that the whole HTML of the page has been loaded before your javascript is executed. If it was working while embedded, it may have been since you mentioned that your javascript was previously placed before the closing tag - the whole page was loaded by then.

这篇关于与编写到文件中的普通JavaScript相比，您将如何编写嵌入HTML的JavaScript语句?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！