1

So I only want the name which appears twice in the response to show up italicized.I am a real noob so please help me out and be clear. I appreciate it http://dave-reed.com/book3e/Ch5/greet.html Here is the example website. I want your name only out of the response to be italicized.

<!DOCTYPE html>
<!-- saved from url=(0042)http://dave-reed.com/book3e/Ch5/greet.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   <title> Greetings </title>
 </head>

 <body>
   <h2>Greetings</h2>
   <p>
     Enter your name: <input type="text" id="nameBox" size="12" value="">
   </p>
   <input type="button" value="Click for Greeting" onclick="document.getElementById('outputDiv').innerHTML=
                     'Hello ' + document.getElementById('nameBox').value + 
                     ', welcome to my page.<br>Do you mind if I call you ' +
                     document.getElementById('nameBox').value + '?';"> 
   <hr>
   <div id="outputDiv"></div>

</body></html>
  • Welome to Stack Overflow. Your question is getting downvoted because it doesn't quite meet the criteria at http://stackoverflow.com/help/on-topic . One thing missing from your question is any explanation of what you have tried to achieve the result. A simple google of 'HTML italic' will get you started. – GreenAsJade Jan 26 '14 at 04:56

2 Answers2

0
<!DOCTYPE html>
<!-- saved from url=(0042)http://dave-reed.com/book3e/Ch5/greet.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
   <title> Greetings </title>
<style type="text/css">
.italic {
    font-style:italic;
}
</style>
 </head>

 <body>   
<h2>Greetings</h2>
   <p>
     Enter your name: <input type="text" id="nameBox" size="12" value="">
   </p>
   <input type="button" value="Click for Greeting" onclick="document.getElementById('outputDiv').innerHTML=
                     'Hello <span class=\'italic\'>' + document.getElementById('nameBox').value + 
                     '</span>, welcome to my page.<br>Do you mind if I call you <span class=\'italic\'>' +
                     document.getElementById('nameBox').value + '</span>?';"> 
   <hr>
   <div id="outputDiv"></div>
</body></html>
Anton Stahl
  • 186
  • 1
  • 2
  • 19
0

Create a new CSS rule:

.test{
    font-style: italic;
}

Then add <span class=\'test\'> </span> around each instance of the name, like this...

 <body>
   <h2>Greetings</h2>
   <p>
     Enter your name: <input type="text" id="nameBox" size="12" value="">
   </p>
   <input type="button" value="Click for Greeting" onclick="document.getElementById('outputDiv').innerHTML=
                     'Hello <span class=\'test\'>' + document.getElementById('nameBox').value + 
                     '</span>, welcome to my page.<br>Do you mind if I call you <span class=\'test\'>' +
                     document.getElementById('nameBox').value + '</span>?';"> 
   <hr>
   <div id="outputDiv"></div>

</body>

View fiddle here

Birrel
  • 4,754
  • 6
  • 38
  • 74
  • The class doesn't need to be named `test` - you can call it anything you'd like (following CSS naming guidelines) so long as you make sure to change the class name in the `span` tags. – Birrel Jan 26 '14 at 04:51