☰

HTML属性にJSONを保存する最適な方法は？質問する

tag-icon • tag-icon javascript php html json
HTML属性にJSONを保存する最適な方法は？質問する

JSON オブジェクトを HTML 要素の属性に配置する必要があります。

  1. HTML を検証する必要はありません。

    クエンティンの回答:JSONをdata-*属性に保存するこれは有効な HTML5 です。

  2. JSONオブジェクトは任意のサイズ（つまり巨大）になる可能性がある

    回答者：Maiku Mori:HTML属性の制限は65536文字です。

  3. JSONに特殊文字が含まれている場合はどうなりますか？例： {foo: '<"bar/>'}

    Quentin による回答: 通常の規則に従って、JSON 文字列を属性に入れる前にエンコードします。PHPの場合は、 htmlentities() 関数。

編集 - PHPとjQueryを使用したサンプルソリューション

JSON を HTML 属性に書き込みます。

<?php
    $data = array(
        '1' => 'test',
        'foo' => '<"bar/>'
    );
    $json = json_encode($data);
?>

<a href="#" data-json="<?php echo htmlentities($json, ENT_QUOTES, 'UTF-8'); ?>">CLICK ME</a>

jQuery を使用して JSON を取得します。

$('a').click(function() {

    // Read the contents of the attribute (returns a string)
    var data = $(this).data('json');

    // Parse the string back into a proper JSON object
    var json = $.parseJSON($(this).data('json'));

    // Object now available
    console.log(json.foo);

});

ベストアンサー1

HTML を検証する必要はありません。

なぜそうしないのですか? 検証は多くの間違いを見つける非常に簡単な QA です。HTML 5data-*属性を使用してください。

JSON オブジェクトは任意のサイズ (つまり、巨大) になる可能性があります。

ブラウザの属性サイズ制限に関するドキュメントは見たことがありません。

これに遭遇した場合は、データを に保存します<script>。オブジェクトを定義し、要素idをそのオブジェクト内のプロパティ名にマップします。

JSON に特殊文字が含まれている場合はどうなりますか? (例: {test: '<"myString/>'})

信頼できないデータを属性値に含める場合は、通常のルールに従ってください。&amp;and &quot;(属性値を二重引用符で囲む場合) または&#x27;(属性値を一重引用符で囲む場合) を使用します。

ただし、これは JSON ではないことに注意してください (JSON では、プロパティ名が文字列であり、文字列が二重引用符でのみ区切られる必要があります)。

おすすめ記事