cannot get simple appendChild function working - javascript

I am testing javascript code on W3schools' site and I cannot get the appendChild function working.
Hope its not a dumb error.
here it is:
<script type="text/javascript">
function append()
{
var node = document.getElementById(“history”);
node.appendChild(document.createTextNode("text"));
}
window.onload = append;
</script>
<div id="history"></div>

You don't have proper double quotes (I don't know what the others are called):
document.getElementById(“history”);
// ^ ^
This throws the error:
Uncaught SyntaxError: Unexpected token ILLEGAL
It works with:
document.getElementById("history");
DEMO
OT: w3schools is not a good resource for learning (http://w3fools.com/). Better have a look at the Mozilla documentation: https://developer.mozilla.org/en/javascript

Related

Load iframes 1 by 1

I found this script on an earlier post. I was trying to get this to work but I am not sure why it is not working.
$(function() {
var iframes = $('iframe');
var i = 0;
(function next() {
var iframe = iframes.eq(i++);
if (iframe.length) {
iframe.attr('src', iframe.data('src')).load(next);
}
})();
});
I get the error:
jQuery.Deferred exception: url.indexOf is not a function", "TypeError: url.indexOf is not a function
at jQuery.fn.init.jQuery.fn.load (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js:10091:13)
at next (https://fiddle.jshell.net/_display/?editor_console=true:119:54)
at HTMLDocument.<anonymous> (https://fiddle.jshell.net/_display/?editor_console=true:121:9)
at mightThrow (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js:3557:29)
at process (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js:3625:12)", undefined
Here is the original post and the idea I would like to implement. Any help would be appreciated. I am new to jquery and unable to decipher what the real issue is.
https://jsfiddle.net/1jo83tav/
I guess is this problem that $ is a JQuery variable, add a CDN to your html or something.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Uncaught TypeError: callback.apply is not a function

I've looked accross the web but did not find an answer to this question, where does this error could came from ?
Im working on a really simple code where I just replace some text by an other.
This is the HTML
<div class="imgLittle" style="background-image:url(http://voyagesarabais.com/1874431.jpg4fre);"</div>
<div class="imgLittle" style="background-image:url(http://voyagesarabais.com/159431.jpg4fre);"</div>
This is the jQuery
$(document).each('.imgLittle',function(){
newLink = $(this).css('background-image').replace(/^(.*?\.jpg).*/, "$1");
$(this).css('background-image',newLink)
})
But when I run it it come out with this output :
Uncaught TypeError: callback.apply is not a function
You can have a look there : JsFiddle.
In .each first argument should be function, like this
$('.imgLittle').each(function() {
// your code
})
Example

SyntaxError: Unexpected token ( even when line is empty

I have this HTML:
<template is="auto-binding" id="container-binding-template">
<core-scaffold id="scaffold" onscroll={{containerScrolled}}>
<div id="container">
The auto-binding template and <core-scaffold> are part of Polymer.
This is the JavaScript:
var template = document.querySelector('#container-binding-template');
template.containerScrolled = function() {
// regardless of the code here, the error will occur (event if it's empty)
};
When I run this code I get the following error (in Chrome DevTools):
Uncaught SyntaxError: Unexpected token (                                           VMxxxx:2
When I open the VMxxxx file (e.g. VM1362) I see this code:
(function() {with (this[2]) {with (this[1]) {with (this[0]) {return function(event) {function () {
// This line contains the same code as in containerScrolled(). This is where the error is pointing to.
}
};}}}})
What's causing this error? How can I fix it?
Any help would be appreciated.
Update #1: JSFiddle
The event attribute should be on-scroll. What you have there is the native inline event handlers, which expect the input to be the body of a function.

Cheerio: SyntaxError: Malformed attribute selector: object global?

Here is my code:
var request = require('request'),
cheerio = require('cheerio'),
async = require('async');
function updateCars(){
function getReviews(body){
var $ = cheerio.load(body);
var year = $(this).find(".field-item").text();
}
async.series([
....
function(callback) {
request(site+path, function(err, resp, body){
if(!err && resp.statusCode == 200){
var $ = cheerio.load(body);
$(".views-row").each(getReviews(body));
}
});
}
]);
}
When I run it in the node console, I get the follwing error:
SyntaxError: Malformed attribute selector: object global]
How can I fix that?
The error...
SyntaxError: Malformed attribute selector: object global]
Is actually spot on. Since there's only a snippet of the offending code posted here, it's not entirely clear where this is happening, but it's definitely a clerical error in an attribute selector - and most likely it's this...
Answer:
$('div[id^=foo_bar'); // <-- missing the closing ]
The above example is an error you normally (or whoever coded the site you are scraping) wouldn't notice because jQuery normally quietly handles this mistake...
Proof jQuery Handles It:
var fooBars = $('a[id^="foo_bar"'); //<-- missing closing ]
$('#results').append("See... jQuery don't care about your closing ']' -" + fooBars.length)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="foo_bar_1">1</a>
<a id="foo_bar_2">2</a>
<a id="foo_bar_3">3</a>
<a id="foo_bim_4">4</a>
<a id="foo_bar_5">5</a>
<div id="results"></div>
Explanation:
The error is actually Sizzle yelling at you, from somewhere beneath cheerio. While jQuery is utilizing the pure javascript implementation...
var fooBar = document.querySelectorAll('a[id="foo_bar"'); // <-- missing
alert(fooBar.length); // works!
Cheerio is using Sizzle, which does not like the "malformed" attribute (used to be a problem in IE 7-9 as well)...
Like jQuery, [Cheerios] primary method for selecting elements in the
document, but unlike jQuery it's built on top of the CSSSelect
library, which implements most of the Sizzle selectors.

Passing variable to function in javascript and jQuery

quick question,why this don`t work and how to fix it
$("#Button").click(function(){
count++;
var b=new Button(count);
b.render();
$("#div"+ count).dblclick(function(){
var diva=this;
$(this).append("<span id='colorchange'><input type='color' id='color' onchange='func("+diva+")' name='favcolor'></span>");
});
});
function func(diva){
alert(diva);
}
i`m getting error Uncaught SyntaxError: Unexpected identifier
You can add jquery library "http://code.jquery.com/jquery-1.9.1.js",
and Button is not recognized unless you defined it anywhere...
You can get help from "http://sideroad.secret.jp/plugins/jQueryRender/"

Categories