Javascript.RU

Изменение страницы посредством DOM

Update: Более новый материал по этой теме находится по адресу https://learn.javascript.ru/basic-dom-node-properties.

Рассмотрим основные способы изменять DOM, вначале - в общих чертах, затем - на конкретном примере из жизни.

Чтобы создать новый элемент - используется метод document.createElement(тип).

var newDiv = document.createElement('div')

Тут же можно и проставить свойства и содержание созданному элементу.

var newDiv = document.createElement('div')
newDiv.className = 'my-class'
newDiv.id = 'my-id'
newDiv.style.backgroundColor = 'red'

newDiv.innerHTML = 'Привет, мир!'

Добавить новый элемент к детям существующего элемента можно методом appendChild, который в DOM есть у любого тега.

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

<ul id="list">
<li>Первый элемент</li>
</ul>

Список:

  • Первый элемент
// элемент-список UL
var list = document.getElementById('list')

// новый элемент
var li = document.createElement('LI')
li.innerHTML = 'Новый элемент списка'

// добавление в конец
list.appendChild(li)

Метод appendChild всегда добавляет элемент последним в список детей.

Новый элемент можно добавить не в конец детей, а перед нужным элементом.
Для этого используется метод insertBefore родительского элемента.

Он работает так же, как и appendChild, но принимает вторым параметром элемент, перед которым нужно вставлять.

parentElem.insertBefore(newElem, target)

Например, в том же списке добавим элементы перед первым li.

<ul id="list2">
<li>Первый элемент</li>
</ul>
  • Первый элемент
// родительский элемент UL
var list = document.getElementById('list2')
// элемент для вставки перед ним (первый LI)
var firstLi = list.getElementsByTagName('LI')[0]

// новый элемент
var newListElem = document.createElement('LI')
newListElem.innerHTML = 'Новый элемент списка'

// вставка
list.insertBefore(newListElem, firstLi)

Метод insertBefore позволяет вставлять элемент в любое место, кроме как в конец. А с этим справляется appendChild. Так что эти методы дополняют друг друга.

Метода insertAfter нет, но нужную функцию легко написать на основе комбинации insertBefore и appendChild.

Чтобы убрать узел из документа - достаточно вызвать метод removeChild из его родителя.

list.removeChild(elem)

Если родителя нет "на руках", то обычно используют parentNode. Получается так:

elem.parentNode.removeChild(elem)

Неуклюже, но работает.

Сделаем что-нибудь посложнее.

В качестве реального примера рассмотрим добавление сообщения на страницу.
Чтобы показывалось посередине экрана и было красивее, чем обычный alert.

Сообщение в HTML-варианте (как обычно, можно посмотреть, нажав кнопку):

<style>
.my-message {
   width:300px;
   height:110px;
   background-color:#F08080;
   text-align: center;
   border: 2px groove black;
}
.my-message-title {
  height:20px;
  font-size:120%;
  background-color:red;
}
.my-message-body {
  padding: 5px;
  height: 50px;
}
</style>

<div class="my-message">
  <div class="my-message-title">Заголовок</div>
  <div class="my-message-body">Текст Сообщения</div>
  <input class="my-message-ok" type="button" value="OK"/>
</div>

Как видно - сообщение вложено в DIV фиксированного размера my-message и состоит из заголовка my-message-title, тела my-message-body и кнопки OK, которая нужна, чтобы сообщение закрыть.

Кроме того, добавлено немного простых стилей, чтобы как-то смотрелось.

Показ сообщения состоит из нескольких этапов.

  1. Создание DOM-элементов для показа сообщения
  2. Позиционирование на экране
  3. Запуск функции удаления сообщения по клику на ОК

Для создания сколько-нибудь сложных структур DOM, как правило, используют либо готовые шаблоны и метод cloneNode, создающий копию узла, либо свойство innerHTML.

Следующая функция создает сообщение с указанным телом и заголовком.

function createMessage(title, body) {
  // (1)
  var container = document.createElement('div') 
  
  // (2)
  container.innerHTML = '<div class="my-message"> \
    <div class="my-message-title">'+title+'</div> \
    <div class="my-message-body">'+body+'</div> \
    <input class="my-message-ok" type="button" value="OK"/> \
  </div>'

  // (3)
  return container.firstChild
}

Как видно, она поступает довольно хитро. Чтобы создать элемент по текстовому шаблону, она сначала создает временный элемент (1), а потом записывает (2) его как innerHTML временного элемента (1). Теперь готовый элемент можно получить и вернуть (3).

Сообщение будем позиционировать абсолютно, в центре по ширине и на 200 пикселов ниже верхней границы экрана.

function positionMessage(elem) {
  elem.style.position = 'absolute'

  var scroll = document.documentElement.scrollTop || document.body.scrollTop
  elem.style.top = scroll + 200 + 'px'

  elem.style.left = Math.floor(document.body.clientWidth/2) - 150 + 'px'
}

Не вдаваясь в тонкости позиционирования - заметим, что для свойства top 200 пикселов прибавляются к текущей вертикальной прокрутке, которую браузер отсчитывает либо от documentElement либо от body - зависит от DOCTYPE и типа браузера.

При установке left от центра экрана вычитается половина ширины DIV'а с сообщением (у него стоит width:300).

Наконец, следующая функция вешает на кнопку OK функцию, удаляющую элемент с сообщением из DOM.

function addCloseOnClick(messageElem) {

  var input = messageElem.getElementsByTagName('INPUT')[0]

  input.onclick = function() {
    messageElem.parentNode.removeChild(messageElem)
  }

}

Обратите внимание, при получении элемента функции не используют DOM-свойства previousSibling/nextSibling.

Этому есть две причины. Первая - надежность. Мы можем изменить шаблон сообщения, вставить дополнительный элемент - и ничего не должно сломаться.
Вторая - это наличие текстовых элементов. Свойства previousSibling/nextSibling будут перечислять их наравне с остальными элементами, и придется их отфильтровывать.

Создадим одну функцию, которая выполняет все необходимые для показа сообщения операции.

function setupMessageButton(title, body) {

  // создать
  var messageElem = createMessage(title, body)

  // позиционировать
  positionMessage(messageElem)

  // добавить обработчик на закрытие
  addCloseOnClick(messageElem)

  // вставить в документ
  document.body.appendChild(messageElem)
}

Протестировать то, что получилось, нам поможет следующая кнопка:

<input 
  type="button" 
  value="Показать" 
  onclick="setupMessageButton('Привет!', 'Ваше сообщение')"
/>

Для этого примера вы можете:

Вы освоили основные способы изменения DOM, включая:

  • Создание элементов
  • Вставку элементов в DOM
  • Удаление элементов

Кроме того, посмотрели, как это работает, на реальном примере.


Автор: Nikitozz, дата: 20 июня, 2009 - 13:54
#permalink

Спасибо!
Особенно за живой пример!


Автор: simbiozis (не зарегистрирован), дата: 21 июля, 2009 - 14:12
#permalink

Может я невнимательно смотрел, но по-моему используемый в функции CreateMessage стиль "my-message-ok" не описан в соответствующем файле css.


Автор: Гость (не зарегистрирован), дата: 2 декабря, 2010 - 23:04
#permalink

