Добавление прослушивателей событий в «объекты памяти» в Javascript?

Question

Некоторые фоне проблемы: Reverse Engineering the DOM, Javascript events & "what's going on"?

я что-то пишу, что будет «играть» с функциональностью предварительного просмотра страницы Google, в прямом поиске. По сути, я хотел бы добавить прослушиватель событий в KeyUp событие, которое

1. запроса результаты предварительного просмотра страницы (послать Ajax запрос на Google)
2. чтения, которые приводят к памяти
3. добавить его ваша страница поиска в реальном времени

Это, по существу, создаст результат поиска в режиме реального времени в google.

Чтобы быть справедливым, я фактически получил около 95% этой работы в различных компонентах, и я нахожусь на этапах настройки, чтобы сделать ее более удобной для пользователя. Если вы заинтересованы в том, что я делаю, пожалуйста, ознакомьтесь со своими предыдущими сообщениями в блоге по номеру http://chesser.ca или даже просмотрите «последнюю версию кода» по адресу http://chesser.ca/gvs.marklet.0.3.js (в настоящее время это очень багги, как я «м немного„между функциональными возможностями“в данный момент

код букмарклет для вашего браузера здесь:.

javascript:(function{var head= document.getElementsByTagName('head')[0];var script= document.createElement('script');script.type= 'text/javascript';script.src= 'http://chesser.ca/gvs.marklet.0.3.js';head.appendChild(script);};)(); 

