htmlページを読み込むhtml/javascriptコード

htmlとcssコードを使用してタブを作成しました。各タブに表示されるコンテンツは、異なるHTMLページに配置されます。 API（jquery/PHP ..）を使用せずにタブの内容を読み込みたいです。私は、ユーザーがタブに移動し、私はこれを達成するためにhtml/javascriptだけを使用したいときにhtmlページをロードしたい。htmlページを読み込むhtml/javascriptコード

Code demo

私は以下のコードを使用して試してみましたが、その作業はありません。

<html> 
<head> 
    <script src="http://www.w3schools.com/lib/w3data.js"></script> 
    <script> 
     w3IncludeHTML(); 
    </script> 
</head> 
<body> 
.. 
    <div class="tab"> 
     <input type="radio" id="tab-1" name="tab-group-1" checked> 
     <label for="tab-1">Tab1</label> 
     <div class="content"> 
      <div w3-include-html="tab1Content.html"></div> 
     </div> 
    </div> 
</body>

出典

2016-12-14 joann

タブの動作を設定するCSSを含めるとよいでしょう。また、最初の ''タグの後に '..'を修正することをお勧めします –

私はdiv要素の中にはiframeを追加するために使用：

<div class="content"> 
    <iframe src="file.html">  
    </iframe> 
</div>

出典

2016-12-14 21:43:45 Qiong

これを行うためのいくつかの方法があります。
1）のiFrameこれに代え
：

<div w3-include-html="tab1Content.html"></div>

はこれを行います。

<iframe src="tab1Content.html"></iframe>

2）PHP
をいくつかの理由のためのiFrameがあなたのために動作しない場合、あなたはPHPでこれを行うことができます：

<div class="content"><?php echo file_get_contents("tab1Content.html");?></div>

出典

2016-12-14 22:13:02

htmlページを読み込むhtml/javascriptコード

答えて

関連する問題