Доступ к DOM со страницами с использованием AJAX (расширение Firefox) - PullRequest
Новая
       35

Доступ к DOM со страницами с использованием AJAX (расширение Firefox)

2 голосов
/ 24 августа 2011

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

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

Я нашел эту интересную тему, в которой кто-то сталкивался с очень похожей проблемой: Взаимодействует с DOM для веб-страниц AJAX? и попытался проверить ответ, предложенный кем-то. К сожалению, когда я запускаю свой скрипт, я получаю следующую ошибку: «getattribute is not function»

Просто для ясности, я использую тот же фрагмент из этого поста (который использует twitter.com для теста) 

window.addEventListener("DOMNodeInserted",
function(event){ 
    var streamItem = event.target;
    if (streamItem == null)
        return;

    if (streamItem.getAttribute('class') != 'stream-item')
        return;

    var tweet = streamItem.getElementsByClassName("tweet",streamItem)[0];
    var name = tweet.getAttribute("data-screen-name");
    if (name.toLowerCase() == 'some-username'.toLowerCase()) 
    {
        var icon = tweet.getElementsByTagName("img")[0];
        icon.style.display='none';
    }
}, 
false);

за исключением того, что вместо этого я использую gBrowser.addEventListener(), который вызывается всякий раз, когда я получаю обратный вызов от window.addEventListener("load") в моем добавочном номере.

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

1 Ответ

2 голосов
/ 24 августа 2011

Феликс Клинг прав, вы должны зарегистрировать свой обработчик событий в документе содержимого - сейчас вы слушаете узлы, которые добавляются в браузер (скорее всего, новые вкладки).Конечно, это возможно только при наличии документа содержимого, например, в событии DOMContentLoaded.Это также имеет то преимущество, что вы только замедляете документы, которые вы действительно хотите просмотреть (наличие в документе прослушивателя событий DOMNodeInserted значительно замедляет модификации DOM).Примерно так (не проверено, но должно работать): 

gBrowser.addEventListener("DOMContentLoaded", function(event)
{
  var contentDoc = event.target;  // That's the document that just loaded

  // Check document URL, only add a listener to the document we want
  if (contentDoc.URL.indexOf("http://example.com/") != 0)
    return;

  contentDoc.addEventListener("DOMNodeInserted", function(event)
  {
    var streamItem = event.target;
    if (streamItem == null || streamItem.nodeType != Node.ELEMENT_NODE)
      return;

    ...
  });
}, false);

Обратите внимание на дополнительную проверку типа узла - например, вставляются текстовые узлы, и у них нет метода getAttribute (которыйвероятно, вызывает вашу ошибку).Вам нужно только посмотреть на узлы элементов.

...