All geek questions in one place

Unable to run JavaScript in CDATA

I am trying to run the following HTML in every browser: Opera, FF, IE, Chrome

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"> </head> <body> <script> <![CDATA[ alert('Hey!'); ]]> </script> </body> </html>

None of them display a warning. Chrome logs an error message in the console: Uncaught SyntaxError: Unexpected token <. He seems to be complaining about a fist in a CDATA declaration. Firefox also logs a "syntax error"

W3schools states that this is a way to use CDATA http://www.w3schools.com/xml/xml_cdata.asp . Other answers on this site suggest this. What am I doing wrong? I tried playing with namespaces and dotypes, but that didn't change anything.

Edit: I added the XHTML and doctype namespace that I originally deleted, and the problem still persists.

+4
source share
5 answers

Related question When is the CDATA section needed in a script tag? , explains that the CDATA section is recommended when embedding scripts in XHTML documents. However, simply setting the XHTML document type to the test document is not enough. CDATA is still considered a syntax error.

According to this blog post , this is because the content type must match the doctype definition. The correct XHTML should have the following set of Content-type headers:

 Content-type: application/xhtml+xml

if this is not specified and text/html sent instead, browsers will revert to HTML. Indeed, if I add this title to my test case, browsers will begin to correctly parse JavaScript inside CDATA, even when CDATA does not comment out.

This works for me (setting the header using PHP):

 <?php header("Content-type: application/xhtml+xml"); echo '<?xml version="1.0" encoding="UTF-8"?>'; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <script><![CDATA[alert('Hey!');]]></script> </head> <body> </body> </html>​
+5
source

The difference between HTML and XHTML. W3Schools is correct that its a valid CDATA construct in XHTML, but since your question indicates that your code is HTML and there isn’t such a thing in HTML <script> in HTML, your example does not work as soon as the interpreter sees "<;". You can tell the browser that it is looking at XHTML, but it is probably safer to process HTML. To do this, you need to hide CDATA inside JavaScript comments. (You might also want to determine which language is inside the <script> block.)

 <html> <head> </head> <body> <script> //<![CDATA[ alert('Hey!'); //]]> </script> </body> </html>

This is essentially the method recommended by the World Wide Web Consortium (W3C) in XHTML Media Types, A.4. Built-in style sheets and scripts .

+6
source

You can see this as XML (XHTML), but that’s not how the browser sees it.

You serve it text/html , which means the browser sees it as HTML.

It needs to be served with an XML mime type such as application/xhtml+xml

i.e. like this

http://www.alohci.net/application/xhtml+xml/starov.htm.ashx

and don't like

http://www.alohci.net/text/html/starov.htm.ashx

Check the view source to see that it is the same file. Check the "Net" tab in firebug (or the equivalent for your browser) to see the type of content in the response headers.

+2
source

In addition, you need to comment on CDATA so that it does not throw a parsing error on startup:

 <script> //<![CDATA[ alert('Hey!'); //]]> </script>
+1
source

1) Comment on your CDATA

  //<![CDATA[ alert('Hey!'); //]]>

2) add script type

 <script type="text/javascript">
0
source

Source: https://habr.com/ru/post/1400085/

More articles:


All Articles