I have a minimal PHP script that utilises an open-source PHP Simple HTML DOM Parser. An external script, when called, reads in a webpage and returns it's content to index.php which displays it. The basic example I present below works, but I want to integrate the PHP call into javascript to make it interactive.
index.php
<html>
<head>
<title>php / javascript interaction</title>
</head>
<body>
<?php include 'simple_html_dom_utility.php';?>
<?php include 'webpage_parser.php';?>
<script type="text/javascript">
// this Javascript isn't fully implemented but illustrates the intent..
links = ["http://en.m.wikipedia.org/wiki/Moon", "http://en.m.wikipedia.org/wiki/Star",
"http://en.m.wikipedia.org/wiki/Planet", "http://en.m.wikipedia.org/wiki/Sun"];
k = 0;
window.setInterval(function(){ // rotate through webpages
var newurl = links[ k ];
console.log(newurl);
// call PHP here with 'newurl' argument to append new website's content to the DOM
k = (k+1) % links.length;
}, 5000);
</script>
</body>
</html>
webpage_parser.php
<?php
// this needs to change to accept input arguments for $url
$url = "http://en.m.wikipedia.org/wiki/Sun";
$html = file_get_html($url);
echo $html;
?>
simple_html_dom_utility.php is available here
I can foresee a jQuery solution may be needed to convert php-to-javascript content into DOM elements. For now I'm really just interested in getting php and javascript talking to each other.
-
1You need to learn about AJAX.SLaks– SLaks2014年12月30日 19:04:30 +00:00Commented Dec 30, 2014 at 19:04
-
Hi. I've used AJAX for a different application but am not very familiar with it. Do you know of any simple examples relevant to this?geotheory– geotheory2014年12月30日 19:08:26 +00:00Commented Dec 30, 2014 at 19:08
-
developer.mozilla.org/en-US/docs/AJAX/Getting_StartedSLaks– SLaks2014年12月30日 19:10:52 +00:00Commented Dec 30, 2014 at 19:10
-
1And yes, using jQuery will be a much easier way to implement an AJAX solution that is cross-browser compatible. Here is the relevant feature: api.jquery.com/jquery.getNostalg.io– Nostalg.io2014年12月30日 19:19:20 +00:00Commented Dec 30, 2014 at 19:19
1 Answer 1
You can post the url in an AJAX request to the PHP file with jQuery. The content of the PHP file will then be sent back to the script and passed into the AJAX handlers callback as an argument, named here data. jQuery can also be used to write the data onto the page with $('element').html(data);
webpage_parser.php
<?php
require 'simple_html_dom_utility.php';
if(!$_POST['url']) {
$url = "http://en.m.wikipedia.org/wiki/Sun";
}
else {
$url = $_POST['url'];
}
$html = file_get_html($url);
?>
<div>
<?php echo $html; ?>
</div>
This page which displays the content doesn't really need to be PHP. index.html
<html>
<head>
<title> Ajax example </title>
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<script>
links = ["http://en.m.wikipedia.org/wiki/Moon", "http://en.m.wikipedia.org/wiki/Star",
"http://en.m.wikipedia.org/wiki/Planet", "http://en.m.wikipedia.org/wiki/Sun"];
var k = 0;
setInterval(function(){
$.post("webpage_parser.php", { url: links[k] }, function(data,status){
if(!data) {
console.log(status)
}
else {
$('#content').html(data);
}
});
if(k < links.length) {
k++;
}
else {
k = 0;
}
}, 5000);
</script>
</head>
<body>
<div id="content">
</div>
</body>
</html>