Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Появление элемента в DOM (https://javascript.ru/forum/dom-window/34498-poyavlenie-ehlementa-v-dom.html)

aktep 07.01.2013 19:22

Появление элемента в DOM
 
Здравствуйте уважаемые есть такая проблема
начал только изучать js решил попрактиковаться на расширении для google chrome работает как часы но есть одна проблема что отработка идет поздно судя по всему это происходит из за того что изначально пытаюсь удалить элемент дерева которого еще не существует
вот и сам вопрос как мне проверить что элемент вставляется в DOM и либо ему не дать вставиться либо удалить как он только появился
вот код удаления:
Код:

var table = document.getElementsByTagName('table')[0];
    table.deleteRow(0);

все легко не использую ById ибо этой таблице не присвоен id а присвоен class main пытался вызвать через него но удаление почему то не проходит
думаю эту проблему можно решить через
Код:

addEventListener('DOMNodeInserted', )

тобишь поставить обработчик на добавление элемента в DOM но не могу понять как именно отловить этот элемент помогите пожалуйста заранее спасибо

Deff 07.01.2013 23:34

aktep, в современных браузерах есть метод querySelectorAll, http://www.codeisart.ru/w3c-css-sele...orall-methods/ который ищет и по классу и по ID и по атрибутам
Вот кроссбраузерная библиотечка нахождения селекторов http://javascript.ru/forum/project/2...shhikhsya.html

aktep 08.01.2013 10:53

Цитата:

в современных браузерах есть метод querySelectorAll
вау незнал что есть такой мощный селектор сразу все ясно как искать объекты...
а с обработчиком вот я что то встал не могу понять до конца как я понимаю нужно задать функцию дать ей на вход добавляемый сейчас объект в DOM сравнить с моим и если они совпадают тут же удалить его... подскажите пожалуйста хоть в правильном направлении иду? и если это возможно пример привидите как то легче получается по примерам...
Deff большое спасибо за очень полезную информацию теперь буду знать что есть такой селектор.

aktep 10.01.2013 07:25

все таки не подходит querySelectorAll
у меня задача стоит такая что легче находить объект через

Код:

document.getElementByTagName('table')[0].rows[0].cells[0]

и обращаться приходиться к объектам не имеющим ничего даже если использовать querySelector разница не ощутимая лишь легче искать но не могу понять как допустим если бы это был div с id было бы все легче
Код:

targetId = 'my_id';
 var getdom = document.getElementById(targetId);
    if (getdom) {
      var par = getdom.parentNode;
      par.addEventListener('DOMNodeInserted', obrdom);
    }

    function obrdom(e) {
      var insertedNode = e.target;
      if (insertedNode.id == targetId) {
         insertedNode.parentNode.removeChild(insertedNode);
      }
    };

тут как бы все просто выставляем обработчик смотрим с каким id сейчас вставлен объект и если id совпадает поднимаемся на уровень выше и удаляем дочерний объект
как организовать подобное но если мы незнаем Id не могу понять разумеется тут что то с insertedNode.id тк я ищу не id мне его надо поменять на .... что? как отследить появление объекта ElementByTagName('table')[0].rows[0].cells[0] не пойму ... помогите пожалуйста как определить какой объект таблицы и какой сейчас вставлен не взирая на tr или td это просто допустим я хочу найти объект пятой таблицы 1 tr 2td тогда вызвать его легко
Код:

document.getElementByTagName('table')[4].rows[0].cells[1]

но как отследить его появление в dom? ведь у него не Id с чем его сравнивать?

aktep 10.01.2013 14:24

не пойму в правильном направлении иду я или нет...
document.addEventListener('DOMNodeInserted', sector);
function sector(e){
	var insertedNodeName = e.target.nodeName;
	var insertedNode = e.target;
	console.log(insertedNodeName);
	console.log(insertedNode);
	if (insertedNodeName == 'TABLE'){
        //mycode

	}
	};

возвращается таблица но она еще пустая ... как я понимаю терь нуно кидать обработчик на этот объект и уже в нем смотреть когда вставятся tr и как только нужный вставится удалить его но как это организовать и вооще правильный ли это метод или есть что полегче?

Deff 10.01.2013 15:06

aktep,
Задача нечетко обрисована, и мысли спутаны, как из-за стола с HГ

Что собственно хотите ? определить момент вставки и селектор вставляемого элемента ? - воткните пиксельную прозрачку внутрь вставляемого элемента, по onload прозрачки проанализируйте её родителя
<img onload="TstInsertParent(this)" src="http://forum.mybb.ru/i/blank.gif"/>

aktep 10.01.2013 23:01

Ой сори я думал понятно поставил проблем
проблема заключается в следующем
пишу расширение для google chrome для сайта http://video.sibnet.ru/ удаляю верхнюю и боковую рекламу (вроде тривиальная задачка хм) тк часто тут смотрю видео
и вот что получаю без расширения



во время обработки получается вот такая крикозябля в виде белой полоски сверху на несколько секунд



потом же все таки функция находит элемент таблицы и удаляет его




вот такая вот проблема... через css реклама прибита дык вот в чем там дело
все дело в том что рекламный div находится внутри таблицы <td style="height:66px;"> тобишь пока я не удалю этот td белая полоска никуда не денется я написал дополнительную функцию она удаляет tr содержащий как раз этот блок но ... блок удаляется через 3-10 секунд в общем он удаляется после того как загрузится весь документ выглядит это некрасиво + смещения документа после удаления а тк он находится в самом верху то это не очень удобно
надеюсь описал доступно ... прошу помощи

aktep 10.01.2013 23:18

Deff, проблема не в том что я его отловить не могу отловить его в DOM я могу спокойно (но не ById ByClassName ибо ему ни класс ни id не присвоены) проблема в том что я не могу его во время удалить чтобы он вообще не появлялся... задержка перед удалением ощутимая

Deff 10.01.2013 23:18

aktep,
Эээ - а дай ссыль на сайт с этой рекламой, (не удаленной) и ткни стрелкой на скриншоте этого сайта, - где она, может есть проще путь ?

aktep 10.01.2013 23:32

Deff, уже давал да и на скриншотах ссыль видна
Цитата:

пишу расширение для google chrome для сайта http://video.sibnet.ru/
http://video.sibnet.ru/


Часовой пояс GMT +3, время: 08:11.