ASP .Net Core. Why doesn`t js work iа use insertBefore()?

Question

I load partial view after dom loaded.

document.addEventListener('DOMContentLoaded', () => {
    fetch('/CartStatePopup/GetPopup', {
        method: 'get'
    })
        .then(response => response.text())
        .then(function (body) {
            var el = document.createElement("div");
            el.innerHTML = body;
            var div = document.querySelector('#anchor50');
            insertAfter(div, el);
    });
});

function insertAfter(referenceNode, newNode) {
    referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}

body has html and vue.js

but if I use jquery

$('#anchor50').after(body);

This is work for me. But I want refuse jquery.

Could anyone please help me?

[That code works](https://jsfiddle.net/tjcrowder/p2b014n9/), assuming there's an `id="anchor50"` element in the document. — T.J. Crowder, Aug 25 '21 at 09:40
That fiddle demonstrates that the code you've shown works when called correctly. I don't know what you mean by "from view". If you mean Vue.js, you shouldn't be using the DOM directly at all, should you? (I don't use Vue.js, just others like it such as React.) If `$("#anchor50").after(body);` works, your code above should also work **assuming** (as I said above) that an element with that ID exists. (If it doesn't, you'll get an error from your code but jQuery will silently do nothing.) Perhaps your code is being called repeatedly, but failing the first time because there's no element. — T.J. Crowder, Aug 25 '21 at 10:14
(If that's the problem, just check whether you have `div` before calling `insertAfter`.) — T.J. Crowder, Aug 25 '21 at 10:15
@T.J.Crowder, I work with asp net core application. It has view. This view is rendering on server and then send to client. This view contains html, js, css. My problem - js in view doesn`t work. And element exists with id anchor50 — ViktorBl, Aug 25 '21 at 10:27
The DOM API methods aren't broken. If your code isn't working, either A) the code adding the element isn't being run or is throwing an error not indicated above, or B) there's no id="anchor50" element (which will also throw an error), or C) There is **more than one** `id="anchor50"` element and your code is successfully adding the new content, just after that other element, not where you expect it. That's pretty much it. So your best bet is to find out which of those it is, using the debugger built into your browser and/or IDE. — T.J. Crowder, Aug 25 '21 at 11:33
@T.J.Crowder I found [some question](https://stackoverflow.com/questions/5626571/javascript-does-not-work-upon-ajax-call) — ViktorBl, Aug 26 '21 at 12:21
If that was the problem, then it was (A) in my list above. Glad you figured it out! — T.J. Crowder, Aug 26 '21 at 12:30

ASP .Net Core. Why doesn`t js work iа use insertBefore()?

0 Answers0