web-dev-qa-db-ja.com

JSONでHTML文字列を書く

JSON内にHTML文字列を書くことは可能ですか？

私のJSONファイルに以下のように書きたいもの：

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": "<h2class="fg-white">AboutUs</h2><pclass="fg-white">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology </p>"
    }
]
javascriptjqueryhtmljson
16
Rasmikant

「\」を追加して、html文字列内の二重引用符などの文字をエスケープする必要があります

例：<h2 class=\"fg-white\">

26
Sahil Mittal

HTMLを正しくエスケープすると、できます。 このページ は、何をする必要があるかを示しています。

PHPを使用している場合は、 json_encode（） を使用できます

お役に立てれば ：）

6
flauntster

JSONにhtmlを追加する前にBase64アルゴリズムを使用してhtmlをエンコードし、読み取り時にBase64を使用してhtmlをデコードするだけです。

byte[] utf8 = htmlMessage.getBytes("UTF8");
htmlMessage= new String(new Base64().encode(utf8));


byte[] dec = new Base64().decode(htmlMessage.getBytes());
htmlMessage = new String(dec , "UTF8");
6
Mahesh

JSONでHTML文字列を記述することは可能です。二重引用符をエスケープするだけです。

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": "<h2class=\"fg-white\">AboutUs</h2><pclass=\"fg-white\">CSMTechnologiesisapioneerinprovidingconsulting,
        developingandsupportingcomplexITsolutions.Touchingmillionsoflivesworldwidebybringingininnovativetechnology,
        CSMforayedintotheuntappedmarketslikee-GovernanceinIndiaandAfricancontinent.</p>"
    }
]
3
Ben

スラッシュもエスケープする必要があります。正しいJSONは次のとおりです。

[{
"id": "services.html",
"img": "img/SolutionInnerbananer.jpg",
"html": "<h2class=\"fg-white\">AboutUs<\/h2><pclass=\"fg-white\">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology <\/p>"
}]
1
Lydia halls

1つの方法は、HTML内の二重引用符を単一引用符に置き換えることですが、二重引用符を使用することがHTMLの属性値の標準規則になりました。

より良いオプションは、エスケープする必要のあるjsonやその他の文字の二重引用符をエスケープすることです。

エスケープの詳細については、こちらをご覧ください： JSON ajax戻り値型に必要なエスケープ文字のリストはどこにありますか

1
Praveenram Balachandar

以下のHTMLをレンダリングしようとしているとしましょう。

_let myHTML = "<p>Go to this <a href='https://google.com'>website </b></p>";_

JSON.parse(JSON.stringify(myHTML))これは、innerHTMLを使用して設定できるHTML要素を提供します。

このようなdocument.getElementById("demo").innerHTML = JSON.parse(JSON.stringify(myHTML));

人々はHTMLをオブジェクトとして保存しています here 。ただし、私が提案した方法は、オブジェクトを使用せずに同じことを行います。

0
Rahul Makhija

JSONにHTMLを挿入するときに行う必要がある4つのこと：

1）<img src=\"someimage.png\" />のようにHTML属性を囲む引用符をエスケープします

2）HTML終了タグのスラッシュをエスケープします。 <div>Hello World!<\/div>.これは、HTMLパーサーに<SCRIPT>タグに文字列を入れるときに混乱させたくない古いHTML仕様の古代のアーティファクトです。なんらかの理由で、今日のブラウザはまだ気に入っています。

3）これはまったく奇妙でした。自己終了タグでは、タグ名とスラッシュの間にスペースを入れる必要があります。これがなぜなのかわかりませんが、最新のブラウザでは、javascriptを使用して<li>タグを次のようにフォーマットされた順不同リストの子として追加しようとすると：<ul/>、仕事。 ulタグの後にDOMに追加されます。ただし、コードが<ul />（/の前のスペースに注意してください）のようであれば、すべてが正常に機能します。確かに非常に奇妙です。

4）（悪い）HTMLコンテンツに含まれる可能性のある引用符は必ずエンコードしてください。これは、誤って文字列を早期に終了して、JSONを実際に壊す唯一のものです。 HTMLコンテンツとして含める場合は、"文字を&quot;としてエンコードする必要があります。

via

0
k2fx

最も簡単な方法は、HTMLを一重引用符で囲むことです。変更されたjsonオブジェクトは次のとおりです。

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": '<h2 class="fg-white">AboutUs</h2><p class="fg-white">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology </p>'
    }
];

フィドル 。

そして、最善の方法は、二重引用符やエスケープする必要のある他の文字をエスケープすることです。変更されたjsonオブジェクトは次のとおりです。

[
    {
        "id": "services.html",
        "img": "img/SolutionInnerbananer.jpg",
        "html": "<h2 class=\"fg-white\">AboutUs</h2><p class=\"fg-white\">developing and supporting complex IT solutions.Touchingmillions of lives world wide by bringing in innovative technology </p>"
    }
];

フィドル 。

0
user2466202

jsonではすべてが二重引用符「」の間の文字列ですので、値に発生する場合はエスケープが必要です（直接書き込みのみ）バックスラッシュを使用してください\

jsonファイルの{}でラップされたものはすべて、jsonを

{
  [
    {
      "id": "services.html",
      "img": "img/SolutionInnerbananer.jpg",
      "html": "<h2 class=\"fg-white\">AboutUs</h2><p class=\"fg-white\">developing and supporting complex IT solutions.Touching millions of lives world wide by bringing in innovative technology</p>"
    }
  ]
}
0
Iliya

識別子をクエリセレクターのパラメーターにすることができます。 PHPおよび互換性のある言語では、連想配列（実際にはオブジェクト）を使用してからjson_encodeを使用します。

$temp=array('#id'  =>array('href'=>'services.html')
           ,'img'  =>array('src'=>"img/SolutionInnerbananer.jpg")
           ,'.html'=>'<h2 class="fg-white">AboutUs</h2><p class="fg-white">...</p>'
           );
echo json_encode($temp);

しかし、HTMLは、JSなしではそれを行いません。

{"#id":{"href":"services.html"},"img":{"src":"img\/SolutionInnerbananer.jpg"}
 ,".html":"<h2 class=\"fg-white\">AboutUs<\/h2><p class=\"fg-white\">...<\/p>"}
0
B.F.