Как изменить url-адрес в элементе div, который загружается iframe с помощью javascript

В моем manifest.json:

"content_scripts": [
        {
        "matches": [
            "http://*/*",
            "https://*/*"
            ],
        "css":["style.css"],
        "js": ["./js/jquery-3.3.1.js","content-script.js", "./search-api/search-api.js"],
        "run_at": "document_end"
        }
    ],

В content-script.js

var height = "40px";
var iframe = document.createElement("iframe");
iframe.src = chrome.extension.getURL("toolbar.html");
iframe.style.height = height;
iframe.style.width = "100%";
iframe.style.position = "fixed";
iframe.style.top = "0";
iframe.style.left = "0";
iframe.style.zIndex = "938089"; // Some high value
// Etc. Add your own styles if you want to
document.documentElement.appendChild(iframe);

// continuing add-toolbar.js
var bodyStyle = document.body.style;
var cssTransform = 'transform' in bodyStyle ? 'transform' : 'webkitTransform';
bodyStyle[cssTransform] = 'translateY(' + height + ')';

toolbar.html:

<div style="color:aqua">
    <a target="_blank" href="https://www.uber.com" id="toolbars">Uber cool home page</a>
</div>

Это нормально загружает iframe на мою веб-страницу. Но я хочу динамически изменять URL-адрес ссылки. Допустим, я хочу изменить его на amazon.com с uber.com.

Пытался:

iframe.find('toolbars').href("www.amazon.com")

с помощью jquery или без?

Yash Parekh 11.04.2018 14:10

Попробуйте это: $('#toolbars', parent.document).attr ('href', 'www.amazon.com');

wayneOS 11.04.2018 14:11

jquery, конечно :)

Vineeth Chitteti 11.04.2018 14:34

@wayneOS что делает parent.document? Я хотел бы знать, о чем идет речь.

Vineeth Chitteti 11.04.2018 14:37

@kai, извини, я ошибся. вам нужен $('iframe').contents ().find ('#toolbars').attr ('href', 'www.amazon.com');. parent.document потребуется для изменения вещей в родительском окне вне контекста iframe.

wayneOS 11.04.2018 14:43

Спасибо @wayneOS, это сработало.

Vineeth Chitteti 11.04.2018 16:05

@kai Пожалуйста. Добавил как ответ на доработку. Не могли бы вы принять это?

wayneOS 11.04.2018 16:11
0
8
58
3

Ответы 3

Вы можете это сделать.

$(‘#iframID’).attr(‘src’,’your url’);

Есть отличный ответ здесь.

Самый простой способ сделать это - использовать JavaScript или jquery.

  1. JavaScript:

    document.getElementById("toolbars").setAttribute("href", "www.amazon.com");

  2. JQuery:

    $('#toolbars').attr('href', 'www.amazoncom');

Чтобы получить доступ к элементу во встроенном iframe, вам сначала нужно получить доступ к нему содержимое (), а затем использовать найти(), чтобы получить его элементы. В вашем случае это будет выглядеть так:

$('iframe').contents ().find ('#toolbars').attr ('href', 'www.amazon.com');

Другие вопросы по теме