HTML5 左メニュー全体のインクルドはできましたが、左メニューの特定パーツ(BOX:プールダウンメニュー)のみインクルドできないものか調べましたが、分かりません。
HTMLにお詳しい方どうぞご教授宜しくお願い致しますm(__)m
※参:画像
<!DOCTYPE html>
<!-- 省略 -->
<!-- インクルドjs -->
<script src="content2.js"></script>
</head>
<body>
<!-- 省略 -->
<!-- 省略 -->
<!-- 左メニュー -->
<div class="content1">
BOX①
</div>
<!-- 左メニューBOX② -->
<div class="content2">
<!-- ●インクルドさせたい● -->
<script>include("content2"); </script>
<p>インクルドHTMLは別に用意:content2.html</p>
</div>
左メニューの省略「BOX②のパーツ」のみ、インクルド化する方法はありますでしょうか?
サイトを色々調べましたが、左メニュー特定BOX(プールダウンメニュー)だけのインクルド化は分かりませんでした。
※また色々試しましたが、左メニューが「横並び」になります。
<div class="content2">
CSS、HTMLの記述の問題ありかと思っております。
HTML・CSSにお詳しい方、
2カラム・左メニュー縦並びで「BOX②のみインクルド化」する方法があるようでしたら、是非宜しくお願い致します。


No.2ベストアンサー
- 回答日時:
こんにちは
「インクルド」はインクルード(=include)のことであろうと解釈しました。
質問文には情報がほとんどないので、何ともですけれど・・
>「BOX②のパーツ」のみ、インクルド化する方法はありますでしょうか?
javascriptを用いて行なおうとしているのでしょうか?
いずれにしろ、BOX②(=.content2 かな?)の内容だけ外部から読み込むようにすれば良いです。
「content2.js」なるものの内容が不明ですが、「指定要素に読み込んだ内容をセットする」ものになっているとするならば、そのままでできると思いますので、できないという事はスクリプトの内容と使い方が合ってないという事でしょう。
あるいは、スクリプト自体がトンチンカンなのかも知れません。
(内容が不明なので、わかりません)
>「BOX②のパーツ」
と言っているのが、「BOX②」のことではなく、更にその一部と言う意味なら、その部分の包含要素のみ記述しておいて、スクリプトでその内容を置き換えれば良いですね。
同じことを対象を変えて行うだけと言えます。
(包含要素なしでもできますが、一般化しにくくなります)
>※また色々試しましたが、左メニューが「横並び」になります。
「左メニュー」全体は意図通りに配置できているものとします。
BOXと称しているものはDIV要素になっているので、デフォルトでは縦並びになるはずです。
(素のHTML記述のみであれば、縦並びになるという意味です)
ですので、質問者様が「横並びになるように設定している」ものと考えられます。
BOXを装飾しているCSS等でレイアウトに関するものを順に外してみれば、どれが悪さをしているかわかるでしょう。
(親要素にflexを指定しているとかかもしれません)
ソース長くなり、短い情報でとても分かりやすい回答誠にありがとうございます。
BOX②は外部からの読み込みにしております。
おしゃる通りflex 辺りを見直してみたいと思います。
更に色々試し、できない場合短いソースを記述して改めて質問します。
似たタイトルで質問しますので、ご教授宜しくお願い致しますm(__)m
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSS初心者です。わかる方教えてください。 3 2023/09/08 22:04
- HTML・CSS 初心者html・CSS ウィンドウを縮小するとタグの一部が隠れてしまう。 1 2023/12/18 19:52
- JavaScript Colorboxがうまく設置できません 2 2024/01/13 16:59
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS HTML、cssのatomつぅーやつで 課題Ex1ってやつを表示させたいのですが、 私は課題Ex1が 2 2022/12/15 16:56
- JavaScript javascriptのエラーで質問です。 2 2024/02/03 18:52
このQ&Aを見た人はこんなQ&Aも見ています
-


