|
|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| ||||||||||||||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
|
#1
|
|||
|
|||
|
Arrays
I can't seem to get the hang of arrays in javascript, but I feel like I need 'em, 'cause daaaang this is ugly and impractical(and just a portion of the entire code, something like 200 elements) can anyone tell me how to do? (Yes this is one of the few times that I actually do want some code examples)
Code:
a2mover.width=kcuf a2mover.height=ykcuf b2mover.width=kcuf b2mover.height=ykcuf c2mover.width=kcuf c2mover.height=ykcuf d2mover.width=kcuf d2mover.height=ykcuf a3mover.width=kcuf a3mover.height=ykcuf b3mover.width=kcuf b3mover.height=ykcuf c3mover.width=kcuf c3mover.height=ykcuf d3mover.width=kcuf d3mover.height=ykcuf a4mover.width=kcuf a4mover.height=ykcuf b4mover.width=kcuf b4mover.height=ykcuf c4mover.width=kcuf c4mover.height=ykcuf d4mover.width=kcuf d4mover.height=ykcuf |
|
#2
|
|||
|
|||
|
mover[letter][number][height]
mover[letter][number][width] this is a multidimensional array (aka arrays within arrays) the main array with every thing in it is mover and it is divided by [letter] then [letter] is divided by [number] and number has two values [height] and [width] so... mover[a][1][25px] = (the mover a1's height is 25px) mover[a][1][50px] = (the mover a1's width is 50px) mover[a][2][25px] = (the mover a2's height is 25px) mover[a][2][50px] = (the mover a2's width is 50px) mover[b][1][25px] = (the mover b1's height is 25px) mover[b][1][50px] = (the mover b1's width is 50px) i'm a visual learner so I think of this as... Code:
Array mover (
-> Array a (
-> Array 1 (
-> 25px
-> 50px
)
-> Array 2 (
-> 25px
-> 50ps
)
)
-> Array b (
-> Array 1 (
-> 25px
-> 50px
)
)
)
Last edited by aconway : November 19th, 2005 at 10:57 AM. |
|
#3
|
||||
|
||||
|
Something like this maybe?
Assuming that you're wanting to assign the values... Code:
var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;
function getObj(ref){
return((W3) ? document.getElementById(ref) :
(IE) ? document.all[ref] :
(NN) ? document.layers[ref] : null);
}
function assign_Val(n,arr,attr){
var kcuf='100px', ykcuf='100px';
for (var i= arr.length; i >= 0; i--){
for (var j= attr.length; j >= 0; j--){
for (var zero=0; n > zero; n--){
getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : ykcuf);
}
}
}
}
Code:
window.onload= function(){
assign_Val( 4, ['a','b','c','d'], ['width','height'] );
};
[EDIT] If you don't like the above array with the function call separate it off like Code:
var arrObj= ['a','b','c','d'];
window.onload= function(){
assign_Val( 4, arrObj, ['width','height'] );
};
Last edited by jsKid : November 19th, 2005 at 12:17 PM. |
|
#4
|
|||
|
|||
|
Quote:
sorry it took me so long to answer to the post, been away for a few days...just wanted to say thanx...big time! You have no idea how greatful I am, I really apreciate your help! |
|
#5
|
|||
|
|||
|
Quote:
Man this made me realise that I have such a long way to go...can some kind soul please load this code with remarks? The parts that I don't get are particularly the Code:
var W3= document.getElementById; var IE= document.all; // Opera7 as well var NN= document.layers; Code:
getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : bits...oh...and I thought you had to declare it as an array first? (the myarray=new Array; part) I guess I need to know more about the basics of arrays...like how do I asign a html id to an array so I can manipulate it later on? imarr=new Array; for (i=1; i<=5; i=i+1) { imarr[i]= 'imvar' + i }; imgindex = 2 imarr[imgindex].width= 200 <IMG ID=imvar1 SRC="katt.jpg"> <IMG ID=imvar2 SRC="katt.jpg"> <IMG ID=imvar3 SRC="katt.jpg"> [/code] Obviously this code won't work, but maybe you can see where I'm going with it? how do I do it? |
|
#6
|
||||
|
||||
|
Seeing that I am the one who provided the code, maybe I should
also be the one to describe it's usess.. though I'm sure others are capable as well. Code:
//------------------------------------------------------------------------
// Object Detection:
//------------------------------------------------------------------------
// Object detection is the testing of an object, property, or method to
// detect that a certain object, property, or method exists before using
// to releave a particular browser's user from countless errors.
var W3= document.getElementById;
var IE= document.all; // Opera7 as well
var NN= document.layers;
//------------------------------------------------------------------------
// function getObj()...
//------------------------------------------------------------------------
// Here is a function that returns a reference to an object depending on
// which browser they are using:
// For Example:
// W3 -- IE6, NN6, MozFF, Konqueror, Safari, ...
// IE -- IE, Opera7, ...
// NN -- NN, ...
function getObj(ref){
return((W3) ? document.getElementById(ref) :
(IE) ? document.all[ref] :
(NN) ? document.layers[ref] : null);
}
//------------------------------------------------------------------------
// function assign_Val()...
//------------------------------------------------------------------------
// This function takes the values assigned to each parameter and assigns
// them to each object specified in the array (assigned to the arr parameter).
//
function assign_Val(n,arr,attr){
// kcuf -- assumedly the width
// ykcuf -- assumedly the height
var kcuf='100px', ykcuf='100px';
// loops through the paramter arr (an array) and counts down backwards from
// the arrays length to zero (as KorRed Devil suggested is faster)
for (var i= arr.length; i >= 0; i--){
// loops through the parameter attr backwards, prepping the assignment
// of the 'width' or 'height'
for (var j= attr.length; j >= 0; j--){
// the paramter n is the number of objects that are in each group of
// the arr paramter.
// For Example:
// a1mover, a2mover, a3mover, a4mover, b1mover, b2mover, ...
for (var zero=0; n > zero; n--){
// Refer to the getObj function description above
//----------------------------------------------------------------
// .style[]
//----------------------------------------------------------------
// All objects have multiple methods to access them, or notations
// to visually format the access.
// - attr[j] could be either 'width' or 'height'
// the equivalent to the below notation is: ...style.width= ... but
// because we are not directly accessing the width or height, we must
// use this particular notation.
getObj(arr[i]+n+'mover').style[ attr[j] ]= ((attr[j] == 'width') ? kcuf : ykcuf);
}
}
}
}
This part, I felt, deserved another section to itself so.. Basically this code is an if/else statement, though formatted in a different notation. Code:
((attr[j] == 'width') ? kcuf : ykcuf); If you wanted it in if/else format it would be more redundant. Code:
if (att[j] == 'width'){
getObj(arr[i]+n+'mover').style[ attr[j] ]= kcuf;
}else{
getObj(arr[i]+n+'mover').style.[ att[j] ]= ykcuf;
}
The amount of space, coding it takes up really isn't all that different though it is better practice to have concision and readability. |
|
#7
|
||||
|
||||
|
Most objects, properties, and methods in javascript especially have
multiple ways to be accessed due to browser incompatibilities over the years... so many browsers have gone and taken the extra steps to include backwards compatibility and cross browser solutions... though in this case, it is merely for ease of using arrays. These are exactly the same thing... though the second can be used with more ease, as far as I am concerned... Code:
var arr= new Array(); var arr= []; |
|
#8
|
|||
|
|||
|
Quote:
My 2 cents on browser detection. I think setting up vars that indicate what sort of browser is running is bad. In this particular instance you won't run into any problems but if you rely on that detection to branch other scripts you could hit issues. The danger is that you might hit a browser that supports document.all but isn't IE. Having decided that the browser is IE your script then tries to use IE only methods which could then fail. If I was going to write a getObj script it I'd skip the browser detection and just use object detection within the function. Code:
function getObj(ref)
{
return document.getElementById ? document.getElementById(ref) : document.all ? document.all[ref] : document.layers ? document.layers[ref] : null;
}
__________________
Like the answers I give? Why not ask me directly at my forum. I'm always glad to help. Javascript scripts and tips can be found at Dynamic Tools. Check out DynamicTable, the best javascript table sorter around. Get reliable and affordable hosting at www.thinksmarthosting.com |
|
#9
|
||||
|
||||
|
Well--you're right. It could be misleading and lead me/others into
unexpected erros with the way that I was using my getObj function except that is where experience comes into play. I only use that setup cause I know what I am using works with certain browsers for sure... every now and again I have to ask, but even so... you're "ways" in general seem to be better. |
![]() |
| Viewing: Dev Shed Forums > Web Design > JavaScript Development > Arrays |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|
|