Как я могу напрямую включить JSON в атрибут data5 * HTML5, чтобы JSON оставался как читаемым, так и машиночитаемым?

Question

JSON использует двойные кавычки.

Мое ограничение среды заключается в том, что я должен помещать атрибуты HTML в двойные кавычки.

Я знаю, что могу кодировать JSON, используя:

• Кодировка URL (через encodeURI(JSONToEncode))
• Кодировка Base64 (через window.btoa(JSONToEncode))

Но как я могу напрямую включить JSON в HTML5data-* атрибут, чтобы он оставался (максимально) читаемым человеком, а также машиночитаемым?

например. Как я могу включить это:

{"chosenStarter" : "bhajis", "chosenMain" : "madras", "chosenDessert" : "kulfi"}

в этом:

data-menu="[... VALUE HERE...]"

Answer 1

Один простой и понятный человеку подход заключается в использовании угловых кавычек :

data-menu="{«chosenStarter» : «bhajis», «chosenMain» : «madras», «chosenDessert» : «kulfi»}"

, а затем преобразовании в JSON с:

const myJSON = myElement.dataset.menu.replace(/«|»/g, '"');