I don't know if this is possible or allowed, but basically I want to go to http://www.nfl.com/scores and get the scores for a particular week. It seems like each game has a certain class and I could the scores and team easily if I can access their html. I think I need to use AJAX or JSON or some combination. Thanks!
UPDATE:
proxy.php
<html>
<head>
</head>
<body>
<?php
$url = "http://www.nfl.com/scores/2012/PRE1http://www.nfl.com/scores/2012/PRE1";
$htm = file_get_contents($url);
echo $htm;
?>
</body>
</html>
nflScores.php
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
<p></p>
<script type="text/javascript">
$.get("proxy.php", function(response) {
alert(response) });
</script>
</body>
</html>
It seems that my alert box is filled with tons of html. Can I use some sort of .getElementByID() method to find certain elements?
Thanks
This is not possible due to XHR's same-origin policy.
Check if NFL has an API you can use to get the scores. Look at this question. Doesn't look like they have an API released, but you may be able to gather the information anyway.
Write your server-side (PHP?) script, download nhl.com site, parse html, send to javascript using json or print it directly on your website.
However, i think nfl.com won't be happy about it.
Either way, the laws around "screen scraping" are pretty grey.
Related
I want to create a simple HTML that on load will go to a URL and then put text in a textbox on the page. Below is the HTML that I came up with so far. It will open the page but will not enter the text that I put in.
Any ideas will be appreciated.
Thank you
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
document.body.innerHTML += 'Link';
document.getElementById("link").click();
</script>
<script>
function displayResult(element)
{
document.getElementById(element).value = "TEST";
}
}
</script>
displayResult("sb_form_q");
</body>
</html>
I tried the above code and I wanted it to put the text "TEST" in the text box on the form.
JavaScript (in a <script> element) runs in the current page. Navigating to a new page will kill the currently running JavaScript program.
If you want to run some JavaScript on the subsequent page then you need to put the JavaScript in that page. You, clearly, don't control Bing, so you can't do that.
It would be a major security problem if you could do that.
The nearest you could come to this would be to write a browser extension that had permission to access bing.com.
If you are specifically looking for Bing searches, you will have to introduce parameters into your href="https://Bing.com/"
example: https://Bing.com/search?q=SEARCHTHIS
I'm really new in Wordpress, Javascript and HTML so I know this question is really basic, but I wasn't able to find it solved anywhere.
I want to create some variables in javascript and then display them in my page which is created in Wordpress.
Reading other posts I've found I need to insert a javascript code that at the end stores my variable this way (dummy version):
<script type="javascript">
document.getElementById('test').innerHTML = 'hello';
</script>
And then on the text block I want to display my variable to be displayed I should add this code:
<body>
<p id="test"></p>
</body>
However I've tried adding the javascript in the header (Tatsu header) and also tried adding it in the text block (HTML version) in different combinations and it never worked. Tried adding the script block before and after the body block, and also tried having it inside, before and after the display line.
If I try the following it works:
<body>
<p>hello</p>
</body>
So I guess my problem is that I'm not setting the variable properly.
Can anyone help? Apologies if this is already solved somewhere, spent some hours and wasn't able to find it.
Thank you in advance.
Your problem is the type of which you're using here:
<script type="javascript">
I noticed this whilst constructing an example of this problem.
javascript is not a correct mime type.
It should be text/javascript as per https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
Please note this is not a complete list. Such as application/javascript also being valid. Please also see https://www.iana.org/assignments/media-types/media-types.xhtml
Working example:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
</head>
<body>
<p id="test">
This shouldn't show up
</p>
<script type="text/javascript">
console.log("####### JAVASCRIPT IS RUNNING ######")
document.getElementById('test').innerHTML = 'hello';
</script>
</body>
</html>
I have an HTML page with a typical structure:
<html>
<head>
<script src="..." ></script>
<style>...</style>
</head>
<body>
content
</body>
<script>
var success_callback = function(data) {
// REPLACE PAGE CONTENT & STRUCTURE WITH "data"
}
ajax(url, params, success_callback);
</script>
</html>
Do you think it is possible ? I've already tried to give the html tag an id and doing $(id).replace(data); with no success.
Don't ask me why, but that is what I need (I'm working with a special "mashup builder" site... it is a long story).
EDIT : I forgot to say that scripts in the received content have to be executed, even external scripts included using <script src="...">.
The simplest way is to set the new HTML content using:
document.open();
document.write(newContent);
document.close();
try this with jQuery:
$('body').load( url,[data],[callback] );
Read more at docs.jquery.com / Ajax / load
Here's how to do it in Prototype: $(id).update(data)
And jQuery: $('#id').replaceWith(data)
But document.getElementById(id).innerHTML=data should work too.
EDIT: Prototype and jQuery automatically evaluate scripts for you.
You could try doing
document.getElementById(id).innerHTML = ajax_response
the simplest way is
$("body").html(data);
Can't you just try to replace the body content with the document.body handler?
if your page is this:
<html>
<body>
blablabla
<script type="text/javascript">
document.body.innerHTML="hi!";
</script>
</body>
</html>
Just use the document.body to replace the body.
This works for me. All the content of the BODY tag is replaced by the innerHTML you specify.
If you need to even change the html tag and all childs you should check out which tags of the 'document.' are capable of doing so.
An example with javascript scripting inside it:
<html>
<body>
blablabla
<script type="text/javascript">
var changeme = "<button onClick=\"document.bgColor = \'#000000\'\">click</button>";
document.body.innerHTML=changeme;
</script>
</body>
This way you can do javascript scripting inside the new content. Don't forget to escape all double and single quotes though, or it won't work. escaping in javascript can be done by traversing your code and putting a backslash in front of all singe and double quotes.
Bare in mind that server side scripting like php doesn't work this way. Since PHP is server-side scripting it has to be processed before a page is loaded. Javascript is a language which works on client-side and thus can not activate the re-processing of php code.
I'm assuming you are using jQuery or something similar. If you are using jQuery, then the following should work:
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
</head>
<body>
content
</body>
<script type="text/javascript">
$("body").load(url);
</script>
</html>
My problem seems pretty easy but I'm kinda new to web programming, so here it is :
I want my button to refresh the page, pass some GET parameters to trigger a PHP action and I don't want the screen to scroll on top of the page.
What I'm using at the moment is a mix of ajax and javascript, it does what I want but it's not reliable. Here's what I remember of the code (I don't have the code at hand)
<?php
echo '
<span href="$.ajax(\''.$_SERVER['PHP_SELF'].'?do=dosomestuff\'); setTimeout(function(){windows.location.reload()},100);)> ... </span>';
?>
I have three issues with this implementation :
I feel it's overkill to use ajax when a href would maybe do the job
A friend of mine tested it and he got the firefox pop up ("To display this page, Firefox must send information that will repeat any action (such as a search or order confirmation) that was performed earlier") everytime he hits the button. I read it comes from POST data passing, but I only use GET data.
On some computers, the button doesn't work everytime. It's random, maybe the delay is not big enough. How big can the delay be so that I'm 100% positive it will work everytime but at the same time it's not noticeable for the user ?
Thank you for your help and advices !
Edit : following Tularis' advice, here's the code I came up with, but I can't manage to make it work
<?php
if (isset($_GET['do']) and $_GET['do'] == 'swap')
{
rename('img1.jpg', 'img3.jpg');
rename('img2.jpg', 'img1.jpg');
rename('img3.jpg', 'img2.jpg');
}
?>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#spanLink").click(function() {
$.ajax('<?php echo $_SERVER['PHP_SELF'];?>?do=swap');
});
});
</script>
</head><body>
<img src="img1.jpg" width="300" height="300" alt="cat">
<img src="img2.jpg" width="300" height="300" alt="dog">
<span style="cursor:hand;" id="spanLink">Some text to click</span>
</body></html>
First of all, don't combine html-links with javascript inside them. That's bad form (and leads to exactly the problem you're having). Instead I suggest using jQuery and linking the onClick event handler to the span element like so:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
$.('#spanLink').click(function() {
$.ajax('<?php echo $_SERVER['PHP_SELF'];?>?do=somestuff');
});
});
</script>
</head><body>
<span id="spanLink">Some text to click</span>
</body></html>
I suggest you to use ajax and jQuery where you can easily get the new content and update it anywhere you want in page without reloading the complete page.
I am trying to change our site to load a Header through jquery using the .load() function but to do so I need to set the Title of the page.
From another StackFlow question it was suggested to do something as simple as
$(document).ready(function() {
document.title ='Name Changed to Protect the Innocent';
});
When i do this I get the firebug error
Missing } in XML Expression for that line in the script
I am sure there is probably an easy solution but it is certainly escaping me.
I've just tested this out here, please see if you have created your html document in the same way. Code as below.
<html>
<head>
<title>Old Title</title>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
document.title ='Name Changed to Protect the Innocent';
});
</script>
</body>
</html>
I found what the problem was. This script was in the middle of another script block which was causing the error.
Thanks for all the help.