Question

未经使用的typeerror：无需使用removechild即可读取无效的属性。

2018-11-24

12332

javascript jquery

我不使用 removeChild() ，在有内容之前也不尝试删除内容。

jquery-3.3.1.min.js:2 Uncaught TypeError: Cannot read property 'removeChild' of null
    at m (jquery-3.3.1.min.js:2)
    at Function.globalEval (jquery-3.3.1.min.js:2)
    at text script (jquery-3.3.1.min.js:2)
    at Ut (jquery-3.3.1.min.js:2)
    at k (jquery-3.3.1.min.js:2)
    at XMLHttpRequest.<anonymous> (jquery-3.3.1.min.js:2)
    at Object.send (jquery-3.3.1.min.js:2)
    at Function.ajax (jquery-3.3.1.min.js:2)
    at Function.w._evalUrl (jquery-3.3.1.min.js:2)
    at Re (jquery-3.3.1.min.js:2)

我使用 $.ajax 接收 html，然后使用 .html() 将其放入 div 容器中。

$(".kontakt").click(function(a) {
      $('.opt-out').fadeOut();
      a.stopPropagation()
      a.preventDefault()

      $.ajax({async: true,
      type: "POST",
       url: "classes/handle.ajax.class.php",
       data: {
            class: "kontakt"
       },
       success: function(a) {
         $(".link-container").html(a)
         $('.link-container').fadeIn();
         blur();
       }
     })
})

Answer 1

查看源代码，我发现了 ajax 的设置方式：

jQuery.ajaxSetup( {
    accepts: {
        script: "text/javascript, application/javascript, " +
            "application/ecmascript, application/x-ecmascript"
    },
    contents: {
        script: /\b(?:java|ecma)script\b/
    },
    converters: {
        "text script": function( text ) {
            jQuery.globalEval( text ); /* note to this method */
            return text;
        }
    }
} );

那么，让我们看看 globalEval 方法：

globalEval: function( code ) {
  DOMEval( code );
},

现在深入研究 DOMEval 方法：

function DOMEval( code, doc, node ) {
  doc = doc || document;

  var i,
    script = doc.createElement( "script" );

  script.text = code;
  if ( node ) {
    for ( i in preservedScriptAttributes ) {
      if ( node[ i ] ) {
        script[ i ] = node[ i ];
      }
    }
  }
  /* removeChild is being called */
  doc.head.appendChild( script ).parentNode.removeChild( script );
}

其中，您可能知道 parentNode 为 null，并且在 null 上调用 removeChild 会引发错误。在这里，在前面的代码中，您可以看到 script 已分配 text 属性，其值设置为 code 。 code 是 DOMEval 方法的参数。这实际上是 text 参数，您可以在 ajaxSetup 中找到它。

ajaxSetup 在 ajax 方法上被调用（您可以查看源代码）。它具有 url 和 options 参数。在 options 参数中，您可以找到使用的 dataType 属性。如果未设置 dataType，它将猜测其类型，服务器可能会返回 null 或 { 的响应。

因此，我建议您在使用 jQuery.ajax 时设置正确的 dataType 。这应该可以解决您的问题。

更新：

好吧，如果服务器返回的响应格式不正确，那么也可能会抛出错误。因此，请验证服务器是否返回了良好的响应。根据您的评论，我调试了代码并发现响应返回得不是很好。

您的响应中也有以下 html，这导致了问题：

<head>
<meta name='robots' content='noindex'>
</head>

请从响应源中删除它们，然后这应该可以解决问题。