я думаю, это можно пережить стиль будет дефолтным, серая кнопка-кирпич посередине родителя. не верх эстетики, конечно, но не переживайте так..


Автор: Гость (не зарегистрирован), дата: 25 сентября, 2009 - 19:08
#permalink

Вот такой вопрос. У меня есть форма из кнопок (что-то вроде кнопок на калькуляторе). Мне нужно, чтобы по нажатии на одну из кнопок другая кнопка меняла своё значение. То есть, допустим, у мня есть кнопка b1 со значением "Изменить кнопку b2":
input type="button" name="b1" value="Изменить кнопку b2"
и кнопка b2 с пустым значением:
input type="button" name="b2" value=""
Как сделать так, чтобы после нажатия на кнопу b1, кнопка b2 меняла значение на, напрмер, 7?


Автор: Гость (не зарегистрирован), дата: 26 сентября, 2009 - 18:52
#permalink

Вопрос снят: сам разобрался.


Автор: Guest (не зарегистрирован), дата: 2 июля, 2020 - 15:58
#permalink

24 и готова


Автор: Guest (не зарегистрирован), дата: 2 июля, 2020 - 15:58
#permalink

24 и готова


Автор: Гость (не зарегистрирован), дата: 30 сентября, 2009 - 15:39
#permalink

Спасибо огромное за статью - оч помогла.

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

Заранее благодарю =)


Автор: Гость (не зарегистрирован), дата: 4 февраля, 2010 - 21:09
#permalink

зафиксировать себе в переменную, что окно уже показано, но не закрыто и потом по условию наличия окна его либо делать, либо нет


Автор: Гость (не зарегистрирован), дата: 5 октября, 2009 - 17:04
#permalink

я так думаю, что приведенный пример справедлив только в случае, если на страничке только один элемент типа "button", либо если нужная нам кнопка находится самой первой по тексту.


Автор: Гость (не зарегистрирован), дата: 2 декабря, 2010 - 22:30
#permalink

что ж, думайте дальше, это ваше право.

там в функцию передается конкретный объект, и уже в нем ищется input, который, естественно, в конкретном объекте-сообщении только один.


Автор: Mehdi (не зарегистрирован), дата: 5 октября, 2009 - 23:48
#permalink

Теперь я понял как эти алерты делаются. Я использовал другой метод, создаю уже модель этого алерта внутри хтмл в видe блока и ставлю его visibility = "hidden" при нажатии на кнопку меняю visibility=)


Автор: Hank (не зарегистрирован), дата: 16 июня, 2020 - 21:48
#permalink

thanks! this is awesome! fence company lexington


Автор: Гость (не зарегистрирован), дата: 16 июня, 2020 - 22:40
#permalink

Автор: Гость (не зарегистрирован), дата: 20 октября, 2009 - 22:04
#permalink

Шикарная статья, хорошие практические примеры.


Автор: Гость (не зарегистрирован), дата: 5 ноября, 2009 - 15:55
#permalink

Вопрос такой: можно ли менять в новом элементе outerHTML?


Автор: Mikke (не зарегистрирован), дата: 10 ноября, 2009 - 09:46
#permalink

супер! респект!


Автор: Гость (не зарегистрирован), дата: 18 ноября, 2009 - 14:50
#permalink
function getElementsByClass(searchClass,node,tag) {
    var classElements = new Array();
    if ( node == null )
        node = document;
    if ( tag == null )
        tag = '*';
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp('(^|\\\\s)'+searchClass+'(\\\\s|$)');
    for (i = 0, j = 0; i < elsLen; i++) {
        if ( pattern.test(els[i].className) ) {
            classElements[j] = els[i];
            j++;
        }
    }
    return classElements;
}


a=getElementsByClass('rounded');


      var i=0;
while (a[i])  {




    a[i].innerHTML='<table style="width:'+a[i].style.width+';" class="table" cellpadding="0" cellspacing="0"><tr><td class="t-l"></td><td class="top"></td><td class="t-r"></td></tr><tr><td class="left"></td><td>'+a[i].innerHTML+'</td><td class="right"></td></tr><tr><td class="b-l"></td><td class="bottom"></td><td class="b-r"></td></tr></table>';
    i++;

    }

Этот скрипт в конце страницы вствлен. Как Вы поняли он для простого создания блоков-таблиц с круглыми краями. Все прелестно, НО!
Когда такой блок внутри другого блока, то внутренний блок на рисуется. Как разрешить эту проблему.


Автор: данни - бой (не зарегистрирован), дата: 28 ноября, 2009 - 22:25
#permalink

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


Автор: Гость (не зарегистрирован), дата: 16 января, 2010 - 15:07
#permalink

Нет опасности в таких всплывающих окнах.


Автор: subzey, дата: 6 декабря, 2009 - 14:33
#permalink

Илья, быть может, я невнимателен и не заметил, но мне кажется, что будет полезным уточнить, что removeChild() лишь "открепляет" элемент от документа. но не удаляет его. После этого элемент можно снова "прицепить" в дерево DOM, и, возможно, в другом месте.

<p>Щелкните на элемент, чтобы поднять его в списке.</p>
<ul>
<li onclick="move(this)">Мясо</li>
<li onclick="move(this)">Молоко</li>
<li onclick="move(this)">Яйца</li>
<li onclick="move(this)">Рыба</li>
<li onclick="move(this)">Соки</li>
<li onclick="move(this)">Воды</li>
</ul>
<script>
	function move(o){
		var parent = o.parentNode;
		parent.removeChild(o);
		parent.insertBefore(o, parent.firstChild);
	}
</script>

Автор: Гость (не зарегистрирован), дата: 17 января, 2014 - 12:42
#permalink

Извините позднего гостя. Буду благодарен, если кто ответит.
Повторяю на всякий случай пример:

<p>Щелкните на элемент, чтобы поднять его в списке.</p>
<ul>
  <li onclick="move(this)">Мясо</li>
  <li onclick="move(this)">Молоко</li>
  <li onclick="move(this)">Яйца</li>[html]
  <li onclick="move(this)">Рыба</li>
  <li onclick="move(this)">Соки</li>
  <li onclick="move(this)">Воды</li>
</ul>
<script> 
function move(o){ var parent = o.parentNode;
  parent.removeChild(o); 
  parent.insertBefore(o, parent.firstChild); 
}          // самое интересное: правильно работает и без removeChild
</script>

Функция move(o) у меня почему-то правильно работает и без parent.removeChild.
Без parent.insertBefore происходит простое удаление элемента списка под курсором, и это понятно. Но без parent.removeChild я ожидал появление дубликатов, ан нет: элемент под курсором перемещается в начало списка как и прежде.


Автор: JuliusCaesar, дата: 19 января, 2014 - 20:02
#permalink

Метод insertBefore позволяет вставить новый элемент в DOM, либо переместить существующий. Ты применил к существующему, поэтому он и переместился. В твоем случае removeChild действительно не нужен)


Автор: StasAk (не зарегистрирован), дата: 8 декабря, 2009 - 17:42
#permalink

document.getElementById('text').innerHTML='';

