HTML 문자열을 JSON으로 쓰기

HTML 문자열을 JSON으로 쓰기

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>"
    }
]

html 문자열의 큰따옴표와 같은 문자는 "\"를 추가하여 이스케이프해야 합니다.

::<h2 class=\"fg-white\">

Html을 JSON에 추가하기 전에 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");

HTML을 올바르게 이스케이프하면 할 수 있습니다.이 페이지에는 필요한 작업이 표시됩니다.

PHP 를 사용하고 있는 경우는, json_encode() 를 사용할 수 있습니다.

이것이 도움이 되기를 바랍니다:)

HTML을 JSON에 넣을 때 해야 할 4가지 사항:

1)되는 이스케이프 1) 속성 주위에 사용됩니다.<img src=\"someimage.png\" />

2) 태그로.2) HTML 엔드 태그로 . <div>Hello World!<\/div>.은 HTML에 때을 원치 사양의 입니다.<SCRIPT>어떤 이유에서인지 오늘날의 브라우저들은 여전히 그것을 좋아한다.

3)했어 3) )건 3 3 3 3 3 3 3 3 3 3 3 3 3 3 。자체 닫기 태그의 태그 이름과 슬래시 사이에는 공백을 포함해야 합니다.는 MOST 하여 ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★<li> 붙입니다.<ul/> 될 거야작동이 안될 거에요. tagul DOM 에 됩니다.: 음음 、 음 、 음 、 음 、 음 、 음 :<ul />(/ 앞에 공백 표시), 모든 것이 정상적으로 동작합니다.말말이이이이다다

(콘텐츠에 따옴표는 .4).이것은 실수로 스트링을 조기에 종료함으로써 실제로 JSON을 망가뜨리는 유일한 요소입니다.의 ★★★★"는 음음음음음음음음음 as as as as as as as로 ."HTML html html html html html html html html html 。

경유로

아래 HTML을 렌더링한다고 가정해 보겠습니다.

let myHTML = "<p>Go to this <a href='https://google.com'>website </b></p>";
JSON.parse(JSON.stringify(myHTML))

그러면 내부 기능을 사용하여 설정할 수 있는HTML 요소가 제공됩니다.HTML.

이것처럼.

document.getElementById("demo").innerHTML = JSON.parse(JSON.stringify(myHTML));

사람들은 HTML을 오브젝트로 여기에 저장하고 있다.그러나 제가 제안한 방법은 오브젝트를 사용하지 않고도 동일하게 동작합니다.

HTML 문자열을 JSON으로 작성할 수 있습니다.넌 그저 이중인용에서 벗어나면 돼.

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

HTML 내의 큰따옴표를 작은따옴표로 대체하는 방법도 있지만 큰따옴표를 사용하는 것이 HTML 내의 속성값의 표준규약이 되었습니다.

더 나은 옵션은 json 및 이스케이프해야 하는 다른 문자의 큰따옴표를 이스케이프하는 것입니다.

이스케이프에 대한 자세한 내용은 여기를 참조하십시오.JSON Ajax 반환 유형에 필요한 이스케이프 문자 목록은 어디서 찾을 수 있습니까?

슬래시도 회피해야 합니다.정확한 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>"
}]

가장 쉬운 방법은 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>"
    }
];

만지작거리다.

식별자를 쿼리 실렉터의 파라미터로 할 수 있습니다.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>"}

json에서는 모든 것이 큰따옴표 " 사이의 문자열이므로 excape가 필요합니다(직접 쓰기만 가능).백슬래시 \를 사용합니다.

{}로 둘러싸인 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>"
    }
  ]
}

Vue를 사용하는 경우 v-html 지시문을 사용할 수 있습니다.

<div class="columns>
    <p v-html="resource.body"></p>
</div>

html 온라인 에디터를 사용할 수 있습니다.즉, Every html tag 및 brackets html entity value 를 사용하여 이들 태그(특수 괄호)를 대응하는 엔티티 값의 예로 변환할 수 있습니다.

<h1>Hello<h1>

는, 다음과 같이 기술할 수도 있습니다.

<h1>Hello </h1&gt;

Html

HTML 에디터

html write html code를 열고 소스 코드 버튼을 클릭합니다. php의 경우 이 함수를 사용합니다.

html을 json이나 html의 전체 블록에 추가하고 싶을 때는 이렇게 합니다.

$html = <<<HTML
    Put here all your html code, you can easy use $variables as well
HTML;
$jsonOBJ['html'] = $html;
echo json_encode($jsonOBJ);

이 예는 도움이 될 수 있습니다.

let express = require('express')
let app = express()

//HTML in JSON
let jh = [
    {"tag":"h1","text":"hello","style":"background-color: black;color:white","options":""}
]

//Convert JSON into HTML
let tag = (tag,text,style,options)=>{return `<${tag} style="${style}" ${options}>${text}</${tag}>`}

let header = tag(jh[0]["tag"],jh[0]["text"],jh[0]["style"],jh[0]["options"])

//Show on page
app.get('/',(req,res)=>{
    res.send(header)
})

app.listen('5000')

언급URL : https://stackoverflow.com/questions/22551586/write-html-string-in-json