Очень простой вопрос для пользователя Chrome - не удается найти элемент в DOM - PullRequest
Новая
       0

Очень простой вопрос для пользователя Chrome - не удается найти элемент в DOM

0 голосов
/ 25 июля 2011

Я пытаюсь написать простой пользовательский скрипт, который что-то делает с текстовой областью в твиттере.

При использовании консоли отладки в Chrome «document.getElementsByTagName ('textarea')» возвращает массив, содержащий текстовое поле (где вы вводите твит), но в моем пользовательском сценарии он просто возвращает пустой массив. Есть ли что-то очень простое и неправильное, что я здесь делаю? Я пробовал как с «@ run-at document-end», так и без него, но с обоими я не могу добраться до текстовой области.

Спасибо за чтение! 

// ==UserScript==
// @name twitter-edit
// @namespace foo
// @description twitter
// @match http://www.twitter.com/*
// @match https://www.twitter.com/*
// @match https://twitter.com/*
// @match http://twitter.com/*
// @run-at document-end
// ==/UserScript==

(function() {
    var textareas = document.getElementsByTagName('textarea');
    window.alert('textareas len ' + textareas.length); // <-- **THIS SOMEHOW RETURNS 0**
    if (textareas.length != 1) {
        window.alert('error');  
    } else {
        var tweetbox = textareas[0];
            window.alert('tweetbox: ' + tweetbox);
    }
}());

Ответы [ 2 ]

0 голосов
/ 25 июля 2011

Поскольку этот сайт настолько наполнен ajax, и поскольку он погружается как минимум в 1 iFrame, вы должны немного подождать, пока ваш скрипт увидит это текстовое поле.

Кроме того, при переходе по ссылкам в Twitter страница часто просто изменяется методами AJAX. В этом случае обычные скрипты не сработают.

Чтобы компенсировать это, просто установите таймер, который постоянно проверяет наличие этого твиттер-бокса и будет ловить новые ящики, поскольку страница «перезагружается» с помощью ajax.

Этот скрипт работает: 

// ==UserScript==
// @name twitter-edit
// @namespace foo
// @description twitter
// @match http://www.twitter.com/*
// @match https://www.twitter.com/*
// @match https://twitter.com/*
// @match http://twitter.com/*
// @run-at document-end
// ==/UserScript==

//--- This handles both page-load delays, and AJAX changes.
setInterval (function() { checkForTweetbox (); }, 500);

function checkForTweetbox () {
    var tweetbox = document.querySelector ('div.tweet-box textarea');
    if (tweetbox) {
        if (! tweetbox.weHaveProcessed) {
            tweetbox.weHaveProcessed    = true;
            alert ('New tweet-box found!');
        }
    }
}
0 голосов
/ 25 июля 2011

Вы уверены, что текстовая область уже существует, когда ваш скрипт выполняется?

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

...