но в IE 6 не сробатывает(


Автор: Гость (не зарегистрирован), дата: 10 декабря, 2009 - 00:53
#permalink

Объясните плиз, как можно удалить элемент из документа, если можно то полный код напишите.
function del()
{
var list = document.getElementById('list')
list.removeChild(li)
}

Заранее благодарю.


Автор: Гость (не зарегистрирован), дата: 24 марта, 2010 - 13:22
#permalink

замени
list.removeChild(li)
на
list.removeNode(list)

или
заведи элемент li
var list = document.getElementById('list')
var li=list.getElementsByTagName('LI')
list.removeChild(li)


Автор: Гость (не зарегистрирован), дата: 10 декабря, 2009 - 01:34
#permalink

Либо, чтобы при щелчке элемент не перемещался на верх, а удалялся


Автор: Гость (не зарегистрирован), дата: 10 декабря, 2009 - 01:45
#permalink

А, все, дошло, всем спасибо )))))


Автор: Гость (не зарегистрирован), дата: 10 декабря, 2009 - 01:53
#permalink

Терь другой вопрос, можно ли добавить объект на который можно применить "клик"???


Автор: Severus (не зарегистрирован), дата: 31 декабря, 2009 - 03:30
#permalink

Хм,интересная статья.Спасибо)Надо еще перемещать это окошко позволить


Автор: zero.module (не зарегистрирован), дата: 19 января, 2010 - 14:17
#permalink

Посмотрите на jQuery UI


Автор: Я (не зарегистрирован), дата: 23 января, 2010 - 05:56
#permalink

Не нравится мне этота функция создания!

function createMessage(title, body) {
  // (1)
  var container = document.createElement('div') 
  
  // (2)
  container.innerHTML = '<div class="my-message"> \
    <div class="my-message-title">'+title+'</div> \
    <div class="my-message-body">'+body+'</div> \
    <input class="my-message-ok" type="button" value="OK"/> \
  </div>'

  // (3)
  return container.firstChild
}

innerHTML должен использоваться только для создания текста в элементах страницы, а лучше вообще не использоваться! как-то не профессионально это! Я думаю нужно было исползовать container.createElement('div') а не container.innerHTML = '

', хотя возможно я и ошибаюсь, я сам в этом новичёк, если я не прав поправьте, но то что через DOM добраться к элементам, созданным через innerHTML не возможно - это факт, лично с этим сталкивался!


Автор: Илья Кантор, дата: 23 января, 2010 - 12:23
#permalink

Да, вы новичок, и поэтому вам не нравится. Создание через innerHTML - такой же надежный способ как и через DOM. При этом он зачастую проще, нагляднее и быстрее.


Автор: Гость (не зарегистрирован), дата: 27 января, 2010 - 05:49
#permalink

согласен на счёт innerHTML есть ряд сложностей, не помню в чём конкретно, но я с ними сталкивался, помоему IE не вешает события на динамически создаваемый элемент select и ещё какие то траблы были...
Так что при создании по настоящему сложного интерфейса лучше использовать DOM.


Автор: Гость (не зарегистрирован), дата: 27 января, 2010 - 05:54
#permalink

хотя возможно я чего то не догоняю, извините если туплю, пора спать ложиццо))


Автор: Гость (не зарегистрирован), дата: 22 февраля, 2010 - 14:02
#permalink

У меня тоже в IE6 (про более поздние версии не знаю) обработчик событий onclick, навешанный через innerHTML, не срабатывает. Не воспринимается и elem.onklick='...' (где elem - элемент DOM). Firefox'овский elem.setAttribute('onclick','...') IE6 тоже не понимает. Получается через outerHTML, напр.:

elem.outerHTML="" //-работает.

Но опять же outerHTML непонятен для Firefox...
Кто-нибудь знает универсальный способ ввести элемент DOM с обработчиком событий?


Автор: Гость (не зарегистрирован), дата: 15 апреля, 2010 - 16:08
#permalink

Любители ие6 чем-то похожи на людей, которые хотят не идти вперед вместе с прогрессом, а чтобы прогресс шел для них назад.

Так что совет - если не можете отказаться от ие6 - обратитесь к врачу. Иначе вы уподобляетесь средневековому невежде, которому проще облить грязью и заклеймить еретиком, чем попытаться понять что-то.


Автор: trikadin (не зарегистрирован), дата: 21 апреля, 2010 - 19:55
#permalink

Угу. В школе - уроки программирования на javascript (!), но при этом стоят IE6(!!!). Знаю, это ересь, но во такой у нас судьбец... На дом задают ДЗ Круто, да? Приходится знать особенности "лучшего" из браузеров)


Автор: Гость (не зарегистрирован), дата: 23 апреля, 2010 - 16:15
#permalink

C радостью бы отказался. Но сложно заставить отказаться 80% юзеров, которые будут смотреть мои страницы со скриптами с помощью IE


Автор: mc (не зарегистрирован), дата: 7 октября, 2010 - 18:30
#permalink

Универсальнее не бывает:

function Listen(obj, evt, fn) {
if (obj.addEventListener) obj.addEventListener(evt, fn, false);
else if (obj.attachEvent) obj.attachEvent('on' + evt, fn);
}


Автор: Гость (не зарегистрирован), дата: 5 февраля, 2010 - 20:50
#permalink

Не работает всё это в експлорерах 6 и 7-м.... что делать?

<select id="sel" name="sel" size="10" multiple="multiple">
  <option value="0">zero</option>
  <option value="1">one</option>
  <option value="2">two</option>
  <option value="3">three</option>
</select>

var value = document.getElementById('sel').value
var sel = document.getElementById('sel');
var text = sel.options[sel.selectedIndex].text;

var sel = document.getElementById('sel');
// создаем элемент option
var opt = document.createElement('option');
// определяем значение и текст нового элемента
opt.value = 4;
opt.innerHTML = 'four';
// добавляем option в конец select
sel.appendChild(opt);


Автор: Гром (не зарегистрирован), дата: 17 февраля, 2010 - 13:28
#permalink

Вопрос. А есть ли событие, которое срабатывает при удалении элемента? Чтобы обрабатывать момент когда элемент удаляется.


Автор: Гость (не зарегистрирован), дата: 7 марта, 2010 - 11:06
#permalink

А можно ли использовать innerHTML с window.open? Например:

function win(content){
 dop=wondow.open('',"test","");
 dop.innerHTML=content;
 return false;
}

Автор: Гость (не зарегистрирован), дата: 15 апреля, 2010 - 16:10
#permalink

Почитайте азы. Тогда таких вопросов не возникнет.


Автор: Гость (не зарегистрирован), дата: 11 апреля, 2011 - 07:34
#permalink

Азы читал, но конкретного ничего не нашел
В ИЕ работает а в FireFox нет


Автор: Сергей Сергеевич (не зарегистрирован), дата: 10 марта, 2010 - 22:27
#permalink

Подскажите, пожалуйста, как сделать создание и добавление скрипта в нужном месте страницы?
пример такой:

<html>
<head>
<script language="JavaScript" type="text/javascript">
function rrr(){
var elem = document.createElement("script");
elem.setAttribute("type", "text/javascript");
elem.setAttribute("src", "03_09.js");
h_data.appendChild(elem);}
</script>
</head>
<body onClick=rrr()>
<div id="h_data">
блок для сценария
</div>

<div id="h1_data">
блок после сценария
</div>
</body>
</html>

