admin管理员组

文章数量:1391991

I'm trying to change the text inside a h1 tag using the element id "greeting" and a external java script. I'm having trouble trying to figure out how to call upon my function init that has gathered variables and use them in the next function. Heres what I have so far.

HTML 

 <head>

    <title>Matt Beckley</title>
    <script type="text/javascript" src="script1.js"></script>
</head> 

<body>

 <h1 id="greeting">Wele!</h1>

 </body>
</html>

THE SCRIPT WHERE THE PROBLEM IS!

 window.onload = init;

 function init() 
 {
 var fullname=prompt("Please Enter you name!","Anonymous ");
(fullname == "Anonymous")? "Anonymous " : "";

 var nickname=prompt("Please Enter you nickname!"," None");
 (nickname == "None")? " None": ""; 
 }

 function writeGreeting()
 {
    document.getElementById("greeting").innerHTML= ?????????
 }

So I don't know how to make the last function work so that the h1 tag shows a name and a nick. w3schools only shows "Strings" and not the ability to call the other function. Anyone know how to do this?

I'm trying to change the text inside a h1 tag using the element id "greeting" and a external java script. I'm having trouble trying to figure out how to call upon my function init that has gathered variables and use them in the next function. Heres what I have so far.

HTML 

 <head>

    <title>Matt Beckley</title>
    <script type="text/javascript" src="script1.js"></script>
</head> 

<body>

 <h1 id="greeting">Wele!</h1>

 </body>
</html>

THE SCRIPT WHERE THE PROBLEM IS!

 window.onload = init;

 function init() 
 {
 var fullname=prompt("Please Enter you name!","Anonymous ");
(fullname == "Anonymous")? "Anonymous " : "";

 var nickname=prompt("Please Enter you nickname!"," None");
 (nickname == "None")? " None": ""; 
 }

 function writeGreeting()
 {
    document.getElementById("greeting").innerHTML= ?????????
 }

So I don't know how to make the last function work so that the h1 tag shows a name and a nick. w3schools only shows "Strings" and not the ability to call the other function. Anyone know how to do this?

  • javascript
Share Improve this question asked Jan 14, 2010 at 12:18 MattMatt 5576 gold badges15 silver badges27 bronze badges
Add a ment  | 

6 Answers 6

Reset to default 1

How about merging the init and writeGreeting functions:

window.onload = init;

function init() 
{
 var fullname=prompt("Please Enter you name!","Anonymous ");
 fullname = (fullname == "Anonymous")? "Anonymous " : "";

 var nickname=prompt("Please Enter you nickname!"," None");
 nickname = (nickname == "None")? " None": ""; 
 document.getElementById("greeting").innerHTML= "Wele " + fullname + " (" + nickname + ")";
}

p.s. Minor point of grammar - you probably want "Please enter your name", rather than "Please Enter you name", and similarly for the nickname prompt.

Why not use .inner​Text instead?

// Create two GLOBAL variables
var fullname = "";
var nickname = "";

function init() {
  fullname = /* ... */
  nickname = /* ... */
  // pass the nickname on to the greeting function
  writeGreeting(nickname);
}

// This function is remain separate, if you wish to call it again
// at a later time before a page-refresh.
function writeGreeting(name) {
  document.getElementById("greeting").innerHTML = name;
}

How about like this?

It will display "Wele fullname!" or "Wele nickname!" or "Wele Anonymous!" if you don't put any.

function init() {
     var fullname=prompt("Please Enter you name!");
     var nickname=prompt("Please Enter you nickname!");
     writeGreeting(fullname||nickname||"Anonymous");
}

function writeGreeting(name){
    document.getElementById("greeting").innerHTML= "Wele "+name+"!";
}

I like Dominic's solution. Just bear in mind that you should be careful with any data entered by a user. I would remend escaping string with escape() function, prior to using it.

e.g.

document.getElementById("greeting").innerHTML= "Wele " + escape( fullname ) +
                                               " (" + escape( nickname ) + ")";

Try this. Tested with ie, chrome and ff (all latest).

var msg = "Wele " + fullname + "(" + nickname + ")!";

var greetingElement = document.getElementById("greeting");

if(greetingElement.firstChild == null)
    greetingElement.appendChild(document.createTextNode(msg));
else
    greetingElement.firstChild.nodeValue = msg;

本文标签： Using Javascript to replace Text in HTML tag with innerHTML and functionsStack Overflow

版权声明：本文标题：Using Javascript to replace Text in HTML tag with innerHTML and functions - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744682595a2619503.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。