特定のクラスのiframe内の警告リンク

[検索]ボタンをクリックすると、両方のリンク（iframe内）にクラス検索が表示されます。特定のクラスのiframe内の警告リンク

jQueryを使用してこれを実現するにはどうすればよいですか？ここで

は私のHTMLコードです：ここで

<html> 
    <head> 
    <title>TODO</title> 
    </head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

    <body> 
    <div id="btn"> 
     <button id="btn-search">Search</button> 
    </div> 
    <div class="iframebox"> 
     <iframe id="messageiframe"> 
     #document 

     <!DOCTYPE html> 
     <html> 

     <head> 
      <title>test</title> 
     </head> 

     <body> 
      <div id="textpreview"> 
      <p id="pre">some text</p> 
      </div> 

      <div id="preview"> 
      <ul id="list"> 
       <li class="mail"><a href="https://mail.gmail.com">Gmail</a></li> 
       <li class="search"><a href="https://www.google.com">Google</a></li> 
       <li class="mail"><a href="https://mail.outlook.com">Outlook</a></li> 
       <li class="search"><a href="https://www.bing.com">Bing</a></li> 

      </ul> 
      </div> 
     </body> 

     </html> 
     </iframe> 
    </div> 
    </body> 

</html>

は、私が試した私のjQueryのコードですが、働いていない：

$('#btn-search').on('click', function() { 
    var links = []; 
    var t = $("#messageiframe").contents().find("#preview"); 
    var link = ''; 
    t.find('li.search').children('a').each(function() { 
    link += $(this).text(); 
    }); 
    links.push(link); 
    alert(links); 
});

とJSFiddle

出典

2017-07-10 Snappy

正確に何が必要なのか教えてください。 –

これは単なる例で、 'iframe'タグ間のコードは実際に別のファイルに置かれますね。 – Teemu

はい、あなたは正しい@テムです。 – Snappy

をiframeの内容にアクセスするには以下を使用してください：

var iframe = document.getElementById('messageiframe'); 
var innerDoc = iframe.contentWindow.document;

クラスまたはIDに基づいて除外する文書内から.getElementsByClassName()または.getElementsById()関数を使用します。

innerDoc.getElementsByClassName("search")

次に、フィルタリングされたオブジェクトのリストを使用し、JQueryを使用したいと思うようにそれらのオブジェクトを使用します。そして、ボイラー、警報が働いている！問題のいくつかのエラーが直接iframe内のコードを含むように、あったことJSFiddle

注：

はここで働いソリューションを参照してください。そのためには、属性をiframesとしてください。彼らは解決策フィドルで修正されました。しかし、あなたは別のファイルからhtmlを使用しているので、それについてもっと熟考する必要はありません。

出典

2017-07-10 07:39:15 Rithwik

お手伝いがあれば正解にしてください。ありがとう。 – Rithwik

ありがとう@Rithwik。 – Snappy

特定のクラスのiframe内の警告リンク

答えて

関連する問題