Develop Reference

Is there any way to change value of textarea with HTML

I'm trying to make markdown editor with auto resizable textarea.
I'm using marked library. But when I change value with value={marked(this.props.text)}, it outputs like: <p>Hello</p>
I can't even use dangerouslySetInnerHTML or innerHTML property since textarea doesn't render HTML.
When I use elements such as p, It doesn't look like textarea.
Can someone give me a hint?

I've solved it, see this post
In other to make the element look like textarea, you should translate a carriage return into a br html tag.
In this post:
You could just apply CSS white-space:pre on the element, exactly like the HTML textarea element is internally doing:
<span style="white-space:pre">your text \n will \n be \n on multiple \n lines</span>
Also read this comment - about carriage return

jQuery - how to append values into html elements without getting them parsed as html tags

Yes the question sounds weird, but what I wanna achieve is when I am appending using
.html() function I want certain part of it to behave like
.text() function.
For example in this fiddle http://jsfiddle.net/KZBAy/ ` in
$("#htmltest").html("<ul><li>"+**unescape(escape(testvar))**+"</li></ul>");`
I want the +unescape(escape(testvar))+ to behave as text. i.e the html tags in it should be treated as text, it should not be parsed. This is a simple <li> example please provide a generic solution which can be used for all tags like appending into <div> tag <table> tag etc
Are there any tags like CDATA in html which can instruct the browser not to parse the text inside it??

Well after a lot of googling i found that it was <xmp> tag !!
Though its deprecated it has no exact substitute so far !!!
so where ever we want to instruct the browser not to parse we can prefix and suffix with tag
$("#htmltest").html("<ul><li><xmp>"+unescape(escape(testvar))+"</xmp></li></ul>");
http://jsfiddle.net/EgQSj/1/

You can use html() to set the element markup, then find() the container you want to insert text into and invoke text() on it.
In your case, something like:
$("#htmltest").html("<ul><li></li></ul>").find("li").text(testvar);

Append HTML-escaped text: jQuery

I'm used to using jQuery's .append() method to add text or HTML onto the end of a pre-existing element. I'm currently using jQuery's .text() to escape strings that could potentially contain HTML. Unfortunately, there doesn't seem to be a jQuery method that will append the results of the .text() method to an element instead of replacing its contents.
Is there a way to append, instead of replace, this escaped text to an element? Or is there a better way to escape strings containing HTML?
Thanks.
- EDIT -
A little more context: I'm building an HTML string dynamically, and so I'll need to be able to add multiple elements with escaped content programmatically.

As I have tried many ways, I think the following method is the cleanest way to add text to whatever node you want.
no stock tag needed, only plain text, which will help to avoid potential problems
$(document.createTextNode("SomePlainText")).appendTo(p);

You could create a dummy element to hold the result of .text() which can then be appended to your destination element:
$('<div/>').text('your <span>html</span> string').appendTo(...);

You could just use
$(whatever).text($(whatever).text() + whatever_you_want_to_append);
EDIT for the fiddle in my comment, try this:
for ( /* some looping parameters */ ) {
$('<li></li>') // create an li
.text(stringWithHtml) // pass it the text, as text not html
.appendTo('#thisIsWhatINeed'); // append it where you want it
}
jsFiddle

Textarea - how to highlight keystrings with javascript?

I am looking for a javascript that can help me to change the color of a text inside the textarea tag. For example, to have a variable in the javascript:
var a = '<div class="carleft"><p class="coto1">';
now, the javascript should make the text that is inside the variable, to be displayed as bold with red color in the textarea.

See this previous question/answer: jQuery wrap selected text in a textarea

Inner HTML of the textarea element you cannot change the styles/colors of the partial words or characters.
You should use or some other element to implement this.
You can consider the
contenteditable="true" attribute for this purpose.
By using this attribute you can dynamically edit any html element. Which was styled before.

A textarea does not support different styles or colors in the text. You can use contenteditable="true", but that will probably give the user more freedom than you want. I think a better option would be to use a library like CodeMirror or MDK-Editor.

how to get the contents inside a div along with all html tags along with values present in text box etc tags

how to get the contents inside a div along with all html tags along with values present in text box etc tags .
The jQuery function $('#divid').html() is working in IE but the firefox i am getting the html but the values which are in text area and text box are not setting.
Thanks,
Shriniket

You can't get the content correctly with html, because it only gives you innerHTML of the div element.
You can have a reference to DOM element of that div.
$("#divid").get(0);
with this reference you can move that element to any place in DOM trees.

I would continue to do as you are doing to get the html, and then use the jquery form plugin to get the values of the fields.
http://malsup.com/jquery/form/#api
var value = $('#divid').fieldValue();
value will be an array of values, you may also like fieldSerialize() which return the name value pairs url encoded.