Skip to content

Commit c9b946b

Browse files
hi
1 parent ec8c825 commit c9b946b

18 files changed

+9593
-0
lines changed

Disorganized-Content/__CHEAT-SHEETS/_GENERAL-RESOURCES/awesome-resources/www.quackit.com/javascript/javascript_refresh_page.html

Lines changed: 785 additions & 0 deletions
Large diffs are not rendered by default.

Disorganized-Content/__CHEAT-SHEETS/_GENERAL-RESOURCES/awesome-resources/www.quackit.com/javascript/javascript_reserved_words.html

Lines changed: 632 additions & 0 deletions
Large diffs are not rendered by default.

Disorganized-Content/__CHEAT-SHEETS/_GENERAL-RESOURCES/awesome-resources/www.quackit.com/javascript/javascript_status_bar_messages.html

Lines changed: 435 additions & 0 deletions
Large diffs are not rendered by default.

Disorganized-Content/__CHEAT-SHEETS/_GENERAL-RESOURCES/awesome-resources/www.quackit.com/javascript/popup_windows.html

Lines changed: 858 additions & 0 deletions
Large diffs are not rendered by default.

Disorganized-Content/__CHEAT-SHEETS/_GENERAL-RESOURCES/awesome-resources/www.quackit.com/javascript/right.html

