[html run] - это я так понимаю чтобы введенный код в сообщении по нажатию на кнопку срабатывал. Подскажите, как это делается?
|
|
<!DOCTYPE > <HTML> <style> .cl {width:100px; height: 40px; border: 1px solid red;} #di {border: 1px solid blue;} </style> <BODY> <div id="idd"> <div class="cl">1</div> <div class="cl">2</div> <div> <script> topmenu = (function(window) { var elements = {}; return { Sattr: function(name) { try{ elements = document.querySelectorAll(name); }catch(e){} return this; }, sob: function(type,block) { for(var i=0; i<elements.length;i++) { try { try { elements[i].addEventListener(type, block, false); } catch(e) { elements[i].attachEvent("on"+type, block); } } catch(e){} } return this; } }}()); topmenu.Sattr("#idd .cl").sob("click",function(){ if(!document.getElementById("di")) { var div = document.createElement("div"); div.id = "di"; div.innerHTML = "div"; } else var div = document.getElementById("di"); this.appendChild(div); }); var dv = document.createElement("div"); dv.className = "cl"; dv.innerHTML = "3"; document.getElementById("idd").appendChild(dv); </script> </BODY> </HTML> |
<style> .cl {width:100px; height: 40px; border: 1px solid red;} #di {border: 1px solid blue;} </style> <div id="idd"> <button>add</button> <div class="cl">1</div> <div class="cl">2</div> <div> <script> window.onload = function () { document.getElementById('idd').onclick = function (e) { e = e || event; var target = e.target || e.srcElement; if (target == this.children[0]) { var el = document.createElement('div'); el.innerHTML = this.children.length - 1; el.className = 'cl'; this.appendChild(el); } else if (target.className == 'cl') { if(!document.getElementById("di")) { var el = document.createElement("div"); el.id = "di"; el.innerHTML = "div"; } else { var el = document.getElementById("di"); } target.appendChild(el); } } } </script> |
Спасибо за ответ. Но дело в том, что мне нужно передать элемент в объект, просто для того, чтобы использовать другие методы данного объекта. Кроме прочего это уже используется в очень многих местах. Поэтому, чтобы не переписывать алгоритм, мне бы желательно как-то получить все доступные элеменеты, через метод topmenu.Sattr("#idd .cl") обращаясь к ним тем же способом, что и querySelectorAll. Можно как-то так сделать, в принципе также, как сделано в джиквери в функции Like
|
предполагаю: нужно использовать MutationEvents
https://developer.mozilla.org/en-US/...lug=DOM_Events http://habrahabr.ru/post/114244/ иначе живости не получить, ну либо при добавке нового элемента вещать обработчик на него |
Большое спасибо. Возможно, это действительно то, что нужно. Я так понял что MutationEvents отслеживает изменения дом элементов. Но никакой дельной информации - описания по данному поводу не нашел. Ваших ссылок к сожалению оказалось недостаточно, не говоря уже о не знании английского языка. Может кто-нибудь подскажет расширенную информацию по данному вопросу. Также интересует кроссбраузерность и поддрержка хотя бы ie8
|
В общем, сколько не искал, так и не нашел никакой достаточно подробной информации по MutationEvents. Хотя насколько понял, это относится к дом3 и видимо довольно плохо поддерживается. Может кто-нибудь все-таки подскажет, как можно решить мою проблему с MutationEvents или без.
|
не лучший вариант, но можно сделать что-нибудь типа такого
<!DOCTYPE > <HTML> <style> .cl {width:100px; height: 40px; border: 1px solid red;} #di {border: 1px solid blue;} </style> <BODY> <div id="idd"> <div class="cl">1</div> <div class="cl">2</div> <div> <script> topmenu = (function(window) { var elements = {}; return { Sattr: function(name) { try{ elements = document.querySelectorAll(name); }catch(e){} return this; }, sob: function(type,block) { for(var i=0; i<elements.length;i++) { try { try { elements[i].addEventListener(type, block, false); } catch(e) { elements[i].attachEvent("on"+type, block); } } catch(e){} } return this; } }}()); document.body.onmousedown = function (){ topmenu.Sattr("#idd .cl").sob("click",function(){ if(!document.getElementById("di")) { var div = document.createElement("div"); div.id = "di"; div.innerHTML = "div"; } else var div = document.getElementById("di"); this.appendChild(div); }); } var dv = document.createElement("div"); dv.className = "cl"; dv.innerHTML = "3"; document.getElementById("idd").appendChild(dv); </script> </BODY> </HTML> |
Спасибо. Попробую. Хотелось правда расширить сам методо sob и/или Sattr, чтобы сделать события живыми. Надо было сразу подумать об этом, я не знал, что не будет с вновь созданными событиями работать.
|
Часовой пояс GMT +3, время: 15:49. |