По какой-то причине Javascript загружается еще до загрузки моей страницы HTML / CSS - PullRequest
Новая
       0

По какой-то причине Javascript загружается еще до загрузки моей страницы HTML / CSS

0 голосов
/ 02 ноября 2018

Я действительно новичок в веб-разработке. По какой-то причине код Javascript (оповещения) загружается еще до загрузки моей страницы HTML / CSS. Я использую примеры предупреждений, чтобы увидеть, что происходит с кодом. В идеале он должен загружать всю веб-страницу до того, как отобразятся предупреждения. Я какое-то время смотрел в Google, и почти все говорили, что в конце я обращаюсь к файлу Java Script, и это то, что у меня есть. Это все еще не работает. 

    function go() {
	alert('hi');
	alert('hey there');
    }

    go();
		<header> 
			<nav>
				<h1 class = "second"> RESUMAKER </h1>
				<ul>
					<li><a href="build.html" target="_blank"><span> Build Your Resume </span></a></li>
					<li><a href="createaccount.html" target="_blank"><span> Create Account </span></a></li>
					<li><a href="signin.html" target="_blank"><span> Sign in </span></a></li>
					<li><a href="resources.html" target="_blank"><span> Resources </span></a></li>
					<li><a href="contacts.html" target="_blank"><span> Talk To Us </span></a></li>
				</ul>
			</nav>
		</header>

		<h1 class = "third"><strong> What we do? </strong></h1>
		<p> 1. We create your resume when you input information such as personal information, educational history, work experience and skills. </p>
		<p> 2. The inputted information will be collected, stored, converted and in turn generate arrays of information which can be transformed into a resume.</p>
		<p> 3. Then we let you select a predefined resume template all with different fonts and designs, to generate a resume. </p>
		<p> 4. After all that is done, we allow you to be able to download generated resume as a PDF, Google or Microsoft Word document. </p>

		<div class="footer">
  			<li><a href="build.html" target="_blank"> Build a resume </a></li>
			<li><a href="createaccount.html" target="_blank"> Create Account </a></li>
			<li><a href="signin.html" target="_blank"> Sign in </a></li>
			<li><a href="resources.html" target="_blank"> Resources </a></li>
			<li><a href="contacts.html" target="_blank"> Contact us </a></li>
		</div>

		<div class="icon-bar">
			<a href="#" class="facebook"><i class="fa fa-facebook"></i></a> 
			<a href="#" class="twitter"><i class="fa fa-twitter"></i></a> 
			<a href="#" class="google"><i class="fa fa-google"></i></a> 
			<a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
			<a href="#" class="youtube"><i class="fa fa-youtube"></i></a> 
		</div>

Ответы [ 2 ]

0 голосов
/ 02 ноября 2018

Вы можете установить время ожидания. Это заставит его ждать 20 миллисекунд перед запуском go. Кажется, что оповещения запускаются в тот момент, когда дом готов, и у него нет времени на рендеринг. В этом примере он рендерит, а затем предупреждает. 

var go = () => {
    alert('hi')
    alert('hey there')
}
window.addEventListener('load', async () => {
    await new Promise(resolve => {setTimeout(resolve, 20)})
    go()
})
<head>
    <title>Resumaker</title>
    <link rel="stylesheet" type="text/css" href="main.css">
    <!--<meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">-->
</head>

<body>

    <header> 
        <nav>
            <h1 class = "second"> RESUMAKER </h1>
            <ul>
                <li><a href="build.html" target="_blank"><span> Build Your Resume </span></a></li>
                <li><a href="createaccount.html" target="_blank"><span> Create Account </span></a></li>
                <li><a href="signin.html" target="_blank"><span> Sign in </span></a></li>
                <li><a href="resources.html" target="_blank"><span> Resources </span></a></li>
                <li><a href="contacts.html" target="_blank"><span> Talk To Us </span></a></li>
            </ul>
        </nav>
    </header>

    <h1 class = "third"><strong> What we do? </strong></h1>
    <p> 1. We create your resume when you input information such as personal information, educational history, work experience and skills. </p>
    <p> 2. The inputted information will be collected, stored, converted and in turn generate arrays of information which can be transformed into a resume.</p>
    <p> 3. Then we let you select a predefined resume template all with different fonts and designs, to generate a resume. </p>
    <p> 4. After all that is done, we allow you to be able to download generated resume as a PDF, Google or Microsoft Word document. </p>

    <div class="footer">
        <li><a href="build.html" target="_blank"> Build a resume </a></li>
        <li><a href="createaccount.html" target="_blank"> Create Account </a></li>
        <li><a href="signin.html" target="_blank"> Sign in </a></li>
        <li><a href="resources.html" target="_blank"> Resources </a></li>
        <li><a href="contacts.html" target="_blank"> Contact us </a></li>
    </div>

    <div class="icon-bar">
        <a href="#" class="facebook"><i class="fa fa-facebook"></i></a> 
        <a href="#" class="twitter"><i class="fa fa-twitter"></i></a> 
        <a href="#" class="google"><i class="fa fa-google"></i></a> 
        <a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
        <a href="#" class="youtube"><i class="fa fa-youtube"></i></a> 
    </div>


    <script type="text/javascript" src="main.js"></script>

</body>
0 голосов
/ 02 ноября 2018

Это произошло потому, что вы уже вызываете функцию go, как указано в вашем последнем утверждении (go();). Поэтому предупреждение выдается сразу после загрузки скрипта, что может быть раньше, чем загрузка страницы HTML / CSS.

Чтобы предотвратить это, удалите это утверждение, а затем вызовите функцию go из вашей HTML-страницы.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...