Actualmente estoy usando ajax en un archivo javascript para obtener una respuesta que es solo algo de HTML.

Mi script ajax se parece a:

 $.ajax({ type: $form.getAttribute('action'), method: $form.getAttribute('method'), url: '{{ url|raw }}', data: data, success: function (html) { html = new DOMParser().parseFromString(html, "text/html"); document.querySelector('#S3Adapter_storageClass').parentElement.replaceWith(html.querySelector('#S3Adapter_storageClass').parentElement); } });

Básicamente, hace una solicitud ajax a mi controlador que me devolverá el contenido HTML, en el que solo tomaré una parte para reemplazar el contenido actual de mi página.

Esto funciona bien, pero me gustaría omitir jQuery y, por lo tanto, usar fetch() en su lugar.

Excepto que no puedo. Mientras buscaba en Internet, encontré en este sitio una forma de hacerlo:https://gomakethings.com/getting-html-with-fetch-in-vanilla-js/

Así que lo hice :

 fetch('{{ url|raw }}', { method: $form.getAttribute('method'), body: data, }).then(function (response) { // The API call was successful! return response.text(); }).then(function (html) { // This is the HTML from our response as a text string html = new DOMParser().parseFromString(html, "text/html"); document.querySelector('#S3Adapter_storageClass').parentElement.replaceWith(html.querySelector('#S3Adapter_storageClass').parentElement); }).catch(function (err) { // There was an error console.warn('Something went wrong.', err); });

Eventualmente, obtengo algo de contenido HTML, pero siento que no es el que debería ser devuelto por la respuesta como lo hice en Ajax. En cambio, solo obtengo el HTML de mi página actual. ¿Hay algo que hice mal?