Put a bit of HTML inside a
 tag?

后端 未结 3 2078
北海茫月
北海茫月 2021-01-12 10:39

How do I put a bit of HTML inside a tag without escaping it? Or am I using an incorrect tag?

P.S. I cannot escape the HTML, it is produced by the s

相关标签:
3条回答
  • 2021-01-12 11:08

    If you have no control over the emitted HTML, you can still encode it on the client side.

    Here is how you would escape all markup inside <pre> tags using the jQuery library:

    $(function() {
        var pre = $('pre');
        pre.html(htmlEncode(pre.html()));
    });
    
    function htmlEncode(value){ 
      return $('<div/>').text(value).html(); 
    } 
    

    Edit: As requested, same code without using jQuery:

    function encodePreElements() {
        var pre = document.getElementsByTagName('pre');
        for(var i = 0; i < pre.length; i++) {
            var encoded = htmlEncode(pre[i].innerHTML);
            pre[i].innerHTML = encoded;
        }
    };
    
    function htmlEncode(value) {
       var div = document.createElement('div');
       var text = document.createTextNode(value);
       div.appendChild(text);
       return div.innerHTML;
    }
    

    And run the encodePreElements after the DOM has been loaded:

    <body onLoad='encodePreElements()'>
        <pre>Foo <b>bar</b></pre>
    </body>
    
    0 讨论(0)
  • 2021-01-12 11:23

    This:

        <pre>
          <&zwj;div>Hello<&zwj;/div>
        </pre>
    

    Prints this:

    <div>Hello</div>
    

    Zero Width Joiner = &zwj;

    0 讨论(0)
  • 2021-01-12 11:23

    You need to escape the HTML, like so:

    You can use HTML entities that are escaped and printed without compiling.

    &#60; // will print <
    &#62; // will print >
    

    Using these two, you can print any HTML elements.

    &#60;div&#62; // will print <div>
    

    To solve your specific problem, you will need to parse the HTML string and convert the chevrons to these entities.

    0 讨论(0)
提交回复
热议问题