Получение исходного кода iframe

Есть ли в любом случае, чтобы получить исходный код страницы, загруженный iframe? Я не хочу ИЗМЕНИТЬ любой код, я просто хочу ПРОЧИТАТЬ его. Мне также нужно получить это, используя javascript/html.Получение исходного кода iframe

источник

2011-01-19 Franz Payer

Совпадают ли домены? –

Я делаю это через расширение Google. Я добавил домен, к которому я пытаюсь обратиться к файлу манифеста в разделе «Разрешения». Я не совсем уверен, что эта проблема проходит по той же проблеме, но как вы это сделаете, полагая, что домены одинаковы? –

'' – drudge

document.getElementById('iframeID').contentWindow.document.body.innerHTML

Работает в Firefox, Chrome, Opera, IE9 бета

источник

2011-01-19 01:39:42

уже пробовал, он не работает –

@Daz В браузере сообщается об ошибке? Попробуйте в Chrome, так как у этого браузера есть хорошая отчетность об ошибках. Если это проблема междоменного доступа, Chrome сообщит, что в ошибке. –

Я запускаю его через chrome. Он падает на эту строку. Я выставляю предупреждение после строки, и предупреждение не запускается. Я видел примеры этой работы, но они были с 2008 года. Вы уверен, что это все еще работает в современных браузерах? –

-1

См. https://developer.mozilla.org/en/HTML/Element/iframe#Scripting, как браузеры на основе Mozilla обрабатывают его. В вашей любимой библиотеке JavaScript должны быть абстракции, которые будут обрабатывать неизбежные различия в именах между IE, WebKit, Gecko и т. Д. DOM.

источник

2011-01-19 01:31:44 wmorrell

-1

Использование JQuery: http://api.jquery.com/contents/ (только если совпадением)

Например:

$(iframe).contents().find('body').html();

Если он не совпадает, вы можете загрузить его снова (как она может быть сохранена уже в клиенте он не может зайти на сервер еще раз):

var html; 
$.get($(iframe).get(0).src, function(content) { 
    html = content; 
});

источник

2011-01-19 01:35:58 lepe

Является ли OP с помощью jQuery? –

Попробуйте так:

<!DOCTYPE html> 
<html> 
<body> 

//this is iframe I ll look for its source 
<iframe id="frmin" src="http://www.w3schools.com"></iframe> 

<p>Click the button to see the source.</p> 
//this is display I will display Iframe's source here 
<div id="srcout"></div> 

//show source upon click event 
<button onclick="myFunction()">Show it</button> 

<script> 
function myFunction() { 
//get Iframe element ready for javascript manipulation 
var frm = document.getElementById("frmin"); 
//get display element ready for javascript manipulation 
var dsp = document.getElementById("srcout"); 

//find Iframe's HTML (root) element, [0] because I'm using getElementsByTagName which returns node list so I have to chose the 1st one, and put its outer content (i.e. with outer tags) to display, i.e. dsp.innerText. I use innerText because I want a text output not formatted as html. 
dsp.innerText = frm.contentDocument.getElementsByTagName('html')[0].outerHTML; 

} 
</script> 

</body> 
</html>

источник

2015-10-20 21:11:58 Lumic

Пожалуйста, объясните вам код! – aschipfl

Этот подход использует получение HTML-элемента Iframe. – Lumic

Этот подход использует получение HTML-кода Iframe. Сначала я использую специфическую манипуляцию iframe ** document.getElementById («frmin»). ContentDocument ... ** для доступа к содержимому Iframe ... затем я использую getElementsByTagName, чтобы найти элемент HTML (root) Iframe: ** ... contentDocument. getElementsByTagName ('html') [0] ... ** // ('html') [0], если было больше элементов HTML. Наконец, я использую ** ... outerHTML ... **, чтобы получить HTML-код вкл. внешние теги. – Lumic

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

Важно, чтобы JavaScript и HTML были именно такими.

CSS: В <head></head> разделе:

<style type="text/css" > 
.button 
    { 
    background:#000cff; 
    padding:2px 10px; 
    color:white; 
    text-decoration:none; 
    -moz-border-radius:10px; 
    -webkit-border-radius:10px; 
    border-radius:10px; 
    cursor: pointer; 
    font-weight: bold; 
    color: white; 
    display: inline-block; 
    box-shadow: 0 0 3px gray; 
    margin: 0px; 
    font: bold 11px Arial, Sans-Serif; 
    } 

#source-code 
    { 
    display:none; 
    position:absolute; 
    top:-24px; 
    left:0; 
    width:100%; 
    height:414px; 
    background:rgba(255,255,255,0.0); 
    } 

#source-code:target { display: block; } 
#source-code pre 
    { 
    padding:20px; 
    font:14px/1.6 Monaco, Courier, MonoSpace; 
    margin:50px auto; 
    background:rgba(0,0,0,0.8); 
    color:white; 
    width:80%; 
    height:80%; 
    overflow:auto; 
    } 

#source-code pre a, 
#source-code pre a span 
    { 
    text-decoration:none; 
    color:#00ccff !important; 
    } 

#x 
    { 
    position:absolute; 
    top:30px; 
    left:10%; 
    margin-left:-41px; 
    } 

