So I embedded a chatango tab on my website, but I get this error when validating it for HTML.
The text content of element script was not in the required format: Expected space, tab, newline, or slash but found { instead.
Any workarounds for this? Thank you!
<script id="cid0020000101807397328" data-cfasync="false" async src="//st.chatango.com/js/gz/emb.js" style="width: 603px;height: 471px;">
{"handle":"********","arch":"js","styles":{"a":"000000","b":100,"c":"a0a0a0","d":"FFFFFF","e":"202020","g":"bbbbbb","h":"202020","j":"c0c0c0","k":"0084ef","l":"606060","m":"0084ef","n":"FFFFFF","p":"10","q":"000000","r":100,"pos":"br","cv":1,"cvfntsz":"14px","cvbg":"3366ff","cvw":600,"cvh":30,"surl":0,"allowpm":0,"cnrs":"0.35","ticker":1,"fwtickm":1}}</script>
As Ben said - you cannot use code inside tag with src.
But here is some valid and working solution:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>chatango</title>
</head>
<body>
<script type="text/javascript">
var chatango = document.createElement('script');
chatango.setAttribute('type','text/javascript');
chatango.setAttribute('id','cid0020000101807397328');
chatango.setAttribute('data-cfasync','false');
chatango.setAttribute('async',true);
chatango.setAttribute('src','//st.chatango.com/js/gz/emb.js');
chatango.setAttribute('style','width: 603px;height: 471px;');
chatango.innerHTML = '{"handle":"1shotgg","arch":"js","styles":{"a":"000000","b":100,"c":"a0a0a0","d":"FFFFFF","e":"202020","g":"bbbbbb","h":"202020","j":"c0c0c0","k":"0084ef","l":"606060","m":"0084ef","n":"FFFFFF","p":"10","q":"000000","r":100,"pos":"br","cv":1,"cvfntsz":"14px","cvbg":"3366ff","cvw":600,"cvh":30,"surl":0,"allowpm":0,"cnrs":"0.35","ticker":1,"fwtickm":1}}';
document.body.appendChild(chatango);
</script>
</body>
</html>
Related
I have my script file "js.js" referenced in my body after h1 and after p. The external javascript is to replace the text but it is not working. The code I have in html is:
<h1 id="header">Example Header</h1>
<script src="js.js></script>
var NewHeader = "New Header Text";
document.getElementByID("header").innerHTML = NewHeader;
Any ideas why this is not working?
just use script tag before the closing tag of body </body>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Document</title>
</head>
<body>
<h1 id="header">Example header</h1>
<script src="js.js"></script>
</body>
</html>
or if you want to use script tag in head tag then just
use async attribute of script tag so script will be fetched in parallel to parsing and evaluated as soon as it is available.
Example : <script async src="js.js"></script>
Hi am new in javascript , when am trying to add watermark in our page then getting an error like watermark is not defined please tell me where am wrong , what should i do to solve this error
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WaterMArk</title>
</head>
<body>
<h1 style="text-align: center;">Watermark</h1>
<hr />
<script>
watermark(['img/f.jpg', 'img/grator1.png'])
.image(watermark.image.center(0.5))
.then(function (img) {
document.getElementById('center').appendChild(img);
});
</script>
</body>
</html>
Well it's very clear browser doesn't recognize the keyword watermark
you may need to include watermark js to your head tag
you can find the same here
https://github.com/brianium/watermarkjs/blob/master/dist/watermark.js
I am learning JavaScript. I create a file in same folder and linked it with html. The problem is when I write alert("Hello World") so it shows message in browser but when I am trying
document.getElementById("p1").innerHtml = "Hello world"
it does not change the content of my HTML element.
The HTML DOM property is innerHTML, not innerHtml:
document.getElementById("p1").innerHTML = "Hello world";
<div id="p1"></div>
Now the JavaScript code is executed before your browser loaded the DOM, so it won't work.
Move the <script src="main.js"></script> just above </body> in your HTML file. This way the DOM gets loaded before the JavaScript code.
Like this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<H1 id="p1">hi</H1>
<script src="main.js"></script>
</body>
</html>
Assume i have iframe contain sample.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="import" href="sample.html">
</head>
<body>
<p>top</p>
<iframe src="sample.html" frameborder="0" id="myframe"></iframe>
<p>bottom</p>
<textarea cols="30" rows="10"></textarea>
</body>
</html>
I want to get all content include <!DOCTYPE html> ...</html>. I try to search arround the web but what i found only get content from body using
var cont = document.getElementById('myframe').contentWindow.document;
console.log(cont.body);
I don't want to use AJAX to get content file.
How to get ALL content from iframe include html tag?
Try accessing cont.documentElement.innerHTML to get the contents of <html> tag.
If you want also the <html> tag, use cont.documentElement.outerHTML.
To get the doctype information, try using cont.doctype.
var cont = document.getElementById('myframe').contentWindow.document;
console.log(cont.documentElement.outerHTML, cont.doctype);
You could also use XMLSerializer if its supported in the browser:
console.log(new XMLSerializer().serializeToString(cont));
try this:
Using document.doctype to get the document doctype
Using document.getElementsByTagName("*"); to get most of the html
https://jsfiddle.net/4hhf6nLm/
following line will retrieve inner html of iframe
document.getElementById('myframe').contentWindow.document.body.innerHTML
Check this answer for more information
I'm trying to start a webpage with knockou.js
I'm trying to follow the instruction on the web and create very simple page, but for some reason i don't get the binding... maybe i miss a definiation or something like that? can anybody help with that?
That my page:
<html class="rtl">
<head>
<title>changeup - קבל שער</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="format-detection" content="telephone=no">
<script type='text/javascript' src='bower_components/knockout.js/knockout.js'></script>
</head>
<body cz-shortcut-listen="true">
Today's message is: <span data-bind="text: myMessage"></span>
<script type="text/javascript">
var viewModel = {
myMessage: ko.observable() // Initially blank
};
viewModel.myMessage("Hello, world!"); // Text appears
</script>
</body>
</html>
but the only think i get on my browser is: "Today's message is:"
Read through the documentation under the subject Activating Knockout, you have to apply the bindings as well, add:
ko.applyBindings(viewModel);
after viewModel.myMessage("Hello, world!");