简体   繁体   中英

calling functions in html from external javascript file

This is a simple practical but I'm not sure what I'm doing wrong.
I have the following code in my external javascript file:

function myname(){
    document.write("Monique");  
}

function welcomeW(name){
    document.write("Welcome " + name + "!");
}

function welcomeR(name){
    return "Welcome " name "!";
}

I added this <script> tag to link to my html file:

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

I tried calling the functions in html using:

<script> myname(); </script>
<script> welcomeW(Monique); </script>
<script> welcomeR(Monique); </script>

when I wrote the function in html it worked, but in the external file nothing happens.

Monique , there is only one issue in your code, please use single quote (ie 'Monique') or double quote ("Monique") when you are passing argument, i thing you are getting "Uncaught ReferenceError: Monique is not defined" error message.

<script> myname(); </script>
<script> welcomeW("Monique"); </script>
<script> welcomeR("Monique"); </script>

Or use this.

<script> myname(); </script>
<script> welcomeW('Monique'); </script>
<script> welcomeR('Monique'); </script>

If a <script> has a src then the text content of the element will be not be executed as JS (although it will appear in the DOM).

You need to use multiple script elements.

  • a <script> to load the external script
  • a <script> to hold your inline code (with the call to the function in the external script)

You might have put the <script src="<your js file>" type="text/javascript"></script> at the wrong place in your html file. Try putting it in the <head></head> or before your body closing tag </body> .

Another common mistake is in <script src="<your js file>" type="text/javascript"></script> try entering the location of like for example: <script src="./index.js" type="text/javascript"></script> if your index.js file is in the same folder as your index.html.

Hope it helps

From whay you described, you are calling your functions and linking the js file in Html correctly. There's just a couple things that are causing errors.

  1. The welcomeR function has a littly syntax error. You are likely running into Uncaught SyntaxError: Unexpected identifier 'name' and *uncaught ReferenceError: myname is not defined". You needs to have "+" between the strings and name for the return statement of welcomeR to resolve this error. Use console.log() statements to check that your js file is running as you intended.

  2. When you are calling the functions in your html file with, you should have an uncaught syntax error where Monique is not defined. You just need to change the welcomeW and welcomeR function from

     <script> myname(); </script> <script> welcomeW(Monique); </script> <script> welcomeR(Monique); </script>

to

    <script> myname(); </script>
    <script> welcomeW("Monique"); </script>
    <script> welcomeR("Monique"); </script>

so you are passing strings in.

With this, you should be able to get "MoniqueWelcome Monique!" for your output.

  1. The last function welcomeR does not output anything into the output file because it is returning a str, and not changing the content of your external file. If you wish to have it also output into you file, write

     welcomeR("Monique")

as

  document.write(welcomeR("Monique"));

You forgot the + at the return. And you can just call the functions in your script.If you linked it correct then it should work.

And if you didn't know. Return doesn't print/write anything. It just returns. if you want to write it you just need to do this.

var welcomeR = return "Welcome " + name + "!"; and document.write(welcomeR);

 <script> function myname(){ document.write("Monique"); } function welcomeW(name){ document.write("<br/>" +"Welcome " + name + "!" + "<br/>"); } function welcomeR(name){ return "Welcome " + name + "!"; } myname(); welcomeW("Monique"); welcomeR("Monique"); </script>

确保将脚本函数调用放在脚本 src 标记之后。

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM