如何使用iframe加載html？

的index.html

和

的test.html

，我可以載入我的test.html使用jQuery負載（）;功能上index.html

但後來我的index.html的風格被打破，這就是爲什麼我想我test.html裝入index.html作爲IFRAME ..

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<h1>index.html</h1> 
 

 
<div class="item"> 
 
load test.html here with iframe 
 
</div>

<div class="test"> 
 
I'm a test div and I want to be in index.html in `item` class 
 
</div>

來源

2017-06-08 ani_css

加載h TML文件到iframe

<html> 
<body> 

    <iframe src="test.html"> 
    <p>Your browser does not support iframes.</p> 
    </iframe> 

</body> 
</html>

來源

2017-06-08 13:21:48

記得標記爲接受，如果你覺得它有用 –

只要把你ifream

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<h1>index.html</h1> 
 

 
<div class="item"> 
 
<iframe src="data:text/html;charset=utf-8,%3Chtml%3E%3Cbody%3Efoo%3C/body%3E%3C/html%3E" /> 
 
</div>

使用html文件的URL這將幫助你。

來源

2017-06-08 13:22:46

你可以做的是僅指定要使用jQuery.load這樣時加載內容：

$("#result").load("test.html #container");

然後它會只加載#container的，而不是一切的內容（包括可能的樣式打破你的佈局

如果你想改變一個IFRAME SRC與jQuery你可以使用一個click事件，像這樣：

jQuery(function() { 
    $('button').click(function(e) { 
    e.preventDefault(); 
    $('#result').attr('src', 'test.html'); 
    }) 
})

但我認爲使用第一種方法會更好，只嘗試加載內容本身，而不是整個HTML結構test.html。

我希望幫助:)

來源

2017-06-08 13:24:01 lumio

如何使用iframe加載html？

回答

相關問題