.control-copytextarea 
    { 
    position:absolute; 
    top:-3px; 
    left:20px; 
    cursor: pointer; 
    font-weight: bold; 
    padding:3px 10px; 
    border-radius: 5px 5px 0 0; 
    background: darkred; 
    color: white; 
    display: inline-block; 
    box-shadow: 0 0 3px gray; 
    margin: 0px; 
    font: bold 10px Arial, Sans-Serif; 
    } 
</style>

JavaScript:

<script languade="JavaScript"> 
     $(function() { 
      $("<pre />", { 
       "html": '&lt;!DOCTYPE html>\n&lt;html>\n' + 
         $("html") 
          .html() 
          .replace(/[<>]/g, function(m) { return {'<':'&lt;','>':'&gt;'}[m]}) 
          .replace(/((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/gi,'<a href="$1">$1</a>') + 
         '\n&lt;/html>', 
       "class": "prettyprint" 
      }).appendTo("#source-code"); 

      prettyPrint(); 
     }); 
</script> 

<script languade="JavaScript"> 
     var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); 
     document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); 
</script> 

<script languade="JavaScript"> 
     var pageTracker = _gat._getTracker("UA-68528-29"); 
     pageTracker._initData(); 
     pageTracker._trackPageview(); 
</script>

Примечание: Вам не нужно использовать эти коды JavaScript от сети, но и для ради того, чтобы он работал на всех браузерах, вам также рекомендуется использовать их.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="http://css-tricks.com/examples/ViewSourceButton/prettify/prettify.js"></script>

HTML: В разделе <body></body>:

<a class="button" href="#source-code" id="view-source">Show the Source Code for this page</a> 
<div id="source-code" align="left"> 
    <a href="#" id="x"><input type="button" alt="close" class="control-copytextarea" value=" Close Source Code Viewing " /></a> 
</div>

ПРИМЕЧАНИЕ: Вы можете непосредственно копировать и вставлять коды на веб-страницу, она будет работать именно так, как оно есть.

Полный пример:

<html> 
    <head><title>View your Source Code</title> 

<style type="text/css" > 
.button 
    { 
    background:#000cff; 
    padding:2px 10px; 
    color:white; 
    text-decoration:none; 
    -moz-border-radius:10px; 
    -webkit-border-radius:10px; 
    border-radius:10px; 
    cursor: pointer; 
    font-weight: bold; 
    color: white; 
    display: inline-block; 
    box-shadow: 0 0 3px gray; 
    margin: 0px; 
    font: bold 11px Arial, Sans-Serif; 
    } 

#source-code 
    { 
    display:none; 
    position:absolute; 
    top:-24px; 
    left:0; 
    width:100%; 
    height:414px; 
    background:rgba(255,255,255,0.0); 
    } 

#source-code:target { display: block; } 
#source-code pre 
    { 
    padding:20px; 
    font:14px/1.6 Monaco, Courier, MonoSpace; 
    margin:50px auto; 
    background:rgba(0,0,0,0.8); 
    color:white; 
    width:80%; 
    height:80%; 
    overflow:auto; 
    } 

#source-code pre a, 
#source-code pre a span 
    { 
    text-decoration:none; 
    color:#00ccff !important; 
    } 

#x 
    { 
    position:absolute; 
    top:30px; 
    left:10%; 
    margin-left:-41px; 
    } 

.control-copytextarea 
    { 
    position:absolute; 
    top:-3px; 
    left:20px; 
    cursor: pointer; 
    font-weight: bold; 
    padding:3px 10px; 
    border-radius: 5px 5px 0 0; 
    background: darkred; 
    color: white; 
    display: inline-block; 
    box-shadow: 0 0 3px gray; 
    margin: 0px; 
    font: bold 10px Arial, Sans-Serif; 
    } 
</style> 

<script languade="JavaScript"> 
     $(function() { 
      $("<pre />", { 
       "html": '&lt;!DOCTYPE html>\n&lt;html>\n' + 
         $("html") 
          .html() 
          .replace(/[<>]/g, function(m) { return {'<':'&lt;','>':'&gt;'}[m]}) 
          .replace(/((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/gi,'<a href="$1">$1</a>') + 
         '\n&lt;/html>', 
       "class": "prettyprint" 
      }).appendTo("#source-code"); 

      prettyPrint(); 
     }); 
</script> 

<script languade="JavaScript"> 
     var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); 
     document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); 
</script> 

<script languade="JavaScript"> 
     var pageTracker = _gat._getTracker("UA-68528-29"); 
     pageTracker._initData(); 
     pageTracker._trackPageview(); 
</script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script src="http://css-tricks.com/examples/ViewSourceButton/prettify/prettify.js"></script> 

    </head> 
<body> 



<a class="button" href="#source-code" id="view-source">Show the Source Code for this page</a> 
<div id="source-code" align="left"> 
    <a href="#" id="x"><input type="button" alt="close" class="control-copytextarea" value=" Close Source Code Viewing " /></a> 
</div> 


    </body> 
</html>

источник

2017-03-01 18:30:20 SeekLoad

Получение исходного кода iframe

ответ

Смежные вопросы