Verlinkung auf externe stylesheet-und javascript-Datei

Ich versuche zu verbinden, meine HTML-Homepage auf einem externen css stylesheet und eine externe javascript - (.js-Datei). Aus welchem Grund auch immer je nachdem, in welcher Reihenfolge ich Liste Sie in der HTML-Datei, nur einer von Ihnen funktionieren wird. Ich habe eine einfache alert-box in der Javascript-Datei, um zu testen, ob es funktioniert, und es funktioniert nur, wenn die javascript-Datei verknüpft ist ersten. Hier ist mein Werk...(ich bin ein HTML-noob übrigens auch)

<!doctype html>
<html lang="en">

<head>
<meta charset="utf-8 /> 
<link rel="stylesheet" href="trinity.css" />
<Script src="churchJavaScript.js"></script>
<title>Trinity Temple</title>
</head>

<body>

<div id="CompleteWrapper">

    <header id="headerSection">
        <h1> Trinity Temple</h1>
        <h3> &nbsp;&nbsp;And I sent messengers unto them, saying, I am         doing a great work, so that I cannot come down:  </br>
        &nbsp;&nbsp;why should the work cease, whilst I leave it, and come     down to you?  Nehemiah 6:3 </h3> 
    </header> 

<nav id="navSection">
    <ul>
        <li>Home</li>
        <li><a href="serviceInformation.html">Service Information</a></li>
        <li><a href="aboutUs.html">About Us</a></li>
        <li><a href="directory.html">Directory</a></li>
        <li><a href="contactUs.html">Contact Us</a></li>
    </ul>
</nav>

<section id="sectionSection">
    <h3> Welcome to Trinity Temple Church of God In Christ! </h3></br>
    <hr width = 75% size= "1" color="#b20000" />
    testing tolaslksdflksdflksdflkslkdslkjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslkdslkjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslkdslkjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslksadfsadfsdafsdadslkjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslkdslkjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslkdslkddddddjdslksfdlkdslkdslk</br>
    testing tolaslksdflksdflksdflkslkdslkjdslksfdlkdslkdslk</br>
</section>

<aside id="asideSection">
</aside>

<footer id="footerSection" >
    2900 Josephine St. </br>
    Denver, CO 80207
</footer>

</div>
</body>
</html>

hier ist der javascript-code in die externe Datei...

window.addEventListener("load", todaysDate, false);
function todaysDate(){
var currentTime = new Date();
var month = currentTime.getMonth() + 1;
var day = currentTime.getDate();
var year = currentTime.getFullYear();

var completeDate = document.getElementById("footerSection");
footerSection.innerHMTL = "Today's Date: " +completeDate;
alert(month + "/" + day + "/" + year);

}
window.addEventListener("load", todaysDate, false);

Auch, hier ist der code in der service-Informationen html-doc...

<!doctype html>

<html >
<head lang="en">
<meta charset="utf-8"/>
<script src="churchJavaScript.js"> </script>
<link rel="stylesheet" href="trinity.css"/>
<title> Service Information</title>
</head>

<body>

<div id="CompleteWrapper">
<header id="headerSection">

    <h1> Trinity Temple</h1>
    <h3> &nbsp;&nbsp;And I sent messengers unto them, saying, I am doing a     great work, so that I cannot come down:  </br>
    &nbsp;&nbsp;why should the work cease, whilst I leave it, and come down to      you?  Nehemiah 6:3 </h3> 
</header> 

<nav id="navSection">
<ul>

    <li><a href="index.html">Home</a></li>
    <li>Service Information</li>
    <li><a href="aboutUs.html">About Us</a></li>
    <li><a href="directory.html">Directory</a></li>
    <li><a href="contactUs.html">Contact Us</a></li>
</ul>
</nav>

<section id="sectionSection">
<h2> Service Information </h2></br>
<hr width = 75% size= "1" color="#b20000" />
<h3>Sunday</br></h3>
Sunday School: Sunday 9am - 10:30am </br>
Sunday Service: Sunday 10:30 - 1:00pm</br>
</br>
<h3>Wednesday</br></h3>
Bible Study: 6:30pm - 8:30pm
</br>





</section>

<aside id="asideSection">
</aside>

<footer id="footerSection" >

2900 Josephine St. </br>
Denver, CO 80207
</footer>

</div>
</body>
</html>

InformationsquelleAutor Theo Anderson | 2013-11-24

  1. 5

    Versuchen, diese in Ihrem <head> Abschnitt:

    <script type="text/javascript" src="churchJavaScript.js"></script>
<link href="trinity.css" rel="stylesheet" type="text/css" />

    Stellen Sie sicher Dreifaltigkeit.css, churchJavaScript.js und Ihre html-Datei sind im gleichen Ordner.

    Es ist etwas besser für die Leistung auf desktop-Webseiten zu setzen, die js vor dem css. Lesen Sie hier, warum.

    Die änderungen vorgenommen haben, bemerkte ich allerdings, dass, wenn ich navigieren Sie zu den service-Informationen Seite dann das javascript wird ausgeführt, aber es wird nicht laufen, auf keiner anderen Seite...irgendwelche Vorschläge?
    Ihr javascript ist heikel. Sie würde das hinzufügen der window.load event zweimal die machen die todaysDate Funktion zweimal ausgeführt. Noch wichtiger ist, footerSection.innerHTML wird in einem Fehler resultieren, da footerSection existiert nicht

    InformationsquelleAutor cronoklee

Schreibe einen Kommentar