We Keep Coding

Javascript; nested for-loop not working

var divs = [];
for (var x = 0; x <= nodeArray.length; x++) {
for (var q = 0; q <= nodeArray.childElementCount; q++) {
divs[x][q] = nodeArray[x].childNodes[q].childNodes[0]
};
};
I need a two dimensional array of the child of every child of a div for multiple divs.
Can't get it to work ;c
Anyone knows if this is even possible with javascript?
Thanks.
Edit:
Thanks guys, it works now! :D
I ended up doing it like this:
var divs = [];
nodeArray.forEach(function(array, index) {
divs[index] = nodeArray[index].children;
});
var imgs = [];
for (var x = 0; x < divs.length; x++) {
imgs[x] = [];
for (var y = 0; y < divs[x].length; y++) {
imgs[x][y] = divs[x][y].childNodes[0];
}
}
Using your feedback it works now! Really really really thanks! ;D

Arrays are 0-indexed, This means that the last element of an array is not at array.length but at array.length - 1.
You'll have to create a new array (sub-array) and then start adding elements to it.
Your code should be like this:
var divs = [];
for (var x = 0; x < nodeArray.length; x++) {
// here ^^^
divs[x] = []; // create a new sub-array (or divs.push([]);)
for (var q = 0; q < nodeArray.childElementCount; q++) {
// here ^^^
divs[x][q] = nodeArray[x].childNodes[q].childNodes[0];
};
};

var divs = [];
for (var x = 0; x <= nodeArray.length; x++) {
divs[x] = [];
for (var q = 0; q <= nodeArray[x].length; q++) {
divs[x][q] = nodeArray[x][q][0];
};
};

Remove attributes from html string - error with removeAttributeNode

I am trying to remove all attributes except for certain whitelisted ones from a long html string. I am using the DOM to parse it.
I know there are a lot of other questions about this, but my question is specifically about the error I am getting with executing removeAttributeNode in my code below.
var div = document.createElement('div');
div.innerHTML = '<p class=\"p\">text here</p> <div id=\"divId\"></div>';
var elements = div.getElementsByTagName('*');
var whitelist = ["src", "width", "height"];
for (var i = 0; i < elements.length; i++) {
if (elements[i].attributes.length !== 0) {
var attr = elements[i].attributes;
for (var j = 0; j < attr.length; j--) {
var attrName = attr[j].name;
for (var k = 0; k < whitelist.length; k++) {
if (attrName !== whitelist[k])
elements[i].removeAttributeNode(attr);
}
}
}
}
But, I keep getting the following error: Failed to execute 'removeAttributeNode ' on Element: the 1st argument provided is either null, or an invalid Attr object.
But, I checked with console statements and elements[i] is not null. For example, elements[0] = <p class="p">. How do I get removeAttributeNode to work? Thank you for your help!

In the last loop, do something like this.
for (var k = 0; k < whitelist.length; k++) {
if (attrName !== whitelist[k])
{
elements[i].removeAttributeNode(elements[i].getAttributeNode(attrName ));
}
}

JS: add a variable as a property (.) with (+)

If I am trying to add a variable as a property I get the error:
"Uncaught SyntaxError: Unexpected token +"
So basically I am trying to add a variable from a loop as a property to JSON like this:
var tables = ["table1", "table2", "table3"];
for (var x = 0; x < tables.length; x++) {
var item = $database. + tables[x];
console.log(item);
}
If i use (") like this
var item = "$database." + tables[x];
It works, but it becomes a string (if that's the proper name) so I can not view the JSON objects.
Why is this happening and Is this even possible to do?
Thanks!

Try this:
for (var x = 0; x < tables.length; x++) {
var item = $database[tables[x]];
console.log(item);
}
If your $database is dynamic and you don't want to have a hard-coded array of table names, you can also use Object.keys():
var tables = Object.keys($database);

you can use bracket notation:
for (var x = 0; x < tables.length; x++) {
var item = $database[tables[x]];
console.log(item);
}

Javascript create multidimensional array

I try to create a 4-dimensional array. I fill it dynamically and use content of it in another function. But the content is empty. Is there error below code?
var datas = []; // day number of a week
for(var i = 0; i < 7; i++) {
var size = 24*60/timeInterval;
datas[i] = [];
for(var j = 0; j < size; j++) {
var size2 = allCoords.length / 2;
datas[i][j] = [];
for(var k = 0; k < size2; k++) {
datas[i][j][k] = [];
}
}
}
I test below example :
function foo1()
{
datas[0][0][0].push(10);
}
function foo2()
{
document.getElementByID('result').innerHTML = datas[0][0][0];
}
I see only ,,,,,,,.

I think the principal problem is that you're getting the element where you want to show your result badly using getElementByID instead of getElementById. Also make sure that your element has innerHTML property to write the result, or alternatively use value.
I write the follow example using <textArea id="result"></textArea> and generating a button which calls foo1();foo2(); onClick an it works for me.
In the sample I use an random value for timeInterval and allCoords.length.
Note also that you want a 4-dimensional array however you're creating a 3-dimensional.
var timeInterval = 60;
var allCoords = { length : 1};
var datas = []; // day number of a week
for(var i = 0; i < 7; i++) {
var size = 24*60/timeInterval;
datas[i] = [];
for(var j = 0; j < size; j++) {
var size2 = allCoords.length / 2;
datas[i][j] = [];
for(var k = 0; k < size2; k++) {
datas[i][j][k] = [];
}
}
}
function foo1()
{
datas[0][0][0].push(10);
}
function foo2()
{
document.getElementById('result').value = datas[0][0][0];
}
<textArea id="result"></textArea>
<input type="button" value="foo" onclick="foo1();foo2();"/>
Hope this helps,

Saving a lot of variables from a series of classes

I want to save value in variables a more efficient way.
I tried writing a for loop:
for(i=1; i <= $('input').length; i++) {
var x+i = $('custom'+i).val());
}
what i got is: 'Uncaught SyntaxError: Unexpected token + '
this was actually expected that it wouldnt work but i have to try before asking here
the HTML
<input type="text" class="custom1">
<input type="text" class="custom2">
<input type="text" class="custom3">
till custom12..
I know i can do this:
var x1 = $('.custom1').val(),
x2 = $('.custom2').val(),
x3 = $('.custom3').val(),
till 12..
Is there a more efficient way to do it?

Use an array.
var x = [];
for(var i=1; i <= $('input').length; i++) {
x.push($('.custom'+i).val());
}

var x = [];
$('input').slice(0,11).each(function(index){
x.push($(this).val());
});
You can omit .slice(0,11) if there are actually only 12 inputs on the page.

You can try this
var arr = [];
var len = $('input').length;
for(var i=1; i <= len; i++) {
arr.push($('.custom'+i).val());
}
Most answer's above are correct, but all evaluating $('input').length every time,you can increase performance by evaluating it once and assign to a variable like len than use that len variable in loop.

Depending on what you want to do with the variables afterwards, you could also do:
var results = {};
for(i=1; i <= $('input').length; i++) {
results['x' + i] = $('.custom'+i).val());
}
This adds members to the ´results´ object so you can do:
var xOne = results.x1;
var xOneAgain = results['x1'];
var xOneLastTime = result['x' + 1];
Working Fiddle here.
Quentin's answer is probably the most natural one though.

var x = 0;
for(i=1; i <= $('input').length; i++) {
x += parseInt($('.custom'+i).val()) || 0;
}