2

I have an HTML page, by clicking elements like buttons new DOM elements are appended to my document using jQuery (i.e. $('#foo').append('<div> ... </div>');). I also remove DOM elements using remove().

I'm aware of validator in order to validate my HTML code. But I need to validate also the HTML code created using jQuery. How can I do that? For example I would like to click a button, see the changed HTML code and validate it and so on ...

I tried using Inspect Element which shows "live" HTML code. But when copying the code it doesn't copy the backslash (/), so when using the pasted document to the validator I get a ton of errors saying that / is missing like this one:

Line 2, Column 69: end tag for "meta" omitted, but OMITTAG NO was specified
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8">

Although my real source code contains:

  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

Any ideas on what to do ?

Anna Fr.
  • 75
  • 6
  • Are you using jQuery to create HTML text or just manipulating the DOM? You probably should be doing the latter, in which case validation is not a concern. – Ray Toal Aug 07 '11 at 09:34
  • 1
    @Ray thanks for your answer :). I create some HTML text and I also manipulate the DOM (some `remove()` calls ...) .. But why in the second case isn't validation a concern? – Anna Fr. Aug 07 '11 at 09:35
  • 1
    Validation concerns itself with rules for what “document” makes sense, but DOM manipulation is really about programming the model rendered by the browser. So validation for that is only a concern if you intend to export the generated DOM as a document (string). – user268396 Aug 07 '11 at 09:51
  • Are you sending your XHTML with application/xhtml+xml mime type? If no, that you should use only `>` instead of `/>`, because browser will "read" your code as html, not xthml. And why you need to validate javascript generated output? It doesn't make sense to me. – shaggy Aug 07 '11 at 09:51
  • AFAIK the purpose of validation is to make sure that the browser can create the DOM correctly based on the HTML it is given. If you're manipulating the DOM directly there's no need to validate: the resulting HTML is a "byproduct" of the DOM manipulation and whether it validates or not has no practical meaning. (EDIT: or, what user268396 said :) – JJJ Aug 07 '11 at 09:54
  • @Juhana ... But if the after the DOM manipulation the code doesn't validate... then how can I be sure that the broswer will correctly show to the user my web page? – Anna Fr. Aug 07 '11 at 09:56
  • @shaggy My code is: ` ` ... shouldn't that work? – Anna Fr. Aug 07 '11 at 09:58
  • @Anna I'm talking about direct manipulation, like with `.remove()` or somesuch, without using HTML. If you're creating HTML snippets and adding them to the document you're not manipulating the DOM directly. – JJJ Aug 07 '11 at 10:04
  • Also, if the browser shows the page correctly, it shows the page correctly. You still have to test the page in different browsers to make sure it behaves correctly. Validation doesn't guarantee full cross-browser compatibility. – JJJ Aug 07 '11 at 10:05
  • @Anna Fr. - DOCTYPE does not matter, it depends what content type are you sending to browser (but I am 100% sure, you are using text/html). So you are sending html to browser, that's why you shouldn't be bothered with these warnings from validator. And like Juhana said - validation doesn't guarantee cross-browser compatibility. – shaggy Aug 07 '11 at 10:27

1 Answers1

0

I would try a browser extension. Something along the lines of this:

Chrome:

https://chrome.google.com/webstore/detail/cgndfbhngibokieehnjhbjkkhbfmhojo

Firefox:

https://addons.mozilla.org/en-US/firefox/addon/total-validator/

I do not use IE or Safari much, so I couldn't help you there.

The only other thing I could think of to try is using jQuery to do something like $('html').html() in your console and copy the result to a text file. I know for sure this will include DOM modifications

BLSully
  • 5,929
  • 1
  • 27
  • 43