can we use a variable to declare a div in JAVASCRIPT?

Question

I am working in Phone Gap-android.I wanted to set a SWIPE VIEW dynamically based on the length of the records.

How do i do that? After long time,I tried implementing the following code.Am I right or Wrong?

value= VALUE_FROM_DB.split("||");
            for (k=0;k<value.length;k++)
            {
                if (value[0] == paramName1)
                {
                      return unescape(value[k]);
                      console.log("no of swipe views ");
                  }
                   var val = k+1;
                  var ni = document.getElementById('swiper-wrapper');
                  var newdiv = document.createElement('div');
                  var divIdName = 'swiper-slide'+val;
                  console.log("div name: "+divIdName);
                  newdiv.setAttribute('id',divIdName);
                  newdiv.setAttribute('class','swiper-slide');
                  var cnt1 = '<div id="container'+val+'"><span><img src="img/abc'+val+'.png" style="float:left; " /></span><div id="abc'+val+'"><span><h5>'+value[k]+'</h5></span></div></div>';
        ---->     console.log("div_id :"+id);
                  document.getElementById(+divIdName).innerHTML=cnt1;
                  console.log("value_from_db:: "+value[k]);
                  ni.appendChild(newdiv);

While, trying to execute,that value does not print and I see an error as REFERENCE ERROR,id not defined andit is a blank screen where the DIV has to be viewed.

In the HTML code,I have given the following,

<div id="swipe_body">

        <div class="swiper-container swiper-threshold">
            <div class="swiper-wrapper">

            </div>
        </div>
    </div>

Is this possible or not? Have I committed any mistake?

AFTER "@nnnnnn" SUGGESTIONS I HAVE CHANGED AND IMPLEMENTED THE FOLLOWING CODE:

 var cnt1 = '<div id="container'+val+'"><span><img src="img/abc_'+val+'.png" style="float:left; " /></span><div id="abcd'+val+'"><span><h5>'+value[k]+'</h5></span></div></div>';
                 // console.log("div_id :"+id);
                  document.getElementById(divIdName).innerHTML=cnt1;
                  console.log("abcd values: "+value[k]);
                  ni.appendChild(newdiv);

but,i am getting the following error:

05-14 17:24:25.382: I/Web Console(17882): JSCallback Error: TypeError: Cannot set property 'innerHTML' of null at file:///android_asset/www/cordova-2.1.0.js:3727

"REFERENCE ERROR,id not defined" - That would be because the variable id is not defined. If you are trying to display the div's id you need to do that via a reference to the div in question. — nnnnnn
– nnnnnn, Commented May 14, 2013 at 11:40
@nnnnnn,i have declared it na?...i am taking about var cnt1 = '<div id="container'+val+'"><span><img src="img/abc'+val+'.png" style="float:left; " /></span><div id="abc'+val+'"><span><h5>'+value[k]+'</h5></span></div></div>'; ----> console.log("div_id :"+id); — user
– user, Commented May 14, 2013 at 11:41
You haven't declared it. You've set an id attribute on the newDiv element, but you haven't declared a variable called id. — nnnnnn
– nnnnnn, Commented May 14, 2013 at 11:42
i have edited my comment..i am taking about these 2 lines of code — user
– user, Commented May 14, 2013 at 11:45
So am I. By the way, the reason you get a "blank screen" where that div should be is that the reference error is stopping your script execution on that line so your elements never actually get appended to the page. Also you should remove the + from after the ( in document.getElementById(+divIdName). — nnnnnn
– nnnnnn, Commented May 14, 2013 at 11:47

Reinier Kaper · Accepted Answer · 2013-05-31 14:28:05Z

1

In order to get to the bottom of this, you'd need to check:

What 'divIdName' is set to
If 'swiper-slide(divIdName)' actually exists at the time you execute the script

The error basically says that you're trying to set the innerHTML of nothing, which in turn means the element you're trying to select doesn't exist.

If you console.log all your variables we can help you out better.

As a side note: you should really clean up your code and hoist your variables, it's really hard to debug spaghetti code ;-)

answered May 31, 2013 at 14:28

Reinier Kaper

1,1291 gold badge8 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

can we use a variable to declare a div in JAVASCRIPT?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related