取得したJSONデータをHTML上に出力させたいです。

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

下記、出力後のhtmlをJSONで出力したいと思っております。

<ul class="countryList" id="countryList"> <li class="banjp"><a href="/jp/" target="_blank">日本></a></li> <li class="banau"><a href="/au/" target="_blank">Australia></a></li> <li class="banbe"><a href="/be/" target="_blank">Belgium></a></li> <li class="banbn"><a href="/bn/" target="_blank">Brunei></a></li> <li class="banca"><a href="/ca/" target="_blank">Canada></a></li> <li class="bancn"><a href="/cn/" target="_blank">中国></a></li> <li class="banfr"><a href="/fr/" target="_blank">France></a></li> <li class="banhk"><a href="/hk/" target="_blank">香港/澳門></a></li> <li class="banid"><a href="/id/" target="_blank">Indonesia></a></li> <li class="bankr"><a href="/kr/" target="_blank">한국></a></li> <li class="banmx"><a href="/mx/" target="_blank">Mexico></a></li> <li class="banmy"><a href="/my/" target="_blank">Malaysia></a></li> <li class="bannz"><a href="/nz/" target="_blank">New Zealand></a></li> <li class="banph"><a href="/ph/" target="_blank">Philippines></a></li> <li class="bansg"><a href="/sg/" target="_blank">Singapore></a></li> <li class="bantw"><a href="/tw/" target="_blank">台灣></a></li> <li class="banth"><a href="/th/" target="_blank">Thailand></a></li> <li class="banuk"><a href="/uk/" target="_blank">United Kingdom></a></li> <li class="banus"><a href="/us/" target="_blank">USA></a></li> </ul>

どのようにしたら、上記htmlをJSONで出力可能でしょうか？

m.ts10806

2019/08/08 07:28

コードはマークダウンのcode機能を利用してご提示ください。 https://teratail.com/help#about-markdown また、質問内容から「そもそも元となるJSONがない」と推察されますが、 >どのようにしたら、上記htmlをJSONで出力可能でしょうか？となると「まずはJSON作ってみましょう」ということにしかなりません。自身ではどこまでできていて何が分かっていないのでしょうか？具体的に記載してください

m.ts10806

2019/08/08 08:32

>取得したJSONデータをHTML上に出力させたいです。と >出力後のhtmlをJSONで出力したいは相反する要件です。どっちでしょうか。質問を編集して先の指摘事項とあわせて調整してください。

行動規範の内容に同意します

回答1件

htmlをjsonで出力する意図がわかりませんが、そのまま信じて書くとこうです

javascript
1var html=`<ul class="countryList" id="countryList">
2<li class="banjp"><a href="/jp/" target="_blank">日本<span class="icon">&gt;</span></a></li>
3<li class="banau"><a href="/au/" target="_blank">Australia<span class="icon">&gt;</span></a></li>
4<li class="banbe"><a href="/be/" target="_blank">Belgium<span class="icon">&gt;</span></a></li>
5<li class="banbn"><a href="/bn/" target="_blank">Brunei<span class="icon">&gt;</span></a></li>
6<li class="banca"><a href="/ca/" target="_blank">Canada<span class="icon">&gt;</span></a></li>
7<li class="bancn"><a href="/cn/" target="_blank">中国<span class="icon">&gt;</span></a></li>
8<li class="banfr"><a href="/fr/" target="_blank">France<span class="icon">&gt;</span></a></li>
9<li class="banhk"><a href="/hk/" target="_blank">香港/澳門<span class="icon">&gt;</span></a></li>
10<li class="banid"><a href="/id/" target="_blank">Indonesia<span class="icon">&gt;</span></a></li>
11<li class="bankr"><a href="/kr/" target="_blank">??<span class="icon">&gt;</span></a></li>
12<li class="banmx"><a href="/mx/" target="_blank">Mexico<span class="icon">&gt;</span></a></li>
13<li class="banmy"><a href="/my/" target="_blank">Malaysia<span class="icon">&gt;</span></a></li>
14<li class="bannz"><a href="/nz/" target="_blank">New Zealand<span class="icon">&gt;</span></a></li>
15<li class="banph"><a href="/ph/" target="_blank">Philippines<span class="icon">&gt;</span></a></li>
16<li class="bansg"><a href="/sg/" target="_blank">Singapore<span class="icon">&gt;</span></a></li>
17<li class="bantw"><a href="/tw/" target="_blank">台灣<span class="icon">&gt;</span></a></li>
18<li class="banth"><a href="/th/" target="_blank">Thailand<span class="icon">&gt;</span></a></li>
19<li class="banuk"><a href="/uk/" target="_blank">United Kingdom<span class="icon">&gt;</span></a></li>
20<li class="banus"><a href="/us/" target="_blank">USA<span class="icon">&gt;</span></a></li>
21</ul>`;
22console.log(JSON.stringify(html));