0

I want to put the current date and time in the footer of my XHTML website using an external JavaScript code. I'm aware of the function document.write, but how do I make an external script print date/time in different locations within a HTML?

External script: function date()

HTML: The date of today is date()

How do I achieve this?

3
  • what do you mean by external script? script downloaded from a different website?
    – Vikdor
    Aug 19, 2012 at 18:48
  • Tbh, I don't even know what to try. Most of the online examples only show using the document.write function. But I need to be able to call that function externally from anywhere within the HTML.
    – AntikM
    Aug 19, 2012 at 18:49
  • No. Just a script located in a different .js file; not inline or embedded.
    – AntikM
    Aug 19, 2012 at 18:49

4 Answers 4

6

Just include the script in your HTML:

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

and then call the function somewhere.

<script type="text/javascript">
    date();
</script>

Now you shouldn't be using document.write, instead make an element with an id and use JS to modify it.

JS:

function date() {
    document.getElementById('mydate').innerHTML = "your date code";
}

HTML:

<span id="mydate">this will get updated</span>
0
4

document.write is evil, you should learn about manipulation:

function date() {
  document.getElementById("date").innerHTML = new Date().toString()
}

and somewhere in your HTML:

<p>The date of today is <span id="date">?</span></p>

However, you need to remember and learn about sooo many things:

  • date() script needs to be executed after DOM was loaded (or at least after this <span> was)

  • relying on raw element IDs is not advised

  • innerHTML is kind of low-level

  • ...

1
  • Thanks for the tips! I've been only learning JS/CSS/HTML for a month or so. A total newbie :)
    – AntikM
    Aug 19, 2012 at 19:00
1

I'm guessing that by external script you mean an external .js file you've referenced in your head block, e.g. <script type="text/javascript" src="../randomscript.js"></script>.

In your HTML you'd need an element with an id of date.

<div id="date">?</date>

This is the div that will get updated. In your script you should write

var d = new Date();
document.getElementById('date').innerHTML = d;

You see, it doesn't really matter where you've referenced the script from, you can still access the DOM using an external script.

0
0

I assume an "external script" is a script loaded from an external server, that is, not from the website itself.

The remote script (date.js) simply consists of

function showDate(element) {
  element.text = new Date().toString();
}

On your website you then call this function

<script type="application/javascript" src="http://www.example.org/date.js"></script>
<p>Now is: <span id="date-element" /></p>
<script type="application/javascript">
showDate(document.getElementById('date-element'));
</script>

The advantage of passing an element to the function is that the function is generic and does not hard-code identifiers.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.