А проблема в следующем: при исполнении скрипта всё содержимое body меняется на содержимое скрипта.
содержимое скрипта:

document.write('<TABLE WIDTH=100% BORDER=1 CELLPADDING=2 CELLSPACING=2><COL WIDTH=125><COL WIDTH=60><COL><tr valign="top"><td><b> 9 марта </b></td><td><b>2010</b></td><td>получилось</td></tr></TABLE>');

у меня скрипт срабатывает в Chrome3 и Firefox3.6, в IE8 не срабатывает.
Заранее спасибо!


Автор: Гость (не зарегистрирован), дата: 14 марта, 2010 - 22:19
#permalink

А что DOM не работает с таблицами


Автор: Гость (не зарегистрирован), дата: 15 апреля, 2010 - 16:14
#permalink

Это, видимо, риторический комментарий.


Автор: Гость (не зарегистрирован), дата: 5 мая, 2010 - 19:02
#permalink

Суть не в содержании скрипта, а в методе реализации вызова скрипта - динамически (в зависимости от внешних параметров)


Автор: Гость (не зарегистрирован), дата: 15 марта, 2010 - 01:52
#permalink

Объясните, пожалуйста, что не срабатывает.
в скрипте использую:

document.all.listDiv.innerHTML = '<select name="t_width" id="t_width">'+list_arr[t_type]+'</select>';

соответственно в хтмл:

<div id="listDiv" style="display:inline;">
 <select name="t_width" id="t_width">
  <option value="0">&nbsp;&nbsp;&nbsp;</option>
 </select>
</div>

Выдает ошибку "document.all is undefined".
При чем ход скопирован с работающего скрипта с изменением только id.


Автор: zemaj, дата: 24 марта, 2010 - 19:29
#permalink

Спасибо, ответ уже не нужен. Оказалась проблема в самой винде. Скрипт стал работать после установки заплатки


Автор: Гость (не зарегистрирован), дата: 10 апреля, 2010 - 17:16
#permalink

Подскажите, пожалуйста, вот такой модуль

файл test.html

<html> 
<head>
		<title>Текст</title>
		<script src="test.js"></script>
</head>
<body>
	<h1>Тестовый файл</h1>
	<div id="MyElement" class="big" alpha="omega">55555</div>
	<div id="1">11111111111111111
		<div id="1_1">11</div>
		<div id="1_2">12</div>
	</div>	
	<div id="2">22222222222222222</div>
	var idf = "1_1"
	var df = "none"
	<input type="button" value="Запустить" onclick="test(idf,df)"/> 
</body>
</html>

файл test.js

function test(idf,df) 
    {
		window.document.getElementById(idf).style.display = df
	}

не работает....
пробовал и так

<input type="button" value="Запустить" onclick="test("1_2","none")"/>

не могу понять что не так.


Автор: Гость (не зарегистрирован), дата: 10 апреля, 2010 - 17:19
#permalink

ранее при каком-то варианте работало, что изменил уже не помню, но работать перестало


Автор: Гость (не зарегистрирован), дата: 10 апреля, 2010 - 18:04
#permalink
var idf = "1_1"
var df = "none"
<input type="button" value="Запустить" onclick="test(idf,df)"/>

этот вариант прошу не критиковать, зарапортовался....

вот так тоже не работает

<input type="button" value="Запустить" onclick="test("1_2","none")"/>

Автор: B@rmaley.e><e, дата: 10 апреля, 2010 - 21:23
#permalink

Вам подсветка синтаксиса в месте кавычек ни о чем не говорит?


Автор: Гость (не зарегистрирован), дата: 10 апреля, 2010 - 18:15
#permalink

Вот как!?

Правильно надо было так

<html> 
	<head>
		<title>Текст</title>
		<script src="test.js"></script>
	</head>
<body>
	<h1>Тестовый файл</h1>
	<div id="1">11111111111111111
		<div id="1_1">11</div>
		<div id="1_2">12</div>
	</div>	
	<div id="2">22222222222222222</div>
	<input type="button" value="Запустить" onclick="test('1_2','none')"/> 
</body>
</html>

'1_2','none' нужно ставить такие ' кавычки, а не такие "...

Но все равно, в чем смысл функции я думаю понятно.
Является ли это решение "разумным"?
Если кто-то подскажет, буду признателен.


Автор: Гость (не зарегистрирован), дата: 15 апреля, 2010 - 16:25
#permalink

Если глобальная цель была скрыть див по нажатию кнопки, то проще было написать строку из функции сразу в обработчик. Функция тут не нужна.

А вообще, учебник Вам в руки. Иначе программирование превратится в передвижение по комнате в темноте.


Автор: Гость (не зарегистрирован), дата: 24 мая, 2012 - 23:05
#permalink

window.onload = function(){
function test(idf,df){
window.document.getElementById(idf).style.display = df
}
}

может так ...


Автор: Гость (не зарегистрирован), дата: 26 мая, 2010 - 18:57
#permalink

Здравствуйте!
Вроде создал у себя документ как в примере:

<ul id="list2">
<li>Первый элемент</li>
</ul>

<script>
function da() {
// родительский элемент UL
var list = document.getElementById('list2')
// элемент для вставки перед ним (первый LI)
var firstLi = list.getElementsByTagName('LI')[0]

// новый элемент
var newListElem = document.createElement('LI')
newListElem.innerHTML = 'Новый элемент списка'

// вставка
list.insertBefore(newListElem, firstLi)
}
</script>

<a href="" onclick="da();">aaa</a>

Но создавать элемент - мой firefox отказывается, где я не прав?


Автор: Гость (не зарегистрирован), дата: 28 мая, 2010 - 03:12
#permalink

атрибут href у Вас пустой, если не требуется открывать по ссылке другой документ, вставляйте решетку (#).

<a href="#" onclick="da()">aaa</a>


Автор: Skipp, дата: 18 июня, 2010 - 12:44
#permalink

юпии я 50000 человек который посмортел утот пост, призы будут?
Сори за офтоп)


Автор: ARLEVNAR, дата: 18 июля, 2010 - 18:10
#permalink

Что то у меня не работает создание элемента не подскажете с чем может быть связано???

<html>
 <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1251">
  <title>Главная</title>
  <script src="js/lib.main.js" type="text/javascript"></script>
 </head>
 <body>
  
 </body>
</html>

А вот в принципе и JavaScript:

// JavaScript Document

   //alert('Проверка скрипта');
   var newDiv = document.createElement('div');
   //document.getElementsByTagName("BODY").style.margin = 0;
   //document.getElementsByTagName("BODY").style.padding = 0;
   //document.getElementsByTagName("BODY").style.textAlign = 'center';
   newDiv.id = 'main';
   newDiv.width = '1200px';
   newDiv.height = '500px';
   newDiv.style.marginLeft = 'auto';
   newDiv.style.marginRight = 'auto';
   newDiv.style.border = '1px solid black';
   newDiv.innerHTML = '<h1>ТЕСТ</h2>';

FireBug показывает элемент а вот в окне браузера текст не отображается (пользуюсь Mozilla Firefox 3.6.6)


Автор: Яростный Меч, дата: 28 августа, 2010 - 10:39
#permalink

