用jquery的id選擇器的text()方法，取不到想要的字符串，怎么搞...

用jquery的id選擇器的text()方法，取不到想要的字符串；
試了一下用原生js也是一樣的；

代碼如下；

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body id="body" style="display: none">
%0A%3C%21--%u6B64%u7F51%u9875%u5DF2%u52A0%u5BC6%uFF0C%u6B32%u89E3%u5BC6%u8BF7%u5230code.qcgzxw.cn/html.html%u89E3%u5BC6--%3E%0A%3Cform%3E%0A%20%20%20%20%3Ctr%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Edd%3C/td%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Eff%3C/td%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Ecc%3C/td%3E%0A%20%20%20%20%3C/tr%3E%0A%3C/form%3E%0A%3C%21--%u6B64%u7F51%u9875%u5DF2%u52A0%u5BC6%uFF0C%u6B32%u89E3%u5BC6%u8BF7%u5230code.qcgzxw.cn/html.html%u89E3%u5BC6--%3E%0A
</body>
</html>
<script src="https://cdn.staticfile.org/jquery/3.3.1/jquery.min.js"></script>
<script>
    /**
     *
     * @constructor
     */
    function OutWord()
    {
        var Words = $("#body").text();
        var NewWords;
        console.log(Words);
        NewWords = unescape(Words);
        console.log(NewWords);
        $("#body").html(NewWords).css("display", "block");
    }
    OutWord();
</script>

為什么$("#body").text()會取到script標簽里的東西？

/**
     *
     * @constructor
     */
    function OutWord()
    {
        var Words = $("#body").text();
        var NewWords;
        alert(Words);
        console.log(Words);
        NewWords = unescape(Words);
        console.log(NewWords);
        $("#body").html(NewWords).css("display", "block");
    }
    OutWord();

這個是什么原理，之前沒遇到過這種情況；

求助；

回答

編輯回答

魚梓

w3c 說明 https://www.w3.org/TR/html5/s...
HTML 元素之后的空間字符將被解析為它們位于正文元素的末尾。
也就是說你寫在 html 和 body 結(jié)束標簽之外的內(nèi)容會自動插入 body 標簽內(nèi)容末尾。
script 是內(nèi)聯(lián)標簽，用過 js 模板會很好理解， script 里面也是文本，所以就獲取到了。

2017年7月24日 22:43

編輯回答

亮瞎她

在編輯的時候你的代碼雖然寫在body或者html的外面的，但是在瀏覽器渲染的時候會同樣被渲染進body中，加上 text()是設置或返回被選元素的文本內(nèi)容。你可以在控制臺中Elements中看到渲染后的結(jié)果。

2017年3月6日 03:46

編輯回答

幼梔

基于規(guī)則 %html.content "HEAD|BODY" HTML 標簽的子元素只能是 HEAD BODY。但是瀏覽器對HTML(XHTML)均有容錯機制。錯誤嵌套的標簽、以及位置放置錯誤的標簽都會在paser HTML 過程中嘗試修復。修復后得到合法的HTML后在由布局引擎建立相應的DOM對象。在<script>標簽放置于</body>標簽之后時，源碼被所有瀏覽器【泛指PC上常見的】修復為正常形式，即<script></script></body>。由此，Google 這種利用基于瀏覽器修復【或規(guī)范中可以不閉合標簽條款的】機制，處理是可以的。它的意圖是盡可能少輸出內(nèi)容，由客戶端瀏覽器來輔助它處理HTML，最終目的是為了提速與盡可能加大服務端吞吐量。

作者：貘吃饃香
鏈接：https://www.zhihu.com/questio...
來源：知乎
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。

2017年10月15日 04:59

編輯回答

憶當年

獲取的時候篩選出文本節(jié)點的就可以了。

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body id="body" style="display: none"> 
%0A%3C%21--%u6B64%u7F51%u9875%u5DF2%u52A0%u5BC6%uFF0C%u6B32%u89E3%u5BC6%u8BF7%u5230code.qcgzxw.cn/html.html%u89E3%u5BC6--%3E%0A%3Cform%3E%0A%20%20%20%20%3Ctr%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Edd%3C/td%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Eff%3C/td%3E%0A%20%20%20%20%20%20%20%20%3Ctd%3Ecc%3C/td%3E%0A%20%20%20%20%3C/tr%3E%0A%3C/form%3E%0A%3C%21--%u6B64%u7F51%u9875%u5DF2%u52A0%u5BC6%uFF0C%u6B32%u89E3%u5BC6%u8BF7%u5230code.qcgzxw.cn/html.html%u89E3%u5BC6--%3E%0A
</body>
</html>
<script src="https://cdn.staticfile.org/jquery/3.3.1/jquery.min.js"></script>
<script>  
       var text = "";
       $("#body").contents().filter(function(){ 
                                      return this.nodeType == 3; 
              }).each(function(){
               text = text + $(this).text();
         });
     console.log(text);
</script>

2018年5月18日 11:49