Wikipedia:Reference desk/Archives/Computing/2019 August 29

From Wikipedia, the free encyclopedia
Computing desk
< August 28 << Jul | August | Sep >> August 30 >
Welcome to the Wikipedia Computing Reference Desk Archives
The page you are currently viewing is an archive page. While you can leave answers for any questions shown below, please ask new questions on one of the current reference desk pages.


August 29[edit]

Question about AJAX and JavaScript code[edit]

I'm fairly sure I can use AJAX and jQuery to replace the contents of a web page without actually doing a full page load with something like this:

$.post("https://some.site.com/some/url/", { param: "value" }).done(function (content) {
  $(document).html(content);
});

But I'm fairly sure that if the HTML source code returned from https://some.site.com/some/url/ includes JavaScript source code, it will just sit quietly in the page, it won't actually get executed. If so, how can I get it executed? JIP | Talk 22:21, 29 August 2019 (UTC)[reply]

There is no benefit to what you are doing there. You are completely reloading the entire page. Why not just link to the new page? What you are trying to do is used for loading content into a part of a page. For example, if I have a car listing site and you click on a manufacturer, I can load the car listings for that manufacturer into a div containing car listings without reloading the entire web page. Because I don't reload all the other stuff on the page (and the stuff in the background like scripts and stylesheets), there is a savings. 135.84.167.41 (talk) 14:53, 30 August 2019 (UTC)[reply]
That might be true, but there is still a question I want to ask: Regardless of whether I use $.post() and html() to load the entire page or a part of it, if the part I download and write into the document contains JavaScript, will it get executed? JIP | Talk 14:59, 30 August 2019 (UTC)[reply]
Then, you have to do it in DOM scripting. You can't just cram the HTML in. First, you have to create a new script object to add to the DOM: var new_script = document.createElement("script");. Then, you can assign the source code for the script. Here, you will want to try to cram a string into it, but that doesn't work cross platform well at all. Instead, you point the new object to a URL: new_script.src = "some_script_file.js"; Finally, you append the new object to the target object that you want (which could be the document if you like): target.appendChild(new_script); The script is now part of the DOM and can be used. If you want to experiment with cramming text in instead of assigning the source document, look at adding a textnode to the script like: new_script.appendChild(document.createTextNode("alert('Hello');"); Sometimes it works. Sometimes it doesn't. 135.84.167.41 (talk) 16:16, 30 August 2019 (UTC)[reply]
I know that if I just cram JavaScript code inside the document it will be treated as just text. But I was hoping that if the content returned by the AJAX call above contains a <script> tag then its contents would be executed as JavaScript code. After all, it seems to work for normal HTML tags, they are rendered. But if I have to use the <script src = "some_script_file.js"> way, would it work if the src pointed to, for example, an ASP.NET MVC controller method that generated the JavaScript code on the fly and returned it as a string, instead of having to store a static JavaScript file? For example <script src = "https://www.my_asp_net_site.com/Script/GetDynamicScript">? JIP | Talk 19:10, 30 August 2019 (UTC)[reply]
Yes. The web browser does not know if the text it receives is static or dynamic. It treats it all the same. Your issue is that the script part of the DOM is separate from the tree of HTML elements. So, it is rendered differently. Technically, CSS is the same. If you dynamically added some text with a style tag in it, the tag wouldn't be rendered properly. 97.82.165.112 (talk) 18:20, 31 August 2019 (UTC)[reply]