2015-11-03 55 views
1

内的DIV工作,这是我的HTML的getElementById没有为这是标签集

<div> 
<h1 class="main-header logic-head av-settings-head"></h1> 
<div class="col-xs-12 col-xs-12 col-lg-12 tabcontent" > 
    <form class="form-horizontal formtext col-xs-12 col-sm-10 col-lg-10 row"> 
     <div class="form-group"> 
      <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
       <label class="control-label">Name</label> 
      </div> 

      <div class="col-sm-5"> 
       <input id="NewobjectName" type="text" class="form-control" /> 
      </div> 
     </div> 
     <div class="form-group"> 
      <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
       <label class="control-label">Description</label> 
      </div> 
      <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
       <textarea id="objectDescription" rows="3" class="form-control"></textarea> 
      </div> 
     </div> 
     <div class="form-group"> 
      <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
       <label class="control-label">Type</label> 
      </div> 
      <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
       <select class="form-control"> 
        <option>M</option> 
        <option>C</option> 
        <option>CM</option> 
       </select> 
      </div> 
     </div> 
     <div class="form-group"> 
      <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
       <label class="control-label">IsActive</label> 
      </div> 

      <div class="col-sm-5"> 
       <input type="checkbox" checked="true" /> 
      </div> 
     </div> 
     <div class="form-group"> 
      <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
       <label class="control-label"> 
       </label> 
      </div> 
      <div class="clearfix"></div>    
      <!-- Groups Area Tables Start --> 
      <div class="row"> 

       <div role="tabpanel" class="tab_bg"> 
        <!-- Nav tabs --> 

        <div tabset justified="true" ng-if="clientScript.specification=='commonSpecific'"> 

         <div tab heading="ClientScript"> 
          <div class="tab-content pad25 users-area"> 
           <div role="tabpanel" class="tab-pane mart15 active" id="objectPermissions"> 
            <div class="form-group"> 
             <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
              <label class="control-label">Javascript Type</label> 
             </div> 
             <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
              <select class="form-control" ng-change="onEventChange(script.event)" ng-options="obj.eventName as obj.label for obj in events" 
                ng-model="script.event"> 
               <option value="">-select event-</option> 
              </select> 
             </div> 
            </div> 
            <div class="method-tab" id="method-tab"> 
             <div class="row form-group btnbg"> 
              <div class=" col-xs-12 col-sm-6 col-lg-12"> 
               <button class="btn btn-primary pull-right">ADD +</button> 
               <div class="clearfix"></div> 
              </div> 
             </div> 
             <div class="col-xs-12 col-sm-12 col-lg-12 well pad0"> 
              <div class="tabbable tabs-left"> 
               <ul class="nav nav-tabs method-right"> 
                <li class="active"><i></i><a href="#name" data-toggle="tab">Script 1</a></li> 
                <li class=""><i></i><a data-toggle="tab" href="#group-2">Script 2</a></li> 
                <li class=""><i></i><a href="#group-3" data-toggle="tab">Script 3</a></li> 
                <li class=""><i></i><a href="#group-4" data-toggle="tab">Script 4</a></li> 
               </ul> 
               <div class="tab-content content-left"> 
                <div class="tab-pane col-xs-12 col-sm-8 col-lg-12 pad0 marl19 active" id="name"> 
                 <div class="col-lg-12"> 
                  <h4>Javascript Editor</h4> 
                 </div> 
                 <div class="clearfix"></div> 
                 <div class="col-lg-12"> 
                  <div class="panel panel-default"> 

                   <div class="panel-body min-height"> 
                    <div id="editor"> 
                  function foo(items) { 
                   var i; 
                   for (i = 0; i &lt; items.length; i++) { 
                    alert("Ace Rocks " + items[i]); 
                   } 
                  } 
                  </div> 
                   </div> 
                  </div> 
                 </div> 
                 <div class="clearfix"></div> 
                </div> 
               </div> 
              </div> 
             </div> 
             <div class="row form-group btnbg"> 
              <div class=" col-xs-12 col-sm-6 col-lg-12"> 
               <button class="btn btn-primary pull-right">SAVE</button> 
               <div class="clearfix"></div> 
              </div> 
             </div> 
            </div> 
           </div> 
           <button id="saveObject" class="btn btn-primary" ng-click="save()"> 
            Validate 
           </button> 

          </div> 

         </div> 
         <div tab heading="SQL"> 

         </div> 
         <div tab heading="HTML"> 

         </div> 
        </div>      
       </div> 
      </div> 
      <div class="col-xs-12 col-sm-9 col-lg-7 btnbg"> 
       <button id="saveObject" class="btn btn-primary " ng-click="save()"> 
        SAVE 
       </button> 
      </div> 
     </div> 
    </form> 
</div> 

和我发现通过ID的元素是标签集的内部和ID名称为“编辑”,但它正在给空

和我的.js代码 var element=document.getElementById("editor");