Lines changed: 486 additions & 0 deletions
Large diffs are not rendered by default.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,366 @@
1+
2+
<!DOCTYPE html>
3+
<html lang="en">
4+
5+
<!-- Mirrored from www.quackit.com/javascript/tutorial/external_javascript_file.cfm by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 26 Apr 2021 16:08:30 GMT -->
6+
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
7+
<head>
8+
<meta charset="utf-8">
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
11+
12+
<meta name="keywords" content="external javascript file, .js, javascript tutorial, code, function, source, learn, method, javascript dropdown menu, rollovers, form validation, pop up windows, scripting, jscript">
13+
<meta name="Description" content="Learn how to link to an external JavaScript file.">
14+
<link rel="canonical" href="external_javascript_file.html">
15+
16+
<title>External JavaScript File</title>
17+
18+
19+
<script src="../../../ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
20+
21+
22+
<link rel="shortcut icon" href="../../pix/favicon96.png">
23+
<link rel="apple-touch-icon" href="../../pix/apple-touch-icon.png">
24+
25+
26+
27+
<link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,700%7CKadwa:400,700" rel="stylesheet">
28+
29+
30+
<link href="../../common/css/master.42.min.css" rel="stylesheet">
31+
32+
33+
34+
<script>
35+
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
36+
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
37+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
38+
})(window,document,'script','../../../www.google-analytics.com/analytics.js','ga');
39+
40+
ga('create', 'UA-269964-1', 'quackit.com');
41+
ga('send', 'pageview');
42+
43+
</script>
44+
45+
</head>
46+
47+
<body>
48+
49+
50+
<header class="site-header">
51+
52+
53+
<div class="site-header-base">
54+
<div class="site-logo">
55+
<a title="Quackit Homepage" target="_top" href="https://www.quackit.com/"><img src="../../pix/quackit_logo_watermark.png" width="87" height="33" alt="Quackit Logo"></a>
56+
</div>
57+
58+
<button id="site-nav-toggler" class="site-nav-toggler" aria-expanded="false" aria-controls="site-nav">
59+
<span class="sr-only">Toggle navigation</span>
60+
&#9776;
61+
</button>
62+
</div>
63+
64+
65+
<nav id="site-nav" class="site-nav">
66+
<div class="site-links">
67+
68+
<ul>
69+
<li><a href="https://www.quackit.com/"><i class="fa fa-home"></i> <span class="sr-only">Home</span></a></li>
70+
<li><a href="https://www.quackit.com/html/">HTML</a></li>
71+
<li><a href="https://www.quackit.com/css/">CSS</a></li>
72+
<li><a href="https://www.quackit.com/scripting/">Scripting</a></li>
73+
<li><a href="https://www.quackit.com/database/">Database</a></li>
74+
</ul>
75+
76+
</div>
77+
<div class="site-search-top">
78+
79+
<form action="https://www.quackit.com/search/" id="cse-search-box-bottom" class="site-search">
80+
<div>
81+
<input type="hidden" name="cx" value="partner-pub-6331358926293806:98x0fk-bbgi">
82+
<input type="hidden" name="cof" value="FORID:10">
83+
<input type="hidden" name="ie" value="ISO-8859-1">
84+
<input type="text" name="q" size="20" class="site-search-input">
85+
<button type="submit" name="sa" class="site-search-button"><i class="fa fa-search"></i></button>
86+
</div>
87+
</form>
88+
89+
90+
91+
92+
93+
94+
95+
96+
97+
</div>
98+
</nav>
99+
100+
</header>
101+
102+
103+
104+
105+
<div class="main">
106+
<article class="content">
107+
108+
<h1 class="page-title">External JavaScript File</h1>
109+
110+
<div class="ad ad-top">
111+
<script async src="../../../pagead2.googlesyndication.com/pagead/js/f.txt"></script>
112+
<!-- Q Responsive Top -->
113+
<ins class="adsbygoogle responsive-top"
114+
style="display:block"
115+
data-ad-client="ca-pub-6331358926293806"
116+
data-ad-slot="2095624553"
117+
data-ad-format="auto"></ins>
118+
<script>
119+
(adsbygoogle = window.adsbygoogle || []).push({});
120+
</script>
121+
122+
</div>
123+
124+
<ul class="pager">
125+
126+
<li><a href="javascript_html.html"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> JavaScript HTML</a></li>
127+
128+
<li><a href="javascript_operators.html">JavaScript Operators <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a></li>
129+
130+
</ul>
131+
132+
<p class="lead">External JavaScript files are a great way to increase efficiency and improve maintainability across a website.</p>
133+
<p>You can place all your scripts into an external file (with a .js extension), then link to that file from within your HTML document. This is handy if you need to use the same scripts across multiple HTML pages, or a whole website.</p>
134+
135+
<p>To link to an external JavaScript file, you add a <code>src</code> attribute to the HTML <a href="https://www.quackit.com/html/tags/html_script_tag.cfm"><code>&lt;script&gt;</code></a> tag and specify the location of the external JavaScript file.</p>
136+
137+
<h2>Linking to an external JavaScript file</h2>
138+
<p>Here's an example of linking to an external JavaScript file. The file called <samp>external_javascript.js</samp> contains all the JavaScript code. So, there's no need to place any other JavaScript between the tags.</p>
139+
140+
<script src="../../common/js/codemirror/lib/codemirror.js"></script>
141+
142+
143+
<script src="../../common/js/codemirror/mode/htmlmixed/htmlmixed.js"></script>
144+
145+
146+
147+
<script src="../../common/js/codemirror/mode/css/css.js"></script>
148+
149+
<script src="../../common/js/codemirror/mode/javascript/javascript.js"></script>
150+
151+
<script src="../../common/js/codemirror/mode/xml/xml.js"></script>
152+
153+
154+
<div class="code-only">
155+
156+
157+
158+
159+
<textarea id="example1" autocomplete="off" spellcheck="false">&lt;script src&#x3d;&quot;external_javascript.js&quot;&gt;&lt;&#x2f;script&gt;</textarea>
160+
161+
162+
163+
164+
165+
166+
167+
168+
169+
</div>
170+
171+
172+
173+
<script>
174+
var exampleCode1 = CodeMirror.fromTextArea(document.getElementById("example1"), {
175+
mode: "htmlmixed",
176+
tabMode: "indent",
177+
styleActiveLine: false,
178+
lineNumbers: false,
179+
lineWrapping: true,
180+
theme: "q-dark"
181+
});
182+
</script>
183+
184+
<h2>Contents of your external JavaScript file</h2>
185+
<p>The code in your .js file should be no different to the code you would normally have placed in between the script tags.</p>
186+
<p>But remember, you don't need to add the <a href="https://www.quackit.com/html/tags/html_script_tag.cfm"><code>&lt;script&gt;</code></a> tag again &mdash; it is already on the HTML page calling the external file!</p>
187+
188+
<h2>Placement of the External JavaScript</h2>
189+
<p>External JavaScript files are commonly placed within the document's <a href="https://www.quackit.com/html/tags/html_head_tag.cfm"><code>&lt;head&gt;</code></a> tags. However, this is not a necessity. You can place the <a href="https://www.quackit.com/html/tags/html_script_tag.cfm"><code>&lt;script&gt;</code></a> element anywhere on the document.</p>
190+
<p>For performance reasons, JavaScript is often placed at the bottom of the document, just before the closing <a href="https://www.quackit.com/html/tags/html_body_tag.cfm"><code>&lt;body&gt;</code></a> tag. This allows the rest of the page to load first, before making the call to the external file.</p>
191+
<p>However, not all JavaScript can be placed at the bottom of the document. If another script on the page needs that particular piece of JavaScript at load time, you will need to place the external JavaScript before the script that needs it. </p>
192+
193+
194+
195+
<ul class="pager">
196+
197+
<li><a href="javascript_html.html"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> JavaScript HTML</a></li>
198+
199+
<li><a href="javascript_operators.html">JavaScript Operators <i class="fa fa-long-arrow-right" aria-hidden="true"></i></a></li>
200+
201+
</ul>
202+
203+
<div class="ad ad-bottom">
204+
<script async src="../../../pagead2.googlesyndication.com/pagead/js/f.txt"></script>
205+
<!-- Q Responsive Bottom -->
206+
<ins class="adsbygoogle responsive-bottom"
207+
style="display:block"
208+
data-ad-client="ca-pub-6331358926293806"
209+
data-ad-slot="4873379751"
210+
data-ad-format="auto"></ins>
211+
<script>
212+
(adsbygoogle = window.adsbygoogle || []).push({});
213+
</script>
214+
</div>
215+
216+
217+
</article>
218+
219+
220+
<div class="sidebar">
221+
222+
223+
<nav>
224+
<ul>
225+
<li>
226+
<h3><a href="index.html">JavaScript Tutorial</a></h3>
227+
<ul>
228+
<li><a href="introduction.html">Introduction</a></li> <li><a href="how_to_enable_javascript.html">How to Enable JavaScript</a></li>
229+
<li><a href="javascript_syntax.html">JavaScript Syntax</a></li>
230+
<li><a href="javascript_popup_boxes.html">JavaScript Popup Boxes</a></li>
231+
<li><a href="javascript_html.html">JavaScript and HTML</a></li>
232+
<li><a href="external_javascript_file.html">External JavaScript File</a></li>
233+
<li><a href="javascript_operators.html">JavaScript Operators</a></li>
234+
<li><a href="javascript_variables.html">JavaScript Variables</a></li>
235+
<li><a href="javascript_functions.html">JavaScript Functions</a></li>
236+
<li><a href="javascript_events.html">JavaScript Events</a></li>
237+
<li><a href="javascript_if_statements.html">JavaScript If Statements</a></li>
238+
<li><a href="javascript_switch_statement.html">JavaScript Switch Statements</a></li>
239+
<li><a href="javascript_while_loop.html">JavaScript While Loop</a></li>
240+
<li><a href="javascript_for_loop.html">JavaScript For Loop</a></li>
241+
<li><a href="javascript_try_catch.html">JavaScript Try Catch</a></li>
242+
<li><a href="javascript_escape_characters.html">JavaScript Escape Characters</a></li>
243+
<li><a href="javascript_void_0.html">JavaScript Void(0)</a></li>
244+
<li><a href="javascript_cookies.html">JavaScript Cookies</a></li>
245+
<li><a href="javascript_date_and_time.html">JavaScript Date and Time</a></li>
246+
<li><a href="javascript_arrays.html">JavaScript Arrays</a></li>
247+
<li><a href="two_dimensional_arrays.html">Two Dimensional Arrays</a></li>
248+
<li><a href="innerhtml_in_javascript.html">JavaScript innerHTML</a></li>
249+
<li><a href="unobtrusive_javascript.html">Unobtrusive JavaScript</a></li>
250+
<li><a href="javascript_summary.html">JavaScript Summary</a></li>
251+
</ul>
252+
</li>
253+
254+
<li><h3>JavaScript Reference</h3>
255+
<ul>
256+
<li><a href="../examples/index.html" title="">JavaScript Examples</a></li>
257+
<li><a href="../javascript_reserved_words.html" title="">JavaScript Reserved Words</a></li>
258+
<li><a href="../javascript_event_handlers.html" title="Introduction to the 12 JavaScript event handlers">JavaScript Event Handlers</a></li>
259+
<li><a href="../javascript_date_and_time_functions.html" title="Full listing of all JavaScript methods for dealing with date and time.">JavaScript Date and Time Functions</a></li>
260+
</ul>
261+
<li><h3>jQuery</h3>
262+
<ul>
263+
<li><a href="https://www.quackit.com/jquery/tutorial/" title="">jQuery Tutorial</a></li>
264+
<li><a href="https://www.quackit.com/jquery/examples/" title="">jQuery Examples</a></li>
265+
</ul>
266+
</li>
267+
<li><h3>JSON</h3>
268+
<ul>
269+
<li><a href="https://www.quackit.com/json/tutorial/" title="Data format for exchanging data between applications and different environments.">JSON Tutorial</a></li>
270+
</ul>
271+
<li>
272+
273+
274+
</ul>
275+
</nav>
276+
277+
<div class="ad ad-left">
278+
<script async src="../../../pagead2.googlesyndication.com/pagead/js/f.txt"></script>
279+
<!-- Q Responsive Middle -->
280+
<ins class="adsbygoogle"
281+
style="display:block"
282+
data-ad-client="ca-pub-6331358926293806"
283+
data-ad-slot="7187717753"
284+
data-ad-format="auto"></ins>
285+
<script>
286+
(adsbygoogle = window.adsbygoogle || []).push({});
287+
</script>
288+
</div>
289+
290+
</div>
291+
292+
293+
<div class="ads">
294+
295+
<div class="ad ad-right">
296+
297+
<script async src="../../../pagead2.googlesyndication.com/pagead/js/f.txt"></script>
298+
<!-- Q Responsive - Right -->
299+
<ins class="adsbygoogle"
300+
style="display:block"
301+
data-ad-client="ca-pub-6331358926293806"
302+
data-ad-slot="9157690018"
303+
data-ad-format="auto"></ins>
304+
<script>
305+
(adsbygoogle = window.adsbygoogle || []).push({});
306+
</script>
307+
</div>
308+
309+
</div>
310+
311+
312+
</div>
313+
314+
315+
<div class="searchbox-bottom">
316+
317+
<form action="https://www.quackit.com/search/" id="cse-search-box-bottom" class="site-search">
318+
<div>
319+
<input type="hidden" name="cx" value="partner-pub-6331358926293806:npmuvy-i8kk">
320+
<input type="hidden" name="cof" value="FORID:10">
321+
<input type="hidden" name="ie" value="ISO-8859-1">
322+
<input type="text" name="q" size="30" class="site-search-input">
323+
<button type="submit" name="sa" class="site-search-button"><i class="fa fa-search"></i></button>
324+
</div>
325+
</form>
326+
327+
<script src="http://cse.google.com/cse/brand?form=cse-search-box-bottom&amp;lang=en"></script>
328+
329+
330+
331+
</div>
332+
333+
334+
<footer>
335+
<p><a href="https://www.facebook.com/quackit.tutorials"><i class="fa fa-facebook-official"></i> Quackit on Facebook</a> </p>
336+
<p class="about"><a href="https://www.quackit.com/"><i class="fa fa-home"></i> Home</a> | <a href="https://www.quackit.com/about.cfm" rel="nofollow">About</a> | <a href="https://www.quackit.com/contact.cfm" rel="nofollow">Contact</a> | <a href="https://www.quackit.com/terms_of_use.cfm" rel="nofollow">Terms&nbsp;of&nbsp;Use</a> | <a href="https://www.quackit.com/privacy_policy.cfm" rel="nofollow">Privacy&nbsp;Policy</a></p>
337+
<p>&#169; Copyright 2000 - 2021 Quackit.com &nbsp;</p>
338+
</footer>
339+
340+
341+
<script src="../../common/js/spectrum/spectrum.js"></script>
342+
<script src="../../common/js/lightbox2-master/dist/js/lightbox.min.js" charset="utf-8"></script>
343+
344+
345+
<script>
346+
$(document).ready(function(){
347+
348+
$( "#site-nav-toggler" ).click(function() {
349+
350+
$( "#site-nav" ).toggle( "slow" );
351+
352+
});
353+
354+
});
355+
</script>
356+
357+
358+
<script>
359+
$(function(){var a=window.location.href;$(".sidebar nav a").each(function(){a==this.href&&$(this).closest("li").addClass("selected")})});
360+
361+
362+
</script>
363+
</body>
364+
365+
<!-- Mirrored from www.quackit.com/javascript/tutorial/external_javascript_file.cfm by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 26 Apr 2021 16:08:30 GMT -->
366+
</html>

0 commit comments

Comments
 (0)