4

I wish to call a javascript function from an HTML page and I do not want it dependent on any event. The function is in a separate .js file since I wish to use it from many web pages. I am also passing variables to it. I've tried this:

HTML:

<script type="text/javascript" src="fp_footer2.js">
footerFunction(1_basic_web_page_with_links, 1bwpwl.html);
</script>

The function in fp_footer2.js:

function footerFunction(path, file) {

document.write("<a href=" + path + "/" + file + " target='_blank'>Link to the original web page for this assignment.</a>");

return;
}

(I have also tried putting the fp_footer2.js file reference in the header, to no avail. I'm not sure if I can put it 'inline' like I did in this example. If not, please let me know.

PS: I know I can do this with a simple 'a href=""' in the HTML itself. I wanted to see if this could work, for my own curiosity.

Improve this question
5
  • look at the errors in your console, set-up a fiddle, and remember that document.write will overwrite the DOM, and take the scripts you loaded with it Commented Nov 5, 2012 at 17:27
  • 1
    You need quotes around the parameters you are passing into the function, but yes, you can execute arbitrary javascript without tying to an event just as you have done. Commented Nov 5, 2012 at 17:27
  • 1
    I'm confused, if you don't want it fired with an event, when exactly do you want it fired? Commented Nov 5, 2012 at 17:28
  • 1bwpwl.html probably needs to be "1bwpwl.html" Commented Nov 5, 2012 at 17:28
  • If a script block has a src defined, anything within the block will be ignored. Commented Nov 5, 2012 at 17:29

4 Answers 4

Reset to default
7

If a <script> has a src, then the external script replaces the inline script.

You need to use two script elements.

The strings you pass to the function also need to be actual strings and not undefined variables (or properties of undefined variables). String literals must be quoted.

<script src="fp_footer2.js"></script>
<script>
    footerFunction("1_basic_web_page_with_links", "1bwpwl.html");
</script>
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Thanks for that snippet, that worked fine! So I made two mistakes: not having quotes around the strings and trying to use a single script element.
0

JavaScript will run while your page is being rendered. A common mistake is to execute a script that tries to access an element further down the page. This fails because the element isn't there when the script runs.

So includes in the <head> will run before any DOM content is available.

If your scripts are dependent on the existence of DOM elements (like a footer!) try to put the script includes after the DOM element. A better solution is to use the document ready event ($(document).ready() in jQuery). Or window.onload.

The difference between documen ready and window onload is that document ready will fire when the DOM has been rendered; so all initial DOM elements will be available. Where as window onload fires after all resources have loaded, like images. window onload is useful if you're doing things with those images. Usually document ready is the right one.

Improve this answer

3 Comments

All the code is in the question. None of it tries to access an element that isn't available yet. It also uses document.write which has to run before the document is ready!
Where? (And you still can't document.write after document.close has been trigged by the DOM parsing finishing: jsfiddle.net/cZZTg )
Then I would argue not to use document.write. stackoverflow.com/questions/802854/…
0

Maybe I misunderstand your question, but you should be able to do something like this:

<script type="text/javascript" src="fp_footer2.js"></script>
<script type="text/javascript">
   footerFunction(1_basic_web_page_with_links, 1bwpwl.html);
</script>
Improve this answer

1 Comment

@Quentin Ah, just noticed that the same script tag had a reference to an external file and some inline script. See my updated answer.
-1

Have you tried calling it from a document.ready?

<script type="text/javascript">
  $(document).ready(function() {
    footerFunction(1_basic_web_page_with_links, 1bwpwl.html);
  });
</script>
Improve this answer

1 Comment

That $ function is undefined. If jQuery was loaded, then this would attempt to document.write after the DOM was ready … which is not something you should try to do. (because it is too late: jsfiddle.net/cZZTg )

Your Answer

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.