Convert plain text to HTML

Question

Convert plain text to HTML

Navigation

#1 by (0 votes)
#2 by (0 votes)
#3 by (0 votes)

0

You can help me with the next problem I have.

I have some text that can be modified within a div , what I could not achieve is to create a function that returns something like the following:

<div><p style="font-size: 14px;">TEST</p></div>

javascript jquery

asked by PolloKulos 04.05.2018 в 19:29

source

3 answers

Django ModelForm filter according to another field Horizontal Scroll in Bootstrap 4

score 0 · Answer 1

0

You can use jQuery's outerHTML () function:

$('#div_text')[0].outerHTML();

answered by 04.05.2018 в 20:06

score 0 · Answer 2

If I did not get it wrong, which is possible

Using jQuery you can empty div with .empty() and then add the new html with .append()

For example;

$('button').on('click',function(){

    var a = "<div><p style='font-size: 14px; color:red;'>TEST</p></div>";
         
         $('#div_text').empty();
         $('#div_text').append(a);
});

     <div id="div_text" class="row" contentEditable="true" style=" border : 1px solid; "> PRUEBA <br /> </div>

<button>Modificar</button>

     <script
     src="https://code.jquery.com/jquery-3.3.1.min.js"
     integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
     crossorigin="anonymous"></script>

It would be good, for future questions, try to formulate them more clearly, because if the solution is the one I propose, the most complex thing to give you help is to interpret what you needed!

EDIT

Otherwise, if you need to get the html located within a div , you can use .html()

For example;

$('button').on('click',function(){

alert($('.prueba').html());

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="prueba">
<p style="color:red;">
Prueba!
</p>
</div>
<button>
Botón
</button>

I hope it's what you're looking for, greetings!

score 0 · Answer 3

Assuming that modifying the text in the input generates an html in the following way <div><p style="font-size: 14px;">TEST</p></div> , then once you have that, you could show it with the function text() of jQuery, for example:

$('textarea').val('TEST');

// suponemos que esto te devuelve parseado el html
var textarea = '<div><p style="font-size: 14px;">TEST</p></div>';


$('#mostrarhtml code').text(textarea);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<textarea></textarea>

<div id="mostrarhtml">
  <code></code>
</div>