質問編集履歴

1 誤字の編集をしました。

satoxmato

satoxmato score 49

2017/11/10 18:46  投稿

任意のIDを設定しクリックするボタンによって異なる表示をしたい
###実装したい内容
HTMLとjQueryを使ってホームページを作成しております。
タイトル1のリンクをクリックしたらid="mo1"の内容がclass="mo_wrap"内に表示され
タイトル2のリンクをクリックしたらid="mo2"の内容がclass="mo_wrap"内に表示されるように
初心者ながらHTMLとjQueryを使って作成しておりましたがコードがめちゃめちゃになり表示がされないためこちらに質問させていただきます。
###教えていただきたい内容
jQueryにどのように記述すればdata-moin(任意のid)を取得し
<div class="mo_wrap">ここに</div>クリックするボタンによって異なる表示をする事が出来るのか教えていただければ大変勉強になります。
お力をお貸しください。
```
<!-- HTML -->
<a data-moin="mo1">タイトル1</a>
<a data-moin="mo2">タイトル2</a>
<a data-moin="mo3">タイトル3</a>  
<div id="mo1" class="botan">
 <h3>タイトル1</h3>
 <p>タイトル1の文章</p>
</div>
<div id="mo2" class="botan">
 <h3>タイトル2</h3>
 <p>タイトル2の文章</p>
</div>
<div class="mo_wrap">
 <!-- ここにクリックするボタンによって異なる表示をしたい -->
</div>
<!-- css -->
<style>
 .botan{display:none;}
</style>
<!-- jQuery -->
<script>
 <!-- ここになにを書けばdata-moinを取得し -->
</script>
```
よろしくお願いします。
  • JavaScript

    28616 questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    17607 questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    11010 questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • Webサイト

    2380 questions

    一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る