не присоединяется к родительскому div

У меня очень простая проблема с js, но я не могу понять. Почему мои промежутки не присоединяются к div? jQuery загружается просто отлично, страница не бросает никаких ошибок, а console.log выводит цикл правильно.не присоединяется к родительскому div

JS:

var matrix = []; 
createGrid(); 
function createGrid() { 

    for(var i=0; i < 6; i++) { 
     matrix[i] = []; 
     for(var j=0; j < 6; j++) { 
      log("["+i+"]["+j+"]"); 
      var $span = $('<span />'); 
      $("#myGrid").append($span); 
     } 
    } 
} 

function log (w) { 
     console.log(w); 
}

HTML:

<body> 
    <div id="myGrid"></div> 
</body>

Выход из консоли: Вы можете видеть, нет детей в настоящее время прилагаются ... Почему это?

<div id="myGrid"></div>

EDIT: я уже без ошибок консоли не были выброшены, так log() не было проблемой, так как я определил его в другом месте. Я действительно работал на пустом множестве, потому что HTML еще не загружен ... Мне нужно было иметь jquery в готовом режиме.

источник

2015-01-06 Growler

насчет 'вар $ поверочного = " тест "; '... только для целей тестирования – Hackerman

Прежде чем использовать его, вы должны определить' createGrid() '. Также не забудьте поставить свой JS-код внутри метода '$ (document) .ready()'. –

Он работает http://jsfiddle.net/dqrm07b2/ –

Если вы видите log() вызовы (это значит, как вы определили его где-то еще), это потому, что вы работаете на JavaScript до загрузки HTML, как вы можете см. здесь http://jsfiddle.net/dqrm07b2/1/

В принципе, операции на $('#myGrid').append($span) ничего не делают, потому что $('#myGrid') возвращает пустой набор.

Я знаю, что некоторым людям нравится эта функция молчаливой ошибки в jQuery, но я ее ненавижу. Попытка работать с пустым множеством должна вызывать ошибку, для меня скрыто столько ошибок.

источник

2015-01-06 18:57:39

Отличное описание проблемы, и я также ненавижу молчащие ошибки. Мне хотелось бы сказать, что это пустой набор, тогда я бы знал, что я работал до того, как был загружен HTML. – Growler

Возможно, вы пытаетесь запросить DOM перед его готовкой. Wrap весь код в функции JQuery, чтобы проверить, если это так:

$(function(){ 

//your code here 

});

Edit: В ответ на «Журнал не является функцией», вопрос гласит, что он способен видеть выход в консоли , Из этого я предположил, что console.log был псевдонимом: обертка функций, библиотечный помощник и так далее. Сообщение говорит, что он работает, и я бегу с ним.

В будущем следующие методы могут быть полезны для вас в отладке проблем DOM:

1) Положите предупреждение ($ («selector_you_want_to_test») [0]) Это приостановит браузер, и вы можете проверить состояние строительства DOM дерева в окне инструментов разработчика

2) Поместить в отладчике заявлении

3) Для очень крупных проектов: Возьмите профиль шкалы времени (в Google темэ), профиль покажет вам когда DOM был закончен и когда ваша функция запустилась. Эта точка зрения позволяет легко рассуждать о таких чувствительных по времени проблемах, как это.

Good Luck

источник

2015-01-06 18:50:03

Убрали мой ответ после этих downvotes, но для меня «log 'не является функцией JS. Я думаю, главная проблема - это то, что вы указали. – sodawillow

этот ответ не работает ... журнал не является функцией, подобной @sodawillow. переносите ли вы его в $ (function() {}); или нет. – indubitablee

@sodawillow Я не согласен с вопросом – geedubb

ты функция «войти» или что-то я думаю, что вы хотели, чтобы быть «console.log»

ваш код в противном случае делает то, что его должен делать, но я думаю, что это то, что вы на самом деле хотите, чтобы это сделать: http://jsfiddle.net/swm53ran/27/

var matrix = []; 
createGrid(); 
function createGrid() { 

    for(var i=0; i < 6; i++) { 
     matrix[i] = []; 
     for(var j=0; j < 6; j++) { 
      console.log("["+i+"]["+j+"]"); 
      var $span = "<span>["+i+"]["+j+"]</span><br/>"; 
      $("#myGrid").append($span); 
     } 
    } 
}

источник

2015-01-06 18:56:25 indubitablee

OP сказал, что на консоли не было ошибок, поэтому 'log' должен быть определен где-то в другом месте. –

Tryout код, как ниже и убедитесь, что ваш код после DIV или использовать document.ready():

<!DOCTYPE html> 
<html> 
<head> 
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> 
    <meta charset="utf-8"> 
    <title>JS Bin</title> 
    <style> 
     #myGrid { 
      position: relative; 
      width: 500px; 
      height: 500px; 
      background-color: silver; 
     } 

     #myGrid > span { 
      /* position: ;*/ 
      width : 20px; 
      height: 20px; 
      background-color: white; 
     } 


    </style> 

</head> 
<body> 
<div id="myGrid"></div> 
    <script> 
    var matrix = []; 
      createGrid(); 
      function createGrid() { 

       for(var i=0; i < 6; i++) { 
        matrix[i] = []; 
        for(var j=0; j < 6; j++) { 
         // console.log("["+i+"]["+j+"]"); 
         var span = '<span>'+i+'</span>'; 
         $("#myGrid").append(span); 
        } 
       } 
      } 
    </script> 
</body> 
</html>

Checkout этот DEMO: http://jsbin.com/nezinixaza/1/

источник

2015-01-06 19:01:24 SaidbakR

Уже есть два ответа, объясняющие это. –

Я начал писать и расследовать этот ответ, когда некоторые из этих ответов были написаны, поэтому я не хотел тратить время, которое я потратил, чтобы ответить на него. @JuanMendes – SaidbakR

не присоединяется к родительскому div

ответ

Смежные вопросы