Ну а где добавление созданного элемента на страницу?
Например, document.body.appendChild(newDiv);

Кстати, это должно произойти уже после формирования DOM. К примеру, в window.onload

"newDiv.width = '1200px';
newDiv.height = '500px';"

надо в стиле это указывать
newDiv.style.width = '1200px';
newDiv.style.height = '500px';


Автор: Гость (не зарегистрирован), дата: 6 сентября, 2010 - 10:14
#permalink

Не могу понять почему не работает код вида
document.createElement('li').innerHTML='New Element'


Автор: B@rmaley.e><e, дата: 6 сентября, 2010 - 15:12
#permalink

С чего Вы взяли, что он не работает? Очень даже работает.


Автор: vinet, дата: 2 декабря, 2010 - 00:23
#permalink

Как узнать входит ли элемент в родителя?

например

< div class="AA" >
< span class="BB" >Text< /span >
< /div >

Можно ли узнать, входит ли элемент спан.ВВ в див.АА?


Автор: B@rmaley.e><e, дата: 2 декабря, 2010 - 08:53
#permalink

Либо искать внутри див.АА спан.ВВ, либо идти от спан.ВВ по всем родителям и проверять, не является ли родитель див.АА.


Автор: Гость (не зарегистрирован), дата: 8 февраля, 2011 - 10:47
#permalink

Попробовал пример в "Добавление в DOM" на этой странице. Он мне выдал ошибку:
ошибка: Cannot call method 'appendChild' of null
вот. остальные сработали. если это зависит от браузера, то у меня Хром.


Автор: Гость (не зарегистрирован), дата: 7 апреля, 2011 - 10:54
#permalink

Все замечательно. Одно замечание по тексту статьи. Примеры со списками не запускаются пишет в FF list is null мне кажется не отрабатывает эта строка :
var list = document.getElementById('list') а не работает она из за того что не видит описание списка, которое выше пр тексту. Извините если не прав.


Автор: Гость (не зарегистрирован), дата: 9 апреля, 2011 - 12:50
#permalink
function createMessage(title, body) {
	var container = document.createElement('div')
	container.innerHTML = '<div class="my-message"> \
			<div class="my-message-title">'+title+'</div> \
			<div class="my-message-body">'+body+'</div> \
			<input class="my-message-ok" type="button" value="OK"/> \
		</div>'
		alert( container.firstChild ); 
  return container.firstChild
}

Выходит сообщение "null"

В чём дело может кто помоч ... плз ))


Автор: ACXap (не зарегистрирован), дата: 13 апреля, 2011 - 18:21
#permalink

<body>
<div>
   <div>
      <div>
         .....
<div id="content">
   <div>
      <div>
         .....
<div style="background: #BEDEF0;">
   <div>
      <div>
         .....
<div id="footer">
   <div>
      <div>
         .....
<div>
   <div>
      <div>
         .....
</body>

Имеется такой код(не полный), структура на всех страницах сайта повторяется, меняется только количество DIV, каким способом возможно удалить?

<div style="background: #BEDEF0;">
   <div>
      <div>
         .....

по id, его просто нет, по тегу, но количество элементов на каждой странице разное, по Name нельзя, по ClassName тоже. Перебирать все DIV и искать по стилю?

Автор: Гость (не зарегистрирован), дата: 20 августа, 2011 - 16:34
#permalink

В пункте "Добавление в конкретное место" заметил ошибку.

При нажатии на кнопку "Запустить" выдаёт ошибку.

Использую последнюю версию хрома.


Автор: Гость (не зарегистрирован), дата: 6 сентября, 2011 - 14:37
#permalink

+1
Добавление в DOM не работает


Автор: Андрей38, дата: 19 сентября, 2011 - 10:03
#permalink

как добавить свойство си эс эс clip не в листинге стилей,а в скрипте на Квери?
Это НЕработающий пример c клипом

<style>
#ros{
//оригинальноый синтаксис	
	clip: rect(auto,auto,auto,35px);
}
</style>
....
<script>
var wid=$('img').width()
$('#ret').css({'width':wid,'clip': 'rect'('auto','auto','auto','35px')})
</script>

Автор: m-xdt (не зарегистрирован), дата: 22 сентября, 2011 - 02:18
#permalink
var newDiv = document.createElement('div')
newDiv.className = 'my-class'
newDiv.id = 'my-id'

Ребята, не путайте свойства и атрибуты. В данном случае должна использоваться конструкция setAttribute, потому что все, что здесь указано - это атрибуты тэгов, и к свойствам узла DOM не имеют никакого отношения. Работать оно, конечно, будет и так (браузеры умные и создают свойства, аналогичные атрибутам), но правильно всё-таки через setAttribute, дабы не возникло путаницы.


Автор: olga153b, дата: 24 сентября, 2011 - 12:31
#permalink

Добавление в дом не работает дает
ошибка: list is null в ff


Автор: Questioner, дата: 2 ноября, 2011 - 12:44
#permalink

как читается DOM?


Автор: Гость (не зарегистрирован), дата: 7 декабря, 2011 - 20:30
#permalink

Если мечтаешь о радуге,будь готов попасть под дождь.


Автор: wp2 (не зарегистрирован), дата: 20 декабря, 2011 - 19:53
#permalink

долгое время не получалось добавить LI к существующему списку.

сделал так:

var a = document.body.getElementsByTagName('ul');
var newL = document.createElement('LI');
newL.innerHTML = "5";
a[0].appendChild(newL);

то есть, искать надо ul для начала. А потом брать нужный элемент с индексом!!!
(a[0] в нашем случае). Хз, может кому поможет.


Автор: Гость (не зарегистрирован), дата: 21 декабря, 2011 - 22:38
#permalink

ребята помогите пожалуста clearTimeout(menuTime)
menuTime=setTimeout(function(){
$ac_loading.show();
var new_w = $(window).width() - $title.outerWidth(true);
$menu.stop().animate({width:new_w + 'px'},700,toggleMenu('up'))

},700) function toggleMenu(dir){
$menuItems.each(function(i){
var el_title = $(this).children('a:first'),marginTop,opacity,easing;

if(dir == 'up'){
marginTop = '0px';
opacity = '1';
// easing = 'easeOutBack';

}
else if(dir == 'down'){
marginTop = '60px';
opacity ='0';
// easing ='easeInBack';
}
$el_title.stop().animate({'marginTop' : marginTop , 'opacity' : opacity },200+i*200);
})
}


Автор: Гость (не зарегистрирован), дата: 1 марта, 2012 - 05:57
#permalink

Сообщение не блокирует страницу. Наверное надо прозрачный слой под него подкладывать?


Автор: Гость (не зарегистрирован), дата: 17 мая, 2012 - 17:32
#permalink

Почему не работает этот пример, как хотелось быю Вместо элементов tr, td к таблица добавляются только input.

table = document.createElement("table");
for (i=0;i<3;i++) {
table.appendChild(
document.createElement("tr").appendChild(
document.createElement("td").appendChild(
document.createElement("input")
)
)
);
}


Автор: Я Есть Я ! (не зарегистрирован), дата: 25 декабря, 2012 - 11:46
#permalink

