Internes und externes JavaScript: Lernen Sie anhand von Beispielen

Sie können JavaScript-Code auf zwei Arten verwenden.

  1. Sie können entweder den JavaScript-Code einbinden intern in Ihrem HTML-Dokument selbst
  2. Sie können den JavaScript-Code beibehalten eine separate externe Datei und zeigen Sie dann in Ihrem HTML-Dokument auf diese Datei.

Was ist internes JavaScript?

Bisher haben wir Internal JS verwendet. Hier ist ein Beispiel –

<html>
<head>
  <title>My First JavaScript code!!!</title>
  <script type="text/javascript">
    // Create a Date Object
    var day = new Date();
    // Use getDay function to obtain todays Day.
    // getDay() method returns the day of the week as a number like 0 for Sunday, 1 for Monday,….., 5
    // This value is stored in today variable
    var today = day.getDay();
    // To get the name of the day as Sunday, Monday or Saturday, we have created an array named weekday and stored the values
    var weekday = new Array(7);
    weekday[0]="Sunday";
    weekday[1]="Monday";
    weekday[2]="Tuesday";
    weekday[3]="Wednesday";
    weekday[4]="Thursday";
    weekday[5]="Friday";
    weekday[6]="Saturday";
    // weekday[today] will return the day of the week as we want
    document.write("Today is " + weekday[today] + ".");
  </script>
</head>
<body>
</body>
</html>

Was ist externes JavaScript?

Sie planen, auf allen Ihren Webseiten das aktuelle Datum und die aktuelle Uhrzeit anzuzeigen. Angenommen, Sie haben den Code geschrieben und in alle Ihre Webseiten kopiert (z. B. 100). Aber later, möchten Sie das Format ändern, in dem das Datum oder die Uhrzeit angezeigt wird. In diesem Fall müssen Sie Änderungen auf allen 100 Webseiten vornehmen. Dies wird eine sehr zeitaufwändige und schwierige Aufgabe sein.

Also, speichern Sie das JavaScript Code in einer neuen Datei mit der Erweiterung .js. Fügen Sie dann auf allen Ihren Webseiten eine Codezeile hinzu, die wie folgt auf Ihre .js-Datei verweist:

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

Note: Es wird davon ausgegangen, dass sich die .js-Datei und alle Ihre Webseiten im selben Ordner befinden. Wenn sich die Datei external.js in einem anderen Ordner befindet, müssen Sie im src-Attribut den vollständigen Pfad zu Ihrer Datei angeben.

So verknüpfen Sie externes JavaScript

var currentDate = new Date();
var day = currentDate.getDate();
var month = currentDate.getMonth() + 1;
var monthName;
	
var hours = currentDate.getHours(); 
var mins = currentDate.getMinutes(); 
var secs = currentDate.getSeconds(); 
var strToAppend;
if (hours >12 )
{
	hours1 = "0" + (hours - 12);
strToAppend = "PM";
}
else if (hours <12)
{
	hours1 = "0" + hours;
	strToAppend = "AM";
}
else
{
	hours1 = hours;
	strToAppend = "PM";
}
	
if(mins<10)
mins = "0" + mins;
if (secs<10)
	secs = "0" + secs;

switch (month)
{
	case 1:
		monthName = "January";
		break;
	case 2:
		monthName = "February";
		break;
	case 3:
		monthName = "March";
		break;
	case 4:
		monthName = "April";
		break;
	case 5:
		monthName = "May";
		break;
	case 6:
		monthName = "June";
		break;
	case 7:
		monthName = "July";
		break;
	case 8:
		monthName = "August";
		break;
	case 9:
		monthName = "September";
		break;
	case 10:
		monthName = "October";
		break;
	case 11:
		monthName = "November";
		break;
	case 12:
		monthName = "December";
		break;
}

var year = currentDate.getFullYear();
var myString;
myString = "Today is " + day +  " - " + monthName + " - " + year + ".<br />Current time is " + hours1 + ":" + mins + ":" + secs + " " + strToAppend + ".";
document.write(myString);

Dies ist Ihr aktueller Standorttails.js-Datei. Machen Sie sich keine Sorgen, wenn Sie lange Codezeilen sehen. Sie werden bald lernen, zu programmieren. Nehmen Sie wie folgt Änderungen an Ihrem HTML-Dokument vor:

<html>
	<head>
	   <title>My External JavaScript Code!!!</title>
	   <script type="text/javascript" src="currentdetails.js">
	   </script>
	</head>
	<body>
	</body>
</html>

Wann sollte interner und externer JavaScript-Code verwendet werden?

Wenn Sie nur über wenige Codezeilen verfügen, die spezifisch für eine bestimmte Webseite sind, ist es besser, Ihren JavaScript-Code intern in Ihrem HTML-Dokument zu belassen.

Wenn Ihr JavaScript-Code andererseits auf vielen Webseiten verwendet wird, sollten Sie erwägen, Ihren Code in einer separaten Datei aufzubewahren. Wenn Sie in diesem Fall einige Änderungen an Ihrem Code vornehmen möchten, müssen Sie nur eine Datei ändern, was die Codepflege erleichtert. Wenn Ihr Code zu lang ist, ist es auch besser, ihn in einer separaten Datei aufzubewahren. Dies erleichtert das Debuggen.