I have a test.php file and this file contains some PHP code, HTML elements and some internal JavaScript and some external JavaScript include.
I want to know which is first to load or execute.
PHP or HTML or JavaScript? I want to know execution order.
Your answers are greatly appreciated and very helpful to me and others also.
Pragmatically speaking, this is the typical order:
PHP runs first and constructs the page.
The browser loads the resulting HTML (any JavaScript found gets executed immediately)
Any JavaScript that was tied to the DOM ready or load event gets executed once the whole HTML is read and all objects are loaded respectively.
PHP will execute first, then HTML and finally javascript.
You send request to server, server executes your script
Then returns rendered html to browser, browser parses HTML(inline javascript executed)
Finally executes external included javascript files, one by one in order they are included.
Related
I'm confused about this question. Actually I'm trying to get a JavaScript value to PHP variable using Ajax, but I'm getting error. I think that PHP is parssing first before I could put the value to it via JavaScript
PHP is serverside means it runs on the server, when you get your page php already run through is finished and made his output and then JS starts to work on your computer (clientside). ;)
The PHP is interpreted first on the server and the result is rendered to HTML and JavaScript as appropriate. When the client browser receives this result it will run any embedded scripts, including JavaScript. You also mentioned AJAX, which is a specific usage of JavaScript that makes a connection back to the server from the browser. An AJAX call is sometimes used to bring the value of a server side (possibly PHP) variable into JavaScript after the initial page contents have been sent to the browser.
PHP is parsed on server side, JS is parsed in browser. So, when client asks for a page, at first server runs PHP script to the end, generates HTML and puts it into browser, where JS starts runing.
I have a small script that pulls HTML from another site using Javascript.
I want to include that static HTML that gets pulled in a PHP page without any of the Javascript code appearing in the final PHP page that gets displayed.
I tried doing an include of the file with the Javascript code in the PHP page, but it just included the actual Javascript and not the results of the Javascript.
So how would I go about doing this?
You would need to fetch the page, execute the JavaScript in it, then extract the data you wanted from the generated DOM.
The usual approach to this is to use a web automation tool such as Selenium.
You simply can't.
You need to understand that PHP and Javascript operate on different places, PHP on the server and Javascript on the client.
Your only solution is to change the way all this is done and use "file_get_contents(url)" from PHP to get the same content your javascript used to get. This way, there is no javascript anymore and you can still pre-process your page with distant content.
You wouldn't be able to do this directly from within PHP, since you'd need to run Javascript code.
I'd suggest passing the URL (and any required actions such as click event, etc) to a headless browser such as Phantom or Zombie, and capturing the DOM from it once the JS engine has done it's work.
You could also use a real browser, but of course you don't need a UI in your case, and it might actually get in the way of what you're trying to do, so a headless browser might be better.
This sort of thing would normally be used for automated testing of a site (ie Functional Testing).
There is a PHP tool named Mink which can run these sorts of scripts from within a PHP program. It is aimed at writing test scripts, but I would imagine you could use it for your purposes.
Hope that helps.
I've been learning Ajax and now I'm wondering how it allows a string from Javascript to be passed to php.
It was said before that the problem with passing Javascript to PHP is that the PHP code gets run first, and then the Javascript gets run. So when Javascript generates a string it's already too late.
Does this mean that Ajax allows PHP code to be run after Javascript?
I think this is what they're getting at:
Before Ajax -- specifically, before XMLHttpRequest came along -- a single web page was served as a single page load. If it was a PHP-generated page incorporating Javascript, the browser would request the page, PHP would generate the page (including Javascript code, includes, fragments of script on the page, etc.), would send the page to the browser, and the browser would display it. So, the PHP happened up-front. Until the next page load -- when the entire page was refreshed from scratch -- PHP wasn't involved again.
After the advent of XMLHttpRequest, which helped put the "X" in "AJAX", as it was back then, you had another option. Once the page was loaded, your Javascript could make requests "behind the scenes" of the page, to request more information from the server, without reloading the page. In effect, the loaded page could cause more PHP to be run on the server, and display the results.
So, if you're considering a single page load from a PHP-based website, that is (sort of) what Ajax means; without it, you get a single PHP page-build that's delivered and then your Javascript has to run on that result alone. With Ajax, you can make further requests to your server and throw the results out onto the existing page without a full page load.
The php interpreter sitting on the server is basically interprets whatever php script into (usually) HTML page.
That's why you can never "pass" javascript variable into php as to the interpreter, your javascript is just yet another string, without any special meaning. Your javascript is run by your browser and doesn't even aware that it was being produced by PHP.
I believe that's what it means by "too late".
You should know, that Javascript is always (except Node.js) Client-Side.
PHP is a Server-Side language.
You can't pass Javascript variables to PHP - at least not at the Pageload.
What you can do is doing a AJAX-Request after the Page is laoded to send something to PHP.
With the Response of that call you can replace some other things on the current requested Page.
No it does not mean that "Ajax allows PHP code to be run after Javascript". AJAX is a new request to the server and it allows you to manipulate with the server's response. You can observe this by coping the url to which AJAX request is being made and pasting it into the browser.
So basically when you open a web site with the browser, you send a request and any AJAX call is also a request, but done in a background, so you cannot see it directly. You can use for example firebug or other developer's tool to see what happens behind the scenes. It has nothing to do with the scripts executions orders.
As i understand javascript .js files are best to put all the way at the bottom of html pages, to speed up loading of rest of page. Advised by Yslow(Yahoo) and Page Speed(google).
Now, when in the middle of page some thing RUNS a javascript script, in Internet Explorer, i see a small warning message saying that the element is: Uncaught ReferenceError: SWFObject is not defined
When i put my all.js file in the had, the error goes away but page load slows doen. What to do?
Actually, i remember it was the same with php variables. If i RUN php but the variable comes later, then it just doesnt work. must define the variable first, for it to run.
How to make this workflow better, in case of php scripts? and in case of javsscripts?
Thanks!
You should put your library scripts that are external in the head (things like swfobject, jquery, etc.). But the actual function call you make (for example to bind an event with jquery, or to initialize a swfobject embed) should go at the end.
This made even esier if you keep calling global functions outside of an event handler to a minium and dont use inline javascript or global variables.
What is that "some thing" that runs javascript in the middle of the page?
We do not use <script> tags, and all javascript code we put is js files, which are loaded in strict sequences (so I definitely know that when code is executed, everything it uses is there). (ok, to speed up page loading we append all files into few, like probably you do, "all.js")
If you use script in html attributes (like onchange events etc.) then try to use unobtrussive javascript (attach your events from javascript files).
If that does not help, then divide your javascript into few parts - minimum needed to load the page and execute some stuff before other part is loaded (in <head> of page). Bigger part of scripts you will load before </body>
Difficult to explain this Question, but im currently passing variables in a php page to some html hidden inputs.
Im fetching those values from the hidden inputs with a javascript function. This function gets called like this:
<body onload="function();">
It works on my system now, but is there any chance that the value passed from php might not get through because body has called the function BEFORE the php code sets the input type hidden?
Thanks
You have may have mixed up which part does what.
PHP generates the HTML page on the server side. When the HTML page arrives at the browser, PHP has done its job. There is no way for PHP to do something after it has rendered the HTML.
Javascript is executed in the user's browser after the page has been generated and loaded. (Or during; as theraccoonbear points out, Javasript can run in the browser before the page has loaded completely.)
A Javascript command can not communicate with the PHP script rendering the page, because when Javascript comes into play, PHP is already gone.
So the answer to your question is: No, the JS function can not execute before PHP is done. As several commentators point out, that is not entirely true. A Javascript could come into action before the input HTML elements have been rendered. In your example however, the Javascript triggers only when the document is completely loaded. In that constellation, the answer is no, it can't happen.
That shouldn't be an issue, as you are using the body's onload property, which will ensure the dom and all images etc have loaded.
Using jQuery to it like below would be better in my opinion, fires as soon as the dom is ready, rather than waiting for all images etc.
$(document).ready(function() {
// do stuff here
});
This is also easily done from an external JS file if required, which helps you logically separate your code.