CSSでinputのテキストカラーを変えたのですがパソコンで確認すると色が変わっているのですがiPh
HTML・CSS
-


PHPの勉強してます。 配列のところですが、 実行結果は、9になりますが、 そのロジックを教えてくだ
PHP
-


BASIC認証のフォームをデザインしたい
PHP
-
-
4

プログラミングのやり方ざっくりでいいから教えて
その他(プログラミング・Web制作)
-
5

c++の勉強方法を教えてくださいプログラミングをやった事がなく1から勉強を始めようと思います1日1時
C言語・C++・C#
-
6

SplFileObject を利用したときの5C問題?
PHP
-
7

Webサイトの「デザインのみ(コーディング不要)」を依頼されました。 「レスポンシブデザイン」を希望
HTML・CSS
-
8

HTML&CSS メディアクエリについて。
HTML・CSS
-
9

JavaScriptを本で勉強しています。 ほんとのほんとの序盤なのですが、 本の内容に、vscod
JavaScript
-
10

jsで質問です。 formをsubmitしてサーバー側で処理が行われて処理が完了したら、フロント側で
JavaScript
-
11

HTML PHP ラジオボタンのイベント
PHP
-
12

CSSを教えて下さい webデザイナーの職業訓練に通うコーディング初心者です。 サイトを作っていまし
HTML・CSS
-
13

[Excel VBA]特定の条件で文字を削除&残す処理をするファイルを作成したいです
Visual Basic(VBA)
-
14

プログラミングについて プログラミングの練習(勉強)ができるようなサイトなどありませんか? あれば教
その他(プログラミング・Web制作)
-
15

考えた式の戻り値が期待通りにならない
Excel(エクセル)
-
16

企業用のブログで何を書けばいいのかわかりません・・・
SEO
-
17

Web初心者です。 簡易的なWebページを作成し
その他(プログラミング・Web制作)
-
18

アップロードファイルを表示するためにはどうすればよいでしょうか?
PHP
-
19

(マクロ)値を返す時は subでもfunctionでもどちらでも良いのでしょうか?
Excel(エクセル)
-
20

webディベロッパーについて詳しい方教えてくたまに…詳しく書かれているサイトでもいいので教えてくださ
HTML・CSS
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlの文字が縦書きになる
-
テーブルの行を折りたたみたい...
-
HTML/CSSを使って写真のような...
-
スマホ(android)のタッチパネ...
-
初心者html・CSS ウィンドウを...
-
ホームページの制作について教...
-
CSSデータの作成方法について(...
-
メモ帳の段落の揃え方
-
HTMLタグのあるCSVファイルを利...
-
WEBページを強制的に横画面で見...
-
css初心者 フレックスボックス...
-
テーブルタグのセルの幅の一部...
-
HTMLでクロス抽出したい
-
レスポンシブで困っています・・
-
GoogleSearchControlにホームペ...
-
htmlの<input type=”file”>でア...
-
Webサイトの「デザインのみ(コ...
-
webディベロッパーについて詳し...
-
CSSを教えて下さい webデザイナ...
-
静止画画像をクリックすると音...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlの文字が縦書きになる
-
テーブルの行を折りたたみたい...
-
レスポンシブで困っています・・
-
HTMLでクロス抽出したい
-
iPhoneで HTMLファイルを閲覧
-
HTML/CSSを使って写真のような...
-
ホームページの制作について教...
-
スマホでHTMLファイルを開いて...
-
GoogleSearchControlにホームペ...
-
メモ帳の段落の揃え方
-
css初心者 フレックスボックス...
-
スマホ(android)のタッチパネ...
-
WEBページを強制的に横画面で見...
-
角丸画像の背景色を透明にした...
-
、URL化させるにはどうしたらい...
-
HTMLタグのあるCSVファイルを利...
-
静止画画像をクリックすると音...
-
テーブルのセルデータを自動改...
-
テーブルタグのセルの幅の一部...
-
スマホで、左右にスワイプして...
おすすめ情報