Помогите сделать, почти такое же окно.
Только в правом углу, и прямоугольное.
напишите мне полный текст, уже сделанного окна.
Если не сложно. у меня скрипт java как я понял это делается через
mpage (val). Я хочу сделать отдельный лог в игре . Варвары


Автор: Гость (не зарегистрирован), дата: 9 марта, 2013 - 14:09
#permalink

А чем можно заменить setupMessageButton ? на него ff ругается!


Автор: Наталья Вл (не зарегистрирован), дата: 29 июня, 2013 - 23:18
#permalink

Скажите пожалуйста а как например сделать чтобы при onClick появлялся постепенно текст? Например после одного щелчка появляется одна фраза, затем после второго щелчка вторая фраза и тд.


Автор: Гость (не зарегистрирован), дата: 9 июля, 2013 - 08:38
#permalink

С точки зрения программирования лучше будет создать переменную шага и наращивать её. То бишь описываем переменную. И с каждым нажатием кнопки значение делаем +1. И условием в зависимости от значения выдаем нужное сообщение.


Автор: dimka_68, дата: 25 июля, 2013 - 11:40
#permalink

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

var container = document.createElement('div');
container.innerHTML = '<div class="my-message"> \
<div class="my-message-title">'+title+'</div> \
<div class="my-message-body">'+body+'</div> \
<input class="my-message-ok" type="button" value="OK"/> \
</div>';

На выходе не 2 вложенных дива, а один.
Моя логика - создали элемент див и наполнили его ещё одним дивом. По моей логике, в итоге, должно получиться:

<div><div class="my-message"> ... </div></div>

В чём я ошибся, подскажите, пожалуйста?


Автор: Гость (не зарегистрирован), дата: 14 ноября, 2013 - 00:45
#permalink

В начале статьи есть ответ. Чтобы создать элемент по текстовому шаблону, нужен временный контейнер.


Автор: Art!P, дата: 10 апреля, 2014 - 16:01
#permalink

Все же в jQuery с DOM-ом удобнее работать


Автор: Гость (не зарегистрирован), дата: 1 июня, 2014 - 16:55
#permalink
dsfdfdfsdfsd

Автор: Гость (не зарегистрирован), дата: 21 июня, 2014 - 19:57
#permalink

здравствуйте! а зачем в функции используется обратный слеш (\) ?


Автор: Гость (не зарегистрирован), дата: 3 июля, 2014 - 21:40
#permalink

подскажите в чем ошибка ?
при введение в input текста ,функция send не возвращает никакого значения
почему?

function send(){
var d =document.getElementById('in').getAttribute('value');
console.log(d);
}


Автор: Гость (не зарегистрирован), дата: 3 июля, 2014 - 21:42
#permalink
[html]
подскажите в чем ошибка ?
при введение в input текста ,функция send не возвращает никакого значения[/html]

<input size="30" value="" id="in" type="text"/>
<input type="button" value="отправить" id="i" onclick="send()"/>

<script type="text/javascript">
function send(){
var d =document.getElementById('in').getAttribute('value');
console.log(d);
}
</script>

Автор: Влад31/08/2000, дата: 8 июля, 2014 - 13:12
#permalink

elem.parentNode.removeChild(elem)??
как насчет elem.outerHTML=""?


Автор: new_developer, дата: 29 июля, 2014 - 21:22
#permalink

скопировал всё с этого примера, почему-то после клика ошибка пишет что setupMessageButton не определена

window.onload = function() { 

	
		function createMessage(title, body) {
		  // (1)
		  var container = document.createElement('div') 
		  
		  // (2)
		  container.innerHTML = '<div class="my-message"> \
		    <div class="my-message-title">'+title+'</div> \
		    <div class="my-message-body">'+body+'</div> \
		    <input class="my-message-ok" type="button" value="OK"/> \
		  </div>'

		  // (3)
		  return container.firstChild
		}


		
		function positionMessage(elem) {

		    elem.style.position = 'absolute'

		    var scroll = document.documentElement.scrollTop || document.body.scrollTop
		    elem.style.top = scroll + 200 + 'px'

		    elem.style.left = Math.floor(document.body.clientWidth/2) - 150 + 'px'
		}

		function addCloseOnClick(messageElem) {

		    var input = messageElem.getElementsByTagName('INPUT')[0]

		    input.onclick = function() {

		    	messageElem.parentNode.removeChild(messageElem)

			}
		}


	function setupMessageButton(title, body) {

		  // создать
		  var messageElem = createMessage(title, body)

		  // позиционировать
		  positionMessage(messageElem)

		  // добавить обработчик на закрытие
		  addCloseOnClick(messageElem)

		  // вставить в документ
		  document.body.appendChild(messageElem)
	}

}
<input type="button" value="Показать" onclick="setupMessageButton('Привет!', 'Ваше сообщение')" />

Автор: systeamnik (не зарегистрирован), дата: 22 сентября, 2014 - 01:31
#permalink

За статью СПАСИБО помогло!
но подскажите возможно ли сохранить созданный элемент в html документе?
созданный элемент после обновления страница пропадает.
Например :

[js]
function c_element(){
			//добаление элемента к сущ. элементу
			var list = document.getElementById('list');
			//создаем новый элемент
			var li = document.createElement('LI');
			li.id = 'new-id';
			li.innerHTML = 'Новый элемент добавленный через JS';
			//добаление в конец
			list.appendChild(li);
			list.addCloseOnClick(li);
		}
		function x_element(){
			var x = document.getElementById('new-id');
			x.parentNode.removeChild(x);
		}
[/js]
		
	<a href="#" onclick="c_element()">Добавить</a>
	<a href="#" onclick="x_element()">Удалить</a>

	<br>
	<br>
	<ul id="list">
		<li>Перый</li>
		<li>Второй</li>
	</ul>

Автор: Гость (не зарегистрирован), дата: 22 сентября, 2014 - 21:49
#permalink

а как преобразовать строку в число parseInt() или Number()?? дитенахой


Автор: Гость (не зарегистрирован), дата: 23 сентября, 2014 - 14:16
#permalink

var a = 5;
var b = a+"";


Автор: michail.k (не зарегистрирован), дата: 8 апреля, 2015 - 13:24
#permalink

помогите разобраться как выбрать элемент списка , чтоб он изменил цвет:

