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

问题

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

回答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 ;-)

来源：https://stackoverflow.com/questions/16542178/can-we-use-a-variable-to-declare-a-div-in-javascript

标签

javascript

html

innerhtml