Member Avatar for jtkiv

I've got a table in an html document im writing, and i have two separate cells which need to pull parallel information. For example, a book title and a summary. The book title and book summary need to be from the same book...

Ok, so i have one array with 20 lines. The first ten lines are the "titles" and the last ten are the "summaries". Ok, then i have this

var i = Math.floor(10*Math.random())
var j = i+10

Now, using this same external array, in my html file i need one cell to display variable i and another cell to display variable j. I need to somehow use this command,

document.write(r_text[i]);

in one cell and then

document.write(r_text[j]);

in another...

using this code,

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

and containing both "document.write" things in the .js file it works perfectly, but i need the information in the different cells.


Hope this is clear :D

  • 2 Contributors
  • 2 Replies
  • 115 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by jtkiv
Member Avatar for fxm

i have two separate cells which need to pull parallel information

This

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <meta name="generator" content=
    "HTML Tidy for Windows (vers 25 March 2009), see www.w3.org">
    <title></title>
    <script type="text/javascript">
var books = ["t0","t1","t2","t3","t4","t5","t6","t7","t8","t9","s0","s1","s2","s3","s4","s5","s6","s7","s8","s9"];
var choice = 7;
    </script>
  </head>
  <body>
    <table border="1">
      <tr>
        <td>
          <script type="text/javascript">
document.write(books[choice]);
          </script>
        </td>
        <td>
          <script type="text/javascript">
document.write(books[choice+10]);
          </script>
        </td>
      </tr>
    </table>
  </body>
</html>

is what the document.write approach would look like.

That is OK for a toy application but if there were many elements to be displayed the mixture of html and javascript would be a nightmare to maintain.

This

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <meta name="generator" content=
    "HTML Tidy for Windows (vers 25 March 2009), see www.w3.org">
    <title></title>
    <script type="text/javascript">
var books = ["t0","t1","t2","t3","t4","t5","t6","t7","t8","t9","s0","s1","s2","s3","s4","s5","s6","s7","s8","s9"];
var choice = 7;
    </script>
  </head>
  <body>
    <table border="1">
      <tr>
        <td id="left">
          L
        </td>
        <td id="right">
          R
        </td>
      </tr>
    </table>
	<script type="text/javascript">
		document.getElementById('left').firstChild.data=books[choice];
		document.getElementById('right').firstChild.data=books[choice+10];
	</script>
  </body>
</html>

shows one way to separate the script from the html. It will do what you want and is supported by all browsers.

Note: for this short-hand approach [using the .data property] to work, the target elements must contain at least one character at design time (in this case the 'L' and the 'R' placeholders). If you want to target elements that are empty at design time, use .createTextNode('...') instead.

Member Avatar for jtkiv

I need the javascript array to be external.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.