ID为格“编辑”里面标签集的,所以我认为这是它之所以找不到它...所以会是什么成为替代方法处理这个(事情?

+0

会发生什么事,当你登录元素到控制台?另外,如果没有看到js就很难知道问题所在。 –

+0

另外,在javascript中为你的变量赋值var前面的那个 –

+0

为什么'''div'中有'javascript'代码..? –

回答

0

你的代码是否正常工作

var element = document.getElementById("editor"); 
 
snippet.log(element) 
 
snippet.log(element.innerHTML)
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 
 
<div> 
 
    <h1 class="main-header logic-head av-settings-head"></h1> 
 
    <div class="col-xs-12 col-xs-12 col-lg-12 tabcontent"> 
 
    <form class="form-horizontal formtext col-xs-12 col-sm-10 col-lg-10 row"> 
 
     <div class="form-group"> 
 
     <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
      <label class="control-label">Name</label> 
 
     </div> 
 

 
     <div class="col-sm-5"> 
 
      <input id="NewobjectName" type="text" class="form-control" /> 
 
     </div> 
 
     </div> 
 
     <div class="form-group"> 
 
     <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
      <label class="control-label">Description</label> 
 
     </div> 
 
     <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
 
      <textarea id="objectDescription" rows="3" class="form-control"></textarea> 
 
     </div> 
 
     </div> 
 
     <div class="form-group"> 
 
     <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
      <label class="control-label">Type</label> 
 
     </div> 
 
     <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
 
      <select class="form-control"> 
 
      <option>M</option> 
 
      <option>C</option> 
 
      <option>CM</option> 
 
      </select> 
 
     </div> 
 
     </div> 
 
     <div class="form-group"> 
 
     <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
      <label class="control-label">IsActive</label> 
 
     </div> 
 

 
     <div class="col-sm-5"> 
 
      <input type="checkbox" checked="true" /> 
 
     </div> 
 
     </div> 
 
     <div class="form-group"> 
 
     <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
      <label class="control-label"> 
 
      </label> 
 
     </div> 
 
     <div class="clearfix"></div> 
 
     <!-- Groups Area Tables Start --> 
 
     <div class="row"> 
 

 
      <div role="tabpanel" class="tab_bg"> 
 
      <!-- Nav tabs --> 
 

 
      <div tabset justified="true" ng-if="clientScript.specification=='commonSpecific'"> 
 

 
       <div tab heading="Scocu ClientScript"> 
 
       <div class="tab-content pad25 users-area"> 
 
        <div role="tabpanel" class="tab-pane mart15 active" id="objectPermissions"> 
 
        <div class="form-group"> 
 
         <div class="col-xs-12 col-sm-5 col-lg-3 paddnone"> 
 
         <label class="control-label">Javascript Type</label> 
 
         </div> 
 
         <div class="col-xs-12 col-sm-5 col-lg-5 paddnone"> 
 
         <select class="form-control" ng-change="onEventChange(script.event)" ng-options="obj.eventName as obj.label for obj in events" ng-model="script.event"> 
 
          <option value="">-select event-</option> 
 
         </select> 
 
         </div> 
 
        </div> 
 
        <div class="method-tab" id="method-tab"> 
 
         <div class="row form-group btnbg"> 
 
         <div class=" col-xs-12 col-sm-6 col-lg-12"> 
 
          <button class="btn btn-primary pull-right">ADD +</button> 
 
          <div class="clearfix"></div> 
 
         </div> 
 
         </div> 
 
         <div class="col-xs-12 col-sm-12 col-lg-12 well pad0"> 
 
         <div class="tabbable tabs-left"> 
 
          <ul class="nav nav-tabs method-right"> 
 
          <li class="active"><i></i><a href="#name" data-toggle="tab">Script 1</a> 
 
          </li> 
 
          <li class=""><i></i><a data-toggle="tab" href="#group-2">Script 2</a> 
 
          </li> 
 
          <li class=""><i></i><a href="#group-3" data-toggle="tab">Script 3</a> 
 
          </li> 
 
          <li class=""><i></i><a href="#group-4" data-toggle="tab">Script 4</a> 
 
          </li> 
 
          </ul> 
 
          <div class="tab-content content-left"> 
 
          <div class="tab-pane col-xs-12 col-sm-8 col-lg-12 pad0 marl19 active" id="name"> 
 
           <div class="col-lg-12"> 
 
           <h4>Javascript Editor</h4> 
 
           </div> 
 
           <div class="clearfix"></div> 
 
           <div class="col-lg-12"> 
 
           <div class="panel panel-default"> 
 

 
            <div class="panel-body min-height"> 
 
            <div id="editor"> 
 
             function foo(items) { var i; for (i = 0; i &lt; items.length; i++) { alert("Ace Rocks " + items[i]); } } 
 
            </div> 
 
            </div> 
 
           </div> 
 
           </div> 
 
           <div class="clearfix"></div> 
 
          </div> 
 
          </div> 
 
         </div> 
 
         </div> 
 
         <div class="row form-group btnbg"> 
 
         <div class=" col-xs-12 col-sm-6 col-lg-12"> 
 
          <button class="btn btn-primary pull-right">SAVE</button> 
 
          <div class="clearfix"></div> 
 
         </div> 
 
         </div> 
 
        </div> 
 
        </div> 
 
        <button id="saveObject" class="btn btn-primary" ng-click="save()"> 
 
        Validate 
 
        </button> 
 

 
       </div> 
 

 
       </div> 
 
       <div tab heading="Scocu SQL"> 
 

 
       </div> 
 
       <div tab heading="Scocu HTML"> 
 

 
       </div> 
 
      </div> 
 
      </div> 
 
     </div> 
 
     <div class="col-xs-12 col-sm-9 col-lg-7 btnbg"> 
 
      <button id="saveObject" class="btn btn-primary " ng-click="save()"> 
 
      SAVE 
 
      </button> 
 
     </div> 
 
     </div> 
 
    </form> 
 
    </div>

0

如果你想看到的DIV使用里面的值

var element=document.getElementById("editor"); 
alert(element.innerHTML); 

入住这link

+0

一旦你为bootset引导bootstrap.js,它将不起作用 –

+0

检查控制台是否有任何错误正在生成 – WisdmLabs