/*
JavaScript Bible, Fourth Edition
by Danny Goodman
Publisher: John Wiley & Sons CopyRight 2001
ISBN: 0764533428
*/
<HTML>
<HEAD>
<TITLE>Array Concatenation</TITLE>
<SCRIPT LANGUAGE="JavaScript1.1">
// global variables
var arrayOne, arrayTwo, arrayThree, textObj
// initialize after load to access text object in form
function initialize() {
var form = document.forms[0]
textObj = form.original
arrayOne = new Array("Jerry", "Elaine","Kramer")
arrayTwo = new Array("Ross", "Rachel",textObj)
arrayThree = arrayOne.concat(arrayTwo)
update1(form)
update2(form)
showArrays()
}
// display current values of all three arrays
function showArrays() {
var form = document.forms[0]
form.array1.value = arrayOne.join("\n")
form.array2.value = arrayTwo.join("\n")
form.array3.value = arrayThree.join("\n")
}
// change the value of first item in Array Three
function update1(form) {
arrayThree[0] = form.source1.value
form.result1.value = arrayOne[0]
form.result2.value = arrayThree[0]
showArrays()
}
// change value of object property pointed to in Array Three
function update2(form) {
arrayThree[5].value = form.source2.value
form.result3.value = arrayTwo[2].value
form.result4.value = arrayThree[5].value
showArrays()
}
</SCRIPT>
</HEAD>
<BODY onLoad="initialize()">
<FORM>
<TABLE>
<TR><TH>arrayOne</TH><TH>arrayTwo</TH><TH>arrayThree</TH></TR>
<TR>
<TD><TEXTAREA NAME="array1" COLS=25 ROWS=6></TEXTAREA></TD>
<TD><TEXTAREA NAME="array2" COLS=25 ROWS=6></TEXTAREA></TD>
<TD><TEXTAREA NAME="array3" COLS=25 ROWS=6></TEXTAREA></TD>
</TR>
</TABLE>
<B>Enter new value for arrayThree[0]:</B><INPUT TYPE="text"
NAME="source1" VALUE="Jerry">
<INPUT TYPE="button" VALUE="Change arrayThree[0]"
onClick="update1(this.form)"><BR>
Current arrayOne[0] is:<INPUT TYPE="text" NAME="result1"><BR>
Current arrayThree[0] is:<INPUT TYPE="text" NAME="result2"><BR>
<HR>
textObj assigned to arrayTwo[2]:<INPUT TYPE="text" NAME="original"
onFocus="this.blur()"></BR>
<B>Enter new value for arrayThree[5]:</B><INPUT TYPE="text"
NAME="source2" VALUE="Phoebe">
<INPUT TYPE="button" VALUE="Change arrayThree[5].value"
onClick="update2(this.form)"><BR>
Current arrayTwo[2].value is:<INPUT TYPE="text" NAME="result3"><BR>
Current arrayThree[5].value is:<INPUT TYPE="text" NAME="result4"><P>
<INPUT TYPE="button" VALUE="Reset" onClick="location.reload()">
</FORM>
</BODY>
</HTML>
|