function test1() {
var list = document.getElementById("List");
var element = list.firstChild;
if (element != null) {
element.setAttribute("style", "color:green;");
}

  • Element 1
  • Element 2
  • Element 3
  • Element 4
  • Element 5


Автор: Разработчик (не зарегистрирован), дата: 12 июня, 2018 - 21:13
#permalink

Отличный контент, новый уровень в создании сайтов. То, что нужно!


Автор: Гость (не зарегистрирован), дата: 11 сентября, 2019 - 18:52
#permalink

хуй


Автор: Гость (не зарегистрирован), дата: 5 февраля, 2020 - 20:49
#permalink

хуй хуй хуй


Автор: Гость (не зарегистрирован), дата: 12 сентября, 2019 - 20:57
#permalink

хуй


Автор: Гость (не зарегистрирован), дата: 12 сентября, 2019 - 21:02
#permalink

хуй


Автор: Гость (не зарегистрирован), дата: 19 сентября, 2019 - 02:09
#permalink

var pizdaHuyu


Автор: Гость (не зарегистрирован), дата: 30 марта, 2020 - 07:32
#permalink

У меня есть скрипт на пользовательской кнопке, изменяющий DOM (добавляет много div с текстом и фоном). Как вывести alert после построения всех div?


Автор: Гость (не зарегистрирован), дата: 30 марта, 2020 - 07:41
#permalink

div добавляются через innerHTML. При добавлении Alert() в конце функции или после нее после сначала выдается сообщение, а потом идет отрисовка блоков. Сама отрисовка из-за разного количества блоков может сильно затягиваться, поэтому SetTimeout неподходит


Автор: Гость (не зарегистрирован), дата: 13 мая, 2020 - 19:34
#permalink

помогите зделать

У елемент

    потрібно додати три

  • елементи. Вибрати

      елемент за допомогою id = “test”. Створити кожен новий
    • елемент за допомогою методу createElement() та додати до списоку за допомогою методу appendChild().


    Автор: wardrose (не зарегистрирован), дата: 13 января, 2022 - 05:37
    #permalink

    Explore the cookie clicker online incremental game browser on all web browsers available on the computer. This is one of the outstanding online games introduced here, welcome and experience.


    Автор: ella ellapurnell (не зарегистрирован), дата: 25 января, 2022 - 03:55
    #permalink

    Thank you for bringing new knowledge to everyone, it is very helpful retro bowl unblocked


    Автор: Гость (не зарегистрирован), дата: 5 февраля, 2022 - 03:27
    #permalink

    The motive of providing accounts of all ranges on our platform is to give customers what they demand and what they deserve.
    csgo smurf
    buy valorant accounts
    gta 5 modded accounts


    Автор: Гость (не зарегистрирован), дата: 12 апреля, 2022 - 15:33
    #permalink

    Автор: Günlük burç Yorumları (не зарегистрирован), дата: 18 апреля, 2022 - 02:04
    #permalink

    HTML ve CSS notlarım için kişisel internet adresimi ziyaret edin - HTML ve CSS


    Автор: vaquezloyed (не зарегистрирован), дата: 20 июля, 2022 - 10:30
    #permalink

    I know how talented you are since I'm also a writer. I'm eager to see what more you have to say on your blog. retro bowl I've opted to follow your site in the hope that you'll publish again soon.


    Автор: Mayershing (не зарегистрирован), дата: 20 июля, 2022 - 10:55
    #permalink

    challenge all other players to see who can run farther, run 3 is a game that makes everyone stir and sell because if you are not careful you will fall


    Автор: Гость (не зарегистрирован), дата: 30 июля, 2022 - 11:12
    #permalink

    I like this post, And I guess that they having fun to read this lewdle post


    Автор: Гость (не зарегистрирован), дата: 10 августа, 2022 - 04:50
    #permalink

    Thanks for sharing

    Mejores Fresadora Virutex


    Автор: run game (не зарегистрирован), дата: 25 августа, 2022 - 11:27
    #permalink

    I think making a website like you is an advantage for you, I'm happy to share my feelings with everyone, I am very passionate about the game because it is very interesting. Please take the time to experience with me here: retro games


    Автор: Malcolm Watkins (не зарегистрирован), дата: 26 августа, 2022 - 05:27
    #permalink

    You don't have to go to Las Vegas or Macau to play solitaire for cash. You may now play free solitaire for no cost on your computer, smartphone, or tablet at any time you choose.


    Автор: 먹튀 (не зарегистрирован), дата: 29 августа, 2022 - 07:50
    #permalink

    I’ve been searching for hours on this topic and finally found your post. , I have read your post and I am very impressed. We prefer your opinion and will visit this site frequently to refer to your opinion. When would you like to visit my site 먹튀


    Автор: 메이저놀이터 (не зарегистрирован), дата: 29 августа, 2022 - 07:52
    #permalink

    In the meantime, I wondered why I couldn’t think of the answer to this simple problem like this. Your article is an article that gives the answer to all the content I’ve been contemplating. 메이저놀이터


    Автор: 안전놀이터 (не зарегистрирован), дата: 29 августа, 2022 - 07:53
    #permalink

    Unlike other general posts, it is very easy to understand because it explains it with professional explanations and photos. I'll post this post so I can find your next post. 안전놀이터


    Автор: 카지노사이트추천 (не зарегистрирован), дата: 15 сентября, 2022 - 07:39
    #permalink

    I've been using WordPress on a number of websites for about a year and am worried about switching to another platform. I have heard good things about 카지노사이트추천. Is there a way I can transfer all my wordpress content into it? Any help would be really appreciated!


    Автор: brianwilsonrt (не зарегистрирован), дата: 24 сентября, 2022 - 10:11
    #permalink

    You have a good point here! I totally agree with what you have said!! Thanks for sharing your views…hope more people will read this article!!! wordle 2


    Автор: keo nha cai (не зарегистрирован), дата: 4 октября, 2022 - 06:17
    #permalink

    I would like to thank you for the efforts you have put in penning this site. I’m hoping to view the same high-grade content by you later on as well. In truth, your creative writing abilities has motivated me to get my own, personal website now. keo nha cai


    Автор: 카지노게임사이트 (не зарегистрирован), дата: 11 октября, 2022 - 11:24
    #permalink

    It is my first visit to your blog, and I am very impressed with the articles that you serve. Give adequate knowledge for me. Thank you for sharing useful material. I will be back for the more great post. 카지노게임사이트 But by chance looking at your post solved my problem! I will leave my blog, so when would you like to visit it?!
    CFDHSSE


    Автор: keonhacai (не зарегистрирован), дата: 17 октября, 2022 - 05:56
    #permalink

    My programmer is trying to convince me to move to .net from keonhacai. I have always disliked the idea because of the expenses. But he's tryiong none the less.


    Автор: Misa (не зарегистрирован), дата: 2 ноября, 2022 - 07:29
    #permalink

    I have read all your posts, I often play slope io game in my free time, please play it...i will be happy if you play it.


    Автор: Leemorgan, дата: 2 ноября, 2022 - 16:08
    #permalink

    I haven't come across a decent article like this in a while; lately, I've been playing a lot of this game. If you played with me, that would be enjoyable. Long time has passed since


    Автор: Гость (не зарегистрирован), дата: 3 ноября, 2022 - 07:05
    #permalink

    When you're having trouble, you may need to think about outsourcing. But hiring someone else to run your business could be a good idea if you do it right. backrooms game


    Автор: abble (не зарегистрирован), дата: 22 ноября, 2022 - 09:43
    #permalink

    The insertBefore method allows you to insert an element anywhere but the end. That's really great for me to insert tap tap shots


    Автор: 온라인카지노사이트 (не зарегистрирован), дата: 17 декабря, 2022 - 11:03
    #permalink

    What a nice post! I'm so happy to read this. 온라인카지노사이트 What you wrote was very helpful to me. Thank you. Actually, I run a site similar to you. If you have time, could you visit my site? Please leave your comments after reading what I wrote. If you do so, I will actively reflect your opinion. I think it will be a great help to run my site. Have a good day.
    gkool


    Автор: 카지노사이트 (не зарегистрирован), дата: 18 декабря, 2022 - 06:57
    #permalink

    I've been searching for hours on this topic and finally found your post. 카지노사이트 , I have read your post and I am very impressed. We prefer your opinion and will visit this site frequently to refer to your opinion. When would you like to visit my site?


    Автор: 카지노게임추천 (не зарегистрирован), дата: 9 января, 2023 - 07:54
    #permalink

    I was impressed by your writing. Your writing is impressive. I want to write like you.카지노게임추천 I hope you can read my post and let me know what to modify. My writing is in I would like you to visit my blog.


    Автор: Гость (не зарегистрирован), дата: 3 февраля, 2023 - 11:17
    #permalink

    Your article is great, I have read a lot of articles but I am really impressed with your writing style. I will review this post.


    Автор: bellabrownbe (не зарегистрирован), дата: 22 февраля, 2023 - 06:11
    #permalink

    You need to take part in a kick the buddy contest for one of the highest quality blogs on the web


    Автор: 안전놀이터 (не зарегистрирован), дата: 18 марта, 2023 - 05:22
    #permalink

    Hello, I am one of the most impressed people in your article. 안전놀이터 I'm very curious about how you write such a good article. Are you an expert on this subject? I think so. Thank you again for allowing me to read these posts, and have a nice day today. Thank you.


    Автор: Гость (не зарегистрирован), дата: 29 марта, 2023 - 07:25
    #permalink

    изменение DOM с помощью JavaScript позволяет динамически обновлять содержимое страницы, создавать новые элементы, удалять и перемещать существующие элементы, менять их атрибуты и свойства, обрабатывать события и т.д exhibit of sorrows


    Автор: Гость (не зарегистрирован), дата: 12 апреля, 2023 - 13:20
    #permalink

    Geometry Dash Scratch is a rhythm-based running game that currently has 20 levels,with each level featuring a unique soundtrack. In this fascinating cube platformer


    Автор: Lucas Rice (не зарегистрирован), дата: 3 мая, 2023 - 13:59
    #permalink
    <a href='https://slopeunblocked.club'>Slope Unblocked</a> is a game that appeals to all age groups from 7 to 70 Having incredible 3D graphics is one of the details of the players most pleasingly.
    

    Автор: Lucas Rice (не зарегистрирован), дата: 3 мая, 2023 - 14:05
    #permalink
    https://slopegame.fun is a game that appeals to all age groups from 7 to 70 Having incredible 3D graphics is one of the details of the players most pleasingly. It is possible to play via your browser without downloading any programs to your computer because of the Flash game category.
    

    Автор: basketrandom (не зарегистрирован), дата: 3 июня, 2023 - 18:18
    #permalink

    The goal of the game is no different from the basketball we know. If your computer, which we call artificial intelligence, is a 2-player, two-player option, if you choose 1, there are options to play with 2 players and 1 game basket random, so you can play the same keyboard in advance with any friend or brother.


    Автор: Гость (не зарегистрирован), дата: 17 июня, 2023 - 10:37
    #permalink

    One thing I want to tell you, that you are amazing for the things you wrote in this article I will never forget. pge outage map


    Автор: Nathaniel Urbina (не зарегистрирован), дата: 23 июня, 2023 - 21:29
    #permalink

    Play online basket random, control your player, score points by throwing the ball, adapt to randomness, utilize power-ups, defeat opponents, and work on improving your skills for success. basketrandom.org


    Автор: howarches (не зарегистрирован), дата: 26 июня, 2023 - 05:27
    #permalink

    This piece is fantastic and adds so much to the conversation free games


    Автор: gemmalyly (не зарегистрирован), дата: 27 июля, 2023 - 11:03
    #permalink

    The author did an excellent job of breaking down complex ideas and explaining them in a clear and concise manner basketbros. I learned a lot from this article.


    Автор: timothyferriss (не зарегистрирован), дата: 7 сентября, 2023 - 04:51
    #permalink

    Эти основы позволяют вам динамически взаимодействовать с веб-страницей, создавая интерактивные и информативные immaculate grid пользовательские интерфейсы.


    Автор: bettyking (не зарегистрирован), дата: 19 сентября, 2023 - 11:38
    #permalink

    Many people have a lot of fun with anything you can think of and write down. I'm one of those people who like what you write io games


    Автор: Nathaniel (не зарегистрирован), дата: 23 сентября, 2023 - 17:53
    #permalink

    Your website is a remarkable online destination that truly stands out. It's not just visually appealing with its clean and modern design, but it also offers an exceptional user experience. basket random


    Автор: Henry (не зарегистрирован), дата: 23 сентября, 2023 - 17:58
    #permalink

    Navigating through your website is intuitive, and the content is both informative and engaging. Your attention to detail, from the layout to the multimedia elements, is evident and commendable. Basketball unblocked


    Автор: ranking (не зарегистрирован), дата: 5 ноября, 2023 - 13:46
    #permalink

    Great write-up, I am a big believer in commenting on blogs to inform the blog writers know that they’ve added something worthwhile to the world wide web! Suika Game


    Автор: Гость (не зарегистрирован), дата: 27 декабря, 2023 - 04:30
    #permalink

    Your website is a buildnow gg unique and exceptional online destination. Its sleek, contemporary design is physically appealing, but it also provides an amazing user experience.


    Автор: Гbax (не зарегистрирован), дата: 31 января, 2024 - 13:16
    #permalink

    I recently came across your article and have been reading along. I want to express my admiration of your writing skill and ability to make readers read from the beginning to the end. I would like to read newer posts and to share my thoughts with you.


    Автор: baxer6ть (не зарегистрирован), дата: 31 января, 2024 - 13:16
    #permalink

    I recently came across your article and have been reading along. I want to express my admiration of your writing skill and ability to make readers read from the beginning to the end. I would like to read newer posts and to share my thoughts with you.
    Palworld Breeding Calculator


    Автор: Госdaseть (не зарегистрирован), дата: 2 марта, 2024 - 13:27
    #permalink

    Wonderful illustrated information. I thank you about that. No doubt it will be very useful for my future projects. Would like to see some other posts on the same subject! Infinite Craft


    Отправить комментарий

    Приветствуются комментарии:
    • Полезные.
    • Дополняющие прочитанное.
    • Вопросы по прочитанному. Именно по прочитанному, чтобы ответ на него помог другим разобраться в предмете статьи. Другие вопросы могут быть удалены.
      Для остальных вопросов и обсуждений есть форум.
    P.S. Лучшее "спасибо" - не комментарий, как все здорово, а рекомендация или ссылка на статью.
    Содержание этого поля является приватным и не предназначено к показу.
    • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
    • Разрешены HTML-таги: <strike> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <u> <i> <b> <pre> <img> <abbr> <blockquote> <h1> <h2> <h3> <h4> <h5> <p> <div> <span> <sub> <sup>
    • Строки и параграфы переносятся автоматически.
    • Текстовые смайлы будут заменены на графические.

    Подробнее о форматировании

    CAPTCHA
    Антиспам
    2 + 0 =
    Введите результат. Например, для 1+3, введите 4.
     
    Текущий раздел
    Поиск по сайту
    Содержание

    Учебник javascript

    Основные элементы языка

    Сундучок с инструментами

    Интерфейсы

    Все об AJAX

    Оптимизация

    Разное

    Дерево всех статей

    Последние комментарии
    Последние темы на форуме
    Forum