为什么<! - < script>导致浏览器上的DOM树中断? [英] Why does <!--<script> cause a DOM tree break on the browser?

查看:98
本文介绍了为什么<! - < script>导致浏览器上的DOM树中断?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当我看到解决)


这两个问题都将使浏览器的HTML解析器进入错误解析模式,这意味着他们正在尝试了解无效语法。当试图理解无效语法时,什么浏览器会做的是未定义的行为,这在技术上意味着任何事情都可能发生(例如鼻恶魔)。这里的事实似乎是浏览器同意他们如何处理这个未定义的行为,但这是未定义的行为。



无论什么原因,这两个语法问题的组合彼此相邻,导致浏览器忽略文档中的文本。






编辑:我已经确定了解析错误是如何通过这部分的HTML5规范



脚本的文本内容(不包括空格)是

  var a ='<! - < script>'; 

这必须符合以下语法规则:



< pre class =lang-none prettyprint-override> data1 *(escape [script-start data3] - >data1)[escape]

我们可以通过匹配 data1 来开始解析文本内容,具有以下规则: p>

  data1 =<任何不包含与not-data1>匹配的子字符串的字符串
not-data1 =<! -

也就是说, code> var a ='匹配 data1 production。它结束在那里,因为下一部分是<! -



脚本,它必须匹配 escape production,如下所示:

  escape =<! - data2 *(script-start data3 script-end data2)

我们来匹配文本的下一部分。到目前为止,我们有

  data1 var a ='
escape<! -
data2 ???

现在没有什么可以包含在 data2 中,因为 data2 production禁止子串< script> (即 script-start )!

  data2 =任何不包含与not-data2>匹配的子字符串的字符串
not-data2 = script-start / - >

词法分析器无法根据语法继续执行有效步骤,因此浏览器现在必须进入错误处理。


When I see the answer to solve Level 15 of http://escape.alf.nu, I notice that <!--<script> will cause the DOM parser to break. In the following HTML you won't see the string "Test" (tested on IE 11 & Firefox & Chrome):

<!DOCTYPE HTML>
<html>
    <body>
        <script>
            var a = '<!--<script>';
        </script>
        <p>Test</p>
    </body>
</html>

But these two scripts will show "Test":

<!DOCTYPE HTML>
<html>
    <body>
        <script>
            var a = '<!--';
        </script>
        <p>Test</p>
    </body>
</html>

And,

<!DOCTYPE HTML>
<html>
    <body>
        <script>
            var a = '<script>';
        </script>
        <p>Test</p>
    </body>
</html>

I don't understand, why does this happen?

解决方案

This raises the important point that the text inside of <script> tags on an HTML page is parsed by the HTML parser before it is parsed by the Javascript parser.

This code is not valid HTML5 syntax, so there is nothing in the HTML5 specification that would give us a clue about what is going one here. To be specific, there are two issues:

Both of these problem will put a browser's HTML parser into an error parsing mode, which means they are trying to make sense of invalid syntax. What browsers will do when trying to make sense of invalid syntax is undefined behavior, which technically means that anything can happen (such as nasal demons). The de facto behavior here seems to be that browsers are agreeing on how they handle this undefined behavior, but it is undefined behavior nonetheless.

For whatever reason, this combination of syntax issues next to each other causes browsers to ignore the text later in the document.


EDIT: I have identified how the parsing error is produced by stepping through this part of the HTML5 spec.

The text content of the script (excluding whitespace) is

var a = '<!--<script>';

This must match the following grammar rule:

data1 *( escape [ script-start data3 ] "-->" data1 ) [ escape ]

We can begin parsing the text content by matching data1, which has the following rule:

data1         = < any string that doesn't contain a substring that matches not-data1 >
not-data1     = "<!--"    

That is, the string var a = ' matches the data1 production. It ends there because the next part is <!--.

For there to be any text afterwards in the script, it must match the escape production, which is as follows:

escape        = "<!--" data2 *( script-start data3 script-end data2 )

Let's match the next part of the text. So far we have

data1    var a = '
escape   <!--
  data2  ???

Now nothing can be contained in data2 because the data2 production prohibits the substring <script> (i.e. a script-start)!

data2         = < any string that doesn't contain a substring that matches not-data2 >
not-data2     = script-start / "-->"  

The lexer cannot proceed with with valid steps according to the grammar, so the browser must now go into error processing.

这篇关于为什么&lt;! - &lt; script&gt;导致浏览器上的DOM树中断?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