升级jQuery 1.9至3.3.1后$.parseHTML报t.createDocumentFragment is not a function错误

Hey there, let's sort out this issue you're facing with $.parseHTML() post-upgrade. The key culprit here is a subtle but critical behavior change in how jQuery handles the second parameter of this function between 1.9 and 3.x versions.

What Changed? #

In jQuery 1.9, passing a jQuery object (like $('.modal-edit-content')) as the second "context" parameter to $.parseHTML() would work—jQuery quietly converted it to the underlying DOM element behind the scenes. But in jQuery 3.x, this parameter strictly expects a DOM node, not a jQuery collection. Passing a jQuery object here throws an error because the function can't resolve it to a valid DOM context.

Quick Fixes for Your Code #

Let's adjust your line of code to comply with jQuery 3.x's requirements. Here are two solid options:

Option 1: Convert the jQuery Object to a DOM Element

Grab the first DOM element from your jQuery collection using [0] or .get(0):

success: function(editView){
  // Convert jQuery object to DOM element with [0]
  var html = $.parseHTML(editView, $('.modal-edit-content')[0], true);
  // Load parsed content into the modal
  $('.modal-edit-content').append(html);
  // Show your modal...
}

Option 2: Omit the Context Parameter (If You Don't Need It)

If you're not relying on the context to resolve relative URLs or specific DOM parsing behavior, you can skip the second parameter entirely (or pass null):

success: function(editView){
  // Parse directly without a context
  var html = $.parseHTML(editView, null, true);
  $('.modal-edit-content').append(html);
  // Show your modal...
}

Extra Check #

Make sure that .modal-edit-content exists in the DOM when this AJAX success callback runs. If the modal container is dynamically loaded, you might need to confirm it's present before trying to use it as a context (or just use Option 2 to avoid the issue altogether).

内容的提问来源于stack exchange，提问作者codine