1

There is already the html() function in jQuery.

The problem I am having with this function is that, in its returned html string, all the self-closing / are stripped off from the elements. For example,

<div>
<input type="text" name="textbox1" value="" />
</div>

Becomes:

<div>
<input type="text" name="textbox1" value="">
</div>

I know this is normal for this function since this is valid in html.

But I would like to have a function that returns valid xml so that the / is still there in the returned string.

It seems jQuery itself does not provide such a function, so I wonder if anyone knows of any plugin that can make this possible.

Thanks in advance.

Improve this question

3 Answers 3

Reset to default
2

I think you are misconceiving how browsers interpret HTML. They don't keep a copy of your source file and modify it according to your Javascript. Rather, a browser reads your HTML and parses it into a DOM representation. This corrects any mistakes you may have made in your HTML. When you try to get the HTML of an element, the element is converted to a string according to the current DOCTYPE. Since you probably have an HTML doctype (it's quite hard to get a browser to genuinely treat your document as XHTML), you get HTML returned to you.

Doing this in Javascript is almost certainly not the way to go.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

I also think this is how browser interprets html and since the html returned from html() is already corrected in some way by the browser. Converting it to xml becomes easier.
1

I think this is what I need.

Thank you very much for everyone's reply.

http://code.google.com/p/jquery-clean/

UPDATE 1: I thought this plugin would work but actually it does not. The way I use it is that, I pass it the html string returned by html() and let it fix the tags which do not properly self-close.

However, the way it corrects the tags is not what I need (seems like a bug).

For example, passing it the following html:

<div><input type="text" id="txt1" name="txt1"><label for="txt1">TextBox1</label></div>

It gives:

<div><input type="text" id="txt1" name="txt1"><label for="txt1">TextBox1</label></input></div>

Rather than:

<div><input type="text" id="txt1" name="txt1" /><label for="txt1">TextBox1</label></div>

UPDATE 2: The bug I mention above is already fixed. This plugin works now. If you want to test it out, feel free to paste your html in this page and see if it works for you: http://www.antix.co.uk/Content/Demos/jQuery-htmlClean/Test.htm

Improve this answer

2 Comments

Did you find another solution? This plugin still doesn't work.
@Stephan Ryer I just tested this plugin again. It seems to work now, meaning that the bug I mentioned is already fixed. You may try to paste your html in this test page and see if it gives you the desired xhtml: antix.co.uk/Content/Demos/jQuery-htmlClean/Test.htm
0

You could try using the native .innerHTML property (you cen get the native element using .get() in jQuery).

Improve this answer

1 Comment

the html string returned by the native innerHTML property has the same problem (self-closing /s are stripped off).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.