Как обрабатывать вложенный iframe с помощью JavaScript?

Question

Предположим, у меня есть HTML-страница, которая содержит следующий HTML-код

<div>    
  <iframe src="some_src_link">    
    <iframe src="some_src_link2">   
      //code..
    </iframe>
  </iframe>    
</div>

Так что я хочу перебрать весь iframe внутри HTML-страницы при загрузке страницы. Поскольку мне нужно установить атрибут индекса для каждого iframe. Некоторые вещи, как показано ниже HTML Code

    <div>    
      <iframe src="some_src_link" index="0">    
        <iframe src="some_src_link2" index="0-0">   
          <iframe src="some_src_link3" index="0-0-0">   
          </iframe>
        </iframe>
      </iframe> 
<iframe src="some_src_link4" index="1">    
        <iframe src="some_src_link5" index="1-0">   
          <iframe src="some_src_link6" index="1-0-0">   
          </iframe>
        </iframe>
      </iframe>    
    </div>
//INDEX --parentIframe-childIframe-grandchildIframe

Я устал от простого метода jquery

$("iframe").map(function(index,iframe){
        if(self == top){ //check for parent iframe

             $(iframe).attr('index',index);
         }else{

             $(iframe).attr('index',index);
         } 
     return iframe;
   });

Может применять только индекс, такой как приведенный ниже код.

<div>    
  <iframe src="some_scr_link" index="0">    
    <iframe src="some_scr_link2" index="0">   
      <iframe src="some_scr_link2" index="0">   
      </iframe>
    </iframe>
  </iframe>    
</div>

Мой вопрос, как я могу выполнить итерации как древовидная структура соответственно его родительскому iframe и определить, является ли iframe родительским или дочерним или великим дочерним. И установка атрибута индекса, например, // iframe INDEX --parentIframe-childIframe-grandchildIframe и т. Д. Пожалуйста, помогите мне найти решение.

Answer 1

Я не совсем уверен, что вы пытаетесь сделать с этой HTML-структурой, но что бы это ни было, вам нужно найти другой подход, потому что вложенные теги iframe невозможны. Это недопустимый HTML (или, возможно, технически допустимый, но бесполезный HTML):

<div>    
  <iframe src="some_src_link">    
    <iframe src="some_src_link2">   
      //code..
    </iframe>
  </iframe>    
</div>

innerHTML тега iframe отображается только в браузерах, которые не поддерживают iframe. Учитывая приведенный выше HTML, будет отображаться страница на some_src_link, и тег, пытающийся внедрить some_src_link2, будет просто игнорироваться всеми современными браузерами, поскольку он находится в той части страницы, которая будет заменена содержимым iframe src. ,

Если какой-либо браузер, который не поддерживает iframe, все еще существует, то в этом браузере, естественно, все iframes будут пропущены, и будет отображен их innerHTML (так, в этом случае, строка "// code .." "и некоторые окружающие пробелы.)

Я не могу себе представить, почему вы хотите использовать вложенные элементы iframe, но если вы это сделаете, страница на some_src_link должна будет содержать элемент iframe, указывающий на some_src_link2; Вы не можете установить страницу "внука" непосредственно от родителя.

Answer 2

Ваша проблема в итерации каждого iframe в документе. Это правильный путь, но вам нужно проверить, является ли iframe родительским, дочерним или внуковым.

    function getFrameIndex() {
  let frameINDEX = "";
  let currentWindow = window;
  let currentParentWindow;
  while (currentWindow !== window.top) { // check if parent or not
    currentParentWindow = currentWindow.parent;
    for (let iframeID = 0; iframeID < currentParentWindow.frames.length; iframeID ++)
      if (currentParentWindow.frames[iframeID ] === currentWindow) {
        frameINDEX = ":" + iframeID + frameINDEX ;
        currentWindow = currentParentWindow;
        break;
      }
  }
  frameINDEX = "Parent" + frameINDEX;
  return frameINDEX ; 
}

Надеюсь, это поможет начать

Answer 3

То, что вы пытаетесь сделать, это изменить содержание iframe. К счастью, вы не можете. Вы не можете иметь доступ к доменам перекрестного происхождения в iframe. Если домен блокирует запрос кросс-происхождения, вы ничего не можете с этим поделать.