Как создать скрипт, похожий на GreaseMonkey, чтобы показать другую страницу в нижней трети?

Question

Если вы посмотрите на эту страницу, там внизу много пустого пространства.

На этой странице я хочу использовать скрипт, похожий на Greasemonkey, который использует часть этого пробела и загружает другую страницу (используя что-то вроде iFrame).

• URL, который я хочу загрузить в iFrame-type-item (в нижней трети), всегда любой View Amazon Product Page указывает на.
• Итак, я хочу, чтобы код посмотрел на страницу и нашел, куда указывает эта ссылка. (Так как это немного меняется)
• Я хочу, чтобы вещи типа iFrame были в нижней трети. (Это может быть нижняя четверть, нижняя пятая... Я не имею в виду буквально...!)

Я был бы очень признателен, если бы вы помогли мне провести мозговой штурм.

Дополнительное чтение

Это не совсем GreaseMonkey, но вы можете предположить, что это

Это для Greasekit на Fluid.app (который очень старый, но я ограничен в его использовании). Вы, вероятно, даже не должны знать это, поскольку это очень похоже на Greasekit. Таким образом, для целей этого вопроса, вы можете просто притвориться, что это так.

Разница лишь в том, что вам не нужно делать это немного:

//==UserScript==
//@name        _Displaying an iframe type thing in the lower third
//@include     https://dl.dropboxusercontent.com/u/5546881/*
//@grant       none
// ==/UserScript==

Моя попытка ответа

var findlink  = document.getElementsByTagName('a');
for (var i = 0;i=“View Amazon Product Page” ; i++ ) {
link result = findlink.getAttribute('href')

}

$(document.body).append (
'<iframe src=+ link + >'
);

Answer 1

• Поскольку у вас есть jQuery, используйте селекторы jQuery, чтобы получить ссылку на продукт.
• Затем добавьте iFrame, но дайте ему идентификатор.
• Используйте CSS для позиционирования и размера.

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

var prodLinks = $("td.product_description a:contains('View Amazon Product Page')");
if (prodLinks.length) {
    var iframeSrc = prodLinks[0].href;
    $("body").append ('<iframe id="gmIframe" src="' + iframeSrc + '"></iframe>');

    $("#gmIframe").css ( {
        "position":     "absolute",
        "bottom":       "1em",
        "left":         "2em",
        "height":       "30%",
        "width":        "94%",
        "z-index":      "17",
        "background":   "#00FF00"
    } );
}

---

Предупреждение:

Это будет работать, только если выполнено хотя бы одно из следующих условий:

• Фрейм - это тот же домен.
• Сайт iframed не запрещает создание рамок перекрестного происхождения. (www.amazon.co.uk запрещает такое создание.)
• Вы используете браузер, который не соблюдает ограничения на разные источники. Firefox уважает это, я не знаю, делает ли Fluid или нет.