Нужна помощь в выборе и изменении высоты div-идентификатора в iFrame с использованием JQuery в пользовательском скрипте Tampermonkey - PullRequest
Новая
       20

Нужна помощь в выборе и изменении высоты div-идентификатора в iFrame с использованием JQuery в пользовательском скрипте Tampermonkey

0 голосов
/ 02 октября 2018

Я пытаюсь изменить высоту div-идентификатора внутри в iFrame с 226px до 660px.Да, источник iFrame находится в том же домене.

Я пытаюсь выбрать идентификатор id dojox_grid__View_1 внутри идентификатора iFrame finesse_gadget_1.Я пробовал решение с наибольшим количеством голосов отсюда:

Ноэто не сработало.Итак, я выполнил эту команду: 

console.log($("iframe#finesse_gadget_1").contents().find("#dojox_grid__View_1"));

И вот результат: 

jQuery.fn.init [div#dojox_grid__View_1.dojoxGridView, prevObject: jQuery.fn.init(1), context: document, selector: "#dojox_grid__View_1"]

Но я не понимаю, что это значит?

ЭтоHTML: 

<div id="finesse-container">
   <div id="finesse-gadgets-workspace">
      <div id="panel_home">
         <iframe id="finesse_gadget_1">
            <html><body>
               <div id="teamBody">
                  <div id="teamRoster">
                     <div id="hideFocus">
                        <div id="dojoxGridMasterView">
                           <div id="dojox_grid__View_1" style="height: 226px;"></div>
                        </div>
                     </div>
                  </div>
               </div>
            </body></html>
         </iframe>
      </div>
   </div>
</div>

Единственный способ успешно выбрать iFrame - это так (document.getElementById не работал): 

$('iframe#finesse_gadget_1', parent.document.body)

Вот код, который япопробовал, но безуспешно: 

var iFrame = $('iframe#finesse_gadget_1', parent.document.body);
var iFrameDocument = iFrame.contentDocument || iFrame.contentWindow.document;
var iFrameContent = iFrameDocument.getElementById('#dojox_grid__View_1');
iFrameContent.height(660 + 'px');

Я тоже попробовал, но безуспешно: 

$('iframe#finesse_gadget_1', parent.document.body).contents().find('div#dojox_grid__View_1').height(660 + 'px');

Любая помощь очень ценится!

1 Ответ

0 голосов
/ 02 октября 2018

Вам необходимо:

  1. Определить, находится ли iframe на в том же домене , что и веб-страница.Что такое параметр iframe src (или он отсутствует)?Каков URL страницы?
  2. Подождите, пока загрузится iframe.

Если iframe - это тот же домен:

Затем используйте метод, такой как waitForKeyElements Ссылка для получения нужного узла.
Вот полный рабочий скрипт, который показывает, что: 

// ==UserScript==
// @name     _Change iframed div, same domain
// @match    *://YOUR_SERVER.COM/YOUR_PATH/*
// @require  https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// @grant    GM.getValue
// ==/UserScript==
//- The @grant directives are needed to restore the proper sandbox.

//-- Use the optional iframe selector of WFKE.
waitForKeyElements ("#dojox_grid__View_1", changeHeight, false, "#finesse_gadget_1");

function changeHeight (jNode) {
    jNode.css ("height", "660px");
}


Если iframe НЕ является тем же доменом:

Затем задает пользовательский скрипт для запуска на домене iframe и, опять же, использует waitForKeyElements: 

// ==UserScript==
// @name     _Change iframed div, different domains
// @match    *://IFRAME_SERVER.COM/IFRAME_PATH/*
// @require  https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// @grant    GM.getValue
// ==/UserScript==
//- The @grant directives are needed to restore the proper sandbox.

waitForKeyElements ("#dojox_grid__View_1", changeHeight);

function changeHeight (jNode) {
    jNode.css ("height", "660px");
}
...