(KeyUp прослушиватель событий в настоящее время отключена, по существу, чтобы заставить его работать в его текущее состояние, вы запускаете поиск на странице с предварительным просмотром в реальном времени и щелкаете букмарклету один раз (чтобы инициировать запросы), подождите секунду или два, затем щелкните его второй раз (чтобы отобразить предварительные просмотры страниц)

Так что у меня есть некоторые изменения, чтобы это сделать:

В части 1 (для исполнения) Я заинтересован только в запросе первые два элемента. Я полагаю, что будет легко и единственное, что останавливает меня то, что я не пробовал еще (вместо всех divs.length, просто установите его в 2)

function query_current_pages(){ 
    var all_divs = document.getElementsByTagName('div'); 
    for (i=0;i < all_divs.length; i++) { 
     if (all_divs[i].className == 'vsc') { 
      google.vs.ea(all_divs[i]); 
     } 
    } 
} 

Следующая проблема (и тот, который Я не уверен), так как я могу настроить прослушиватель событий и изменить функцию add_previews, чтобы предварительный просмотр был добавлен, когда запрос вернется, вместо того, чтобы скорее использовать ham-fisted looping через все, что находится в google.vs.ha памяти, скорее, я хотел бы создать что-то, что будет слушать данные, которые будут там, а затем весной в действие.

Причина: Причина: Я пытаюсь это сделать, потому что я думаю, что это было бы действительно очень аккуратно. Это и я изучил «гору» вещей о кодировании, когда делаю это.

Для тех, кто заинтересован в том, как предварительный просмотр страницы «застревает на странице», вот функция, которая просматривает все изображения в памяти и выставляет их.

function add_previews(){ 
    c=document.getElementById('ires'); 
    nli=document.createElement('div'); 
    cell = 0; 
    for(var Obj in google.vs.ha){ 
     na=document.createElement('a'); 
     na.href=Obj; 

     nd=document.createElement('div'); 
     cldiv=document.createElement('div'); 
     cldiv.style.clear = 'both'; 

     nd.style.width=google.vs.ha[Obj].data.dim[0]+'px'; 
     nd.style.height=google.vs.ha[Obj].data.dim[1]+'px'; 
     nd.style.margin = '5px'; 
     nd.style.padding = '5px'; 
     nd.style.cssFloat = 'left'; 
     nd.style.border = '1px solid #999999'; 

     if (google.vs.ha[Obj].data.tbts.length) { 
      nilDiv = document.createElement('div'); 
      for(i = 0; i < google.vs.ha[Obj].data.tbts.length; i++){ 
       box = google.vs.ha[Obj].data.tbts[i].box; 
       newbox = document.createElement('div'); 
       newbox.className = 'vsb vsbb'; 
       newbox.style.position = 'relative'; 
       newbox.style.top = (box.t)+'px'; 
       newbox.style.left = box.l+'px'; 
       newbox.style.height = box.h+'px'; 
       newbox.style.width = box.w+'px'; 
       nilDiv.appendChild(newbox); 
       newtext = document.createElement('div'); 
       newtext.className = 'vsb vstb'; 
       newtext.innerHTML = google.vs.ha[Obj].data.tbts[i].txt; 
       newtext.style.top = (box.t)+'px'; 
       newtext.style.position = 'relative'; 
       nilDiv.appendChild(newtext); 
      } 
      nilDiv.style.height = '0px'; 
      nd.appendChild(nilDiv); 
     } 

     for(i = 0; i < google.vs.ha[Obj].data.ssegs.length; i++){ 
      ni=document.createElement('img'); 
      ni.src += google.vs.ha[Obj].data.ssegs[i]; 
      ni.className+=' vsi'; 
      na.appendChild(ni); 
     } 
     nd.appendChild(na); 
     nli.appendChild(nd); 
    }; 
    c.insertBefore(nli,c.firstChild);   
} 

Очевидный немного изменить там (с помощью прослушивателя событий), чтобы исправить for(var Obj in google.vs.ha){ быть единым google.vs.rs объект, который передается в.

Если вы продлился далеко в вопрос: спасибо за чтение :) - Alex

EDIT

В соответствии с приведенной ниже дискуссии, google.vs.Ga, кажется, отвечает за запрашивая данные (на которые ответ переписывает функцию)

Для информационных целей (и развлечений) здесь есть .Ga-код.

google.vs.Ga = function (a, b, c) { 
     var d = google.vs.b.kfe.kfeHost, 
      g = google.vs.Ya(a), 
      i = a.getAttribute("sig"); 
     if (i) { 
      var f = google.vs.qa(a); 
      if (f) { 
       d = [d ? "http://" + d : "", google.vs.b.kfe.kfeUrlPrefix, "&d=", encodeURIComponent(f), "&b=1", "&jsonp=google.vs.r"]; 
       d.push("&a="); 
       d.push(encodeURIComponent(i)); 
       if (i = a.getAttribute("blobref")) { 
        d.push("&bl="); 
        d.push(i) 
       } 
       d.push("&rs="); 
       i = 0; 
       for (var j; j = g[i++];) { 
        d.push(encodeURIComponent(j)); 
        i < g.length && d.push("&rs=") 
       } 
       g = google.vs.m(a) || { 
        ub: a 
       }; 
       g.G = c; 
       google.vs.ha[f] = g; 
       c = d.join(""); 
       c = new google.vs.Ia(f, c, function() { 
        google.vs.P(a, h); 
        o(google.vs.k, f) 
       }); 
       b ? p(google.vs.k, c) : q(google.vs.k, c) 
      } 
     } 
    }; 

Answer 1

Объект google.vs.ha является основным объектом JavaScript, с ключ/значение пары атрибутов, и без каких-либо функций, говорить. При этом эти простые объекты не могут уведомить вас, когда они будут изменены.

Как я вижу, вы в основном есть 2 варианта:

• периодически проверять google.vs.ha для данных, которые вы ищете, отслеживать, какие из них вы уже схватил изображений. Это может быть выполнено с помощью setInterval();

• Определите, на какой странице или на google странице. пространство имен отвечает за выполнение работы по загрузке данных. Как только вы определяете, где данные загружаются, и где именно объекты google.vs.ha обновляются, вы можете заменить исходную функцию одним из своих собственных созданий, который содержит уведомление о событии.

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

var Example = function(value){ 
    var closured = ' world'; 
    this.value = value; 
    this.doSomething = function(){ alert(this.value + closured); }; 
}; 

var test = new Example('hello'); 
test.doSomething(); // will only alert 'hello world'; 

var oldFunc = test.doSomething; 
var notifyMe = function(){ alert('notified'); }; // callback function 

// Update previous method to do it's normal thing, but then notify after 
test.doSomething = function(){ 
    oldFunc.apply(this, arguments); 
    notifyMe(); 
}; 

test.doSomething(); // will alert 'hello world', and then 'notified' 

В приведенном выше коде, мы эффективно заменить старую функцию DoSomething с одним из наших собственных. Эта новая версия по-прежнему выполняет предыдущие обязанности (через oldFunc.apply), но потом сообщит вам об этом.

Обратите внимание, что ваша новая функция будет иметь доступ только к общедоступным свойствам объектов, а не к частным элементам, которые захватываются закрытием (например, «закрыто» var). Кажется, я кое-что помню, что Google стремится избегать частных переменных как подход закрытия, из-за сложностей, которые это может добавить в управление памятью, так что это может не быть проблемой.

ОБНОВЛЕНИЕ: Я немного поиграл с ним на странице результатов поиска Google. Я побежал свежий поиск, но, прежде чем нажать на превью, я выполнил в консоли Chrome следующее:

var old = google.vs.Ga; 
var newFunc = function(){ 
    old.apply(this, arguments); 
    console.log(arguments); 
}; 

google.vs.Ga = newFunc; 

И это, казалось, срабатывает после нажатия предварительного просмотра.

Answer 2

Изображения хранятся ПОСЛЕ того, что они загружены, верно? Очевидный. Таким образом, единственный момент, когда они могут измениться, - это запрос AJAX.

Поэтому вам нужно выполнить некоторую проверку каждый раз, когда запрос AJAX успешно завершен. jQuery имеет глобальные привязки для успешных вызовов AJAX, поэтому это должно быть возможно даже без него.

Теперь, когда мы это знаем, проверка может начинаться с того, чтобы видеть, какой тип вызова был выбран некоторыми переменными, доступными в объекте ответа, или сам объект XMLHTTPRequest.Это может сузить количество раз, когда вам нужно еще раз называть обновление.