I'm trying to get the Google Feed API to work by simply copy-pasting the example code from Google's tutorial here: https://developers.google.com/feed/v1/devguide
(!) It works fine in every browser except Chrome.
I created an HTML file with this code (from Google's "Hello World" tutorial):
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("http://fastpshb.appspot.com/feed/1/fastpshb");
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("div");
div.appendChild(document.createTextNode(entry.title));
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div id="feed"></div>
</body>
</html>
But when I load the HTML file, I get this error in the Chrome console:
Uncaught ReferenceError: google is not defined
What am I missing here?
I have found the problem. https://disconnect.me/ was running on Chrome and stopped the script from working.
Related
I have a script but used in same page. like two times. i got error while working when i working on desktop it's work but when i check on below 1000px then it's get error like:- Duplicate Embedded Players Detected.
I think it's worked when i open desktop then show desktop script and when i open mobile then desktop not show mobile script show. please help me how to do that. :-
this is the script i used:-
<script type="text/javascript" id="vidyard_embed_code_kjashdwejkhsdsheh class="mobile" src="//play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox"></script>
I used for this but it's show syntax error:-
<script>
if (jQuery(window).width() < 1000) {
<script type="text/javascript" id="vidyard_embed_code_kjashdwejkhsdsheh class="mobile" src="//play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox"></script>
}
</script>
Please tell me how to fix that issue. Thanks alot
if (jQuery(window).width() < 1000) {
<script type="text/javascript" ...snip...></script>
}
This code is Javascript, so you need to construct a script element in Javascript and append it to the document manually.
var headElem = document.getElementsByTagName('head')[0];
var scriptElem = document.createElement("script");
scriptElem.type = "text/javascript";
if (jQuery(window).width() < 1000) {
scriptElem.src = "play.vidyard.com/dskakdehjkwhewhdhshd.js?v=3.1.1&type=lightbox";
scriptElem.class = "mobile";
}
else {
scriptElem.src = "desktop.vidyard.com/.......js";
scriptElem.class = "desktop";
}
headElem.appendChild(scriptElem);
I wonder how to use console.profile() in Firefox. I have read the following material http://getfirebug.com/wiki/index.php/Console.profile, I copied the code and run in my Firefox, but I did not see the result, why?
function getById(id)
{
return document.getElementById(id);
}
function getViaSelector(id)
{
return document.querySelector(id);
}
var numberOfCalls = 10000;
console.profile("getElementById() vs. querySelector()");
for (var i=0; i<numberOfCalls; ++i)
getById("test");
for (var i=0; i<numberOfCalls; ++i)
getViaSelector("test");
console.profileEnd();
The console does not have the data, the data is stored under the Performance Tab.
Works for me if the page contains an element with id "test". The result is displayed on the run-time analysis tab of the builtin web console as expected.
Note, If you use Firebug the code-snippet needs to be loaded from a web server, as profiling of local files (injected code) is not supported by Firebug. Also make sure to enable script debugging which is disabled by default.
Here is a working example which you can either load from file or from a local web server (in both cases profiling works for me).
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Profiling Demo</title>
<script type="text/javascript">
function getById(id)
{
return document.getElementById(id);
}
function getViaSelector(id)
{
return document.querySelector(id);
}
var numberOfCalls = 10000;
window.onload = function() {
console.profile("getElementById() vs. querySelector()");
for (var i=0; i<numberOfCalls; ++i) {
getById("test");
}
for (var i=0; i<numberOfCalls; ++i) {
getViaSelector("test");
}
console.profileEnd();
}
</script>
</head>
<body id="test">
</body>
</html>
The results appear in the Firebug Console. Unfortunately, I am not able to add a screenshot as my reputation is too low.
I am struggling with the following problem.
I have made a memorygame with javascrpt for school.It all works fine, but my teacher told me that i can not have on line of javascript in my HTML, like this :
HTML :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Memory spelen</title>
</head>
<body>
<script type="text/javascript" src="javascript.js"></script>
<div id="memory_board"></div>
<script>newBoard();</script>
</body>
</html>
The newBoard() is applied to the memory_board div. How can i take this little piece of script out of my HTML file and place it in my js file, to still function properly.
Thanks in advance
Inside of your javascript.js put this
window.onload = function {
// content of your script
var newBoard = function(){
// the new updated newBoard() function from below
}
// other parts of your script
if(window.location.href == 'your-url') {
// now, after the newBoard() has been updated
// the next to lines are not needed
// var board = document.getElementById('memory_board');
// board.innerHTML = newBoard();
// just call the function
newBoard();
}
};
UPDATE
I just took a look at your old fiddle and I changed your newBoard function to this
function newBoard(){
tiles_flipped = 0;
var output = '';
memory_array.memory_tile_shuffle();
for(var i = 0; i < memory_array.length; i++){
var div = document.createElement('DIV');
div.id = "tile_" + i;
(function(div,i){
div.onclick = function() {
memoryFlipTile(this, memory_array[i]);
};
}(div,i));
document.getElementById('memory_board').appendChild(div);
}
}
Check the working fiddle.
try to put it like this in external js file
$(document).ready(function(){
newBoard();
});
It looks that you need to call newBoard() method on onload event of memory_board div , You can do this in following ways:
<div id="memory_board" onload="javascript:newBoard()" ></div> // use onload event of memory_board
you can use onload function on the javascript. It will call the function when all the HTML tag is loaded on the screen.
I'm having some trouble trying to get a fairly simple popupper to work. The idea is that the parent should open a popup window and then append a div in it.
The relevant parts of the code:
parent.html:
var childWindow;
function togglePref() {
childWindow = window.open("popup.html", "prefPopup", "width=200,height=320");
}
function loadPopupElements() {
var prefElements = document.getElementById("prefBrd").cloneNode(true);
var childDoc = childWindow.document;
var childLink = document.createElement("link");
childLink.setAttribute("href", "pop.css");
childLink.setAttribute("rel", "stylesheet");
childLink.setAttribute("type", "text/css");
childDoc.head.appendChild(childLink);
childDoc.body.appendChild(prefElements);
}
popup.html:
<head>
</head>
<body onload="opener.loadPopupElements();">
</body>
This works fine with Safari and Chrome, but for some reason IE refuses to append anything.
Ok, I managed to work around the problem with a uglyish solution using innerHTML. Apparently, as Hemlock mentioned, IE doesn't support appending children from a another document. Some suggested to take a look at the importNode() method but I seemed to have no luck with it either.
So, the workaround goes as follows:
parent.html:
var childWindow;
function togglePref() {
childWindow = window.open("popup.html", "prefPopup", "width=200,height=320");
}
function loadPopupElements() {
var prefElements = document.getElementById("prefBrd");
var childDoc = childWindow.document;
childDoc.body.innerHTML = prefElements.innerHTML;
}
popup.html:
<head>
<link href="pop.css" rel="stylesheet" type="text/css">
</head>
<body onload="loadElements();">
</body>
<script type="text/javascript">
function loadElements() {
opener.loadPopupElements();
}
</script>
This seems quite a nasty way to go because in my case the #prefBrd contains some input elements with dynamically set values, so in order for the popup.html to grab them, it has to do a bit of iteration at the end of the loadElements() function, which wouldn't have been necessary using appendChild.
Hi People and thanks for reading.
I am building a small (one-page) site for my friends band, and am using a tumblr feed instead of news section. The only thing is, I'm a total novice at JS / JQuery.
I've managed to get the posts showing fine, but at the moment the feed pulls the post title, some blurb, and the date (in that order). Because I want to display the date before the title, I'm crudely using some CSS to move the date above the title (position: relative).
So far I have this in the header:
<script src="http://www.google.com/jsapi" type="text/javascript"> </script>
And this in the body just before the closing body tag:
<script type="text/javascript">
google.load("feeds", "1");
function OnLoad() {
var feedControl = new google.feeds.FeedControl();
feedControl.setNumEntries(3);
feedControl.addFeed("http://xxxxxxxxxx.tumblr.com/rss");
feedControl.draw(document.getElementById("recentPosts"));
}
google.setOnLoadCallback(OnLoad);
</script>
Does anyone know how I can customise the output so that the date comes before the title?
Thanks,
John
I think you need to hack the html rendered by Google' script; you could try to use jquery in order to make things easier. Just remember to apply your changes after the
google.setOnLoadCallback(OnLoad);
Could be something like this (not tested):
<script language="Javascript">
google.load("feeds", "1");
function loadFeeds()
{
var feedControl = new google.feeds.FeedControl();
feedControl.setNumEntries(3);
var html;
var feed = new google.feeds.Feed("http://www.digg.com/rss/index.xml");
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
html+=entry.date+"<p>"+entry.title+"</p>"+entry.description+"<br>";
document.getElementById("feed").innerHTML =html;
}
}
});
}
google.setOnLoadCallback(loadFeeds);
</script>