Создавайте динамически Divs внутри других Div Javascript

0

Я просто хочу задать простой вопрос. У меня этот код

<div id="mainContainer">
  <h2>Something</h2>
  <div id="leftColumn">
    <p><b>Left</b></p>
    <div id="dropContent">
      <div class="dragableBox hoehe1" id="box1">Box1 - 30</div>
      <div class="dragableBox hoehe2" id="box2">Box2 - 20</div>
      <div class="dragableBox hoehe3" id="box3">Box3 - 10</div>
      <div class="dragableBox hoehe4" id="box4">Box4 - 40</div>
      <div class="dragableBox hoehe5" id="box5">Box5 - 20</div> 
      <div class="dragableBox hoehe6" id="box6">Box6 - 10</div>
      <div class="dragableBox hoehe7" id="box7">Box7 - 20</div>
      <div class="dragableBox hoehe4" id="box8">Box8 - 10</div>
    </div>
  </div>
  <div id="rightColumn">
    <div id="dropBox" class="dropBox">
      <p><b>Right</b></p>
      <div id="dropContent2"></div>     
    </div>
  </div>
  <div class="clear"></div>
</div>

Который создает все те div, которые мне нужны. Я хочу иметь возможность создавать маленькие внутренние прямоугольники (box1, box2 и т.д.) Динамически с помощью функции javascript/jquery. Мне нужно, чтобы они находились внутри "левого", находящегося внутри "чего-то". Специфика для ящиков можно найти в классах dragableBox und hoehe *. Простыми словами, мне нужна javascriptфункция, чтобы создать exatcly то же самое, что HTML-теги делают в данный момент.

Любая помощь приветствуется. Заранее спасибо.

  • 0
    Мне нужна Java-функция, чтобы создать точно такой же .... java !== javascript .

3 ответа

1
Лучший ответ
var $div = $('<div class="dragableBox hoehe1" id="box1">Box1 - 30</div>');
$('#dropContent').append($div);

var $div = $('<div class="dragableBox hoehe2" id="box2">Box2 - 20</div>');
$('#dropContent').append($div);

//ETC....

Что-то вроде этого?

  • 0
    точно, спасибо!
  • 0
    Пожалуйста ;)
1

Что-то вроде этого - (поскольку вы используете идентификатор в поле, вы можете напрямую обращаться к нему с #. Вам не нужно беспокоиться, если он находится внутри слева или справа, насколько вы держите свои идентификаторы уникальными.)

var $div = $('<div>').text("something");
$('#box1').append($div);
$('#box2').append($div);
1

Вставить в конец контейнера

var MyValue = "Box2 - 20";
$('<div class="dragableBox hoehe1" id="box1">' + MyValue +'</div>').appendTo($('#dropContent')); 

Вставить в начале контейнера

var MyValue = "Box2 - 20";
$('<div class="dragableBox hoehe1" id="box1">' + MyValue +'</div>').prependTo($('#dropContent'));

Ещё вопросы

Сообщество Overcoder
Наверх
Меню