Disqus script not well formed - javascript

Blogger keeps telling me that the script is not well formed, I have tried to test it in firebug, but I do not seem to detect the issue. Help out
<script type='text/javascript'>
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script type="text/javascript" src="http://disqus.com/forums/hi-tech/get_num_replies.js' + query + '"></' + 'script>');
})();
</script>

See the HTML compatibility guidelines for XHTML.
Move your JS to an external script file, or wrap it in a CDATA block.

Related

Javascript breaking when adding Google Analytics ga function

I have been trying to get this code to work:
if(searchResults != null){
for(var i=0; i < searchResults.length; i++){
var file = nlapiLoadFile(searchResults[i].getValue('custrecord_download_file'));
var result = searchResults[i].getText('custrecord_download_name');
var analytics = "onclick=\"ga(\'send\',\'event\','" + result + "');\"";
ulText += '<li><a href="'+ file.getURL() + '" target="_blank" ' + analytics + ' >' + searchResults[i].getText('custrecord_download_name') + '</a></li>';
}
}
ulText += '</ul>';
response.write('document.write(\'' + ulText + '\')');
}
But it breaks when it reaches the analytics variable since it has parameters with apostrophes. In the inspector I recieve:
document.write('<ul><li><a href="/core/media/media.nl?id=339181&c=685553&h=20e8a29160195ea985c6&_xt=.pdf" target="_blank" onclick="ga('send','event','Product Datasheet')" >Product Datasheet</a></li></ul>')
How can I still get the ga function working with 'send' like Google Analytics asks for without the script breaking once it reaches the first ga parameter. Thank you in advanced.
Escape your string with backlash like this:
document.write('<ul><li>Product Datasheet</li></ul>')
It should work and these could be a helpful: Escape strings in javascript
Try this:
var analytics = "onclick=\"ga(\'send\',\'event\',\'" + result + "\');\"";
Or you could try in ES6:
const analytics = `onclick=\"ga(\'send\',\'event\',\'${result}\');\"`;

Simple Javascript For Loop in Meteor

I'm assuming I putting this in the wrong area or making some other flaw due to my lack of understand as I'm still learning Meteor.
I have a Meteor application working with data, etc. and all is well on that front. I have a number of logos created for this application that I want to share with some others to get feedback on which they prefer.
All the logo files are named logo1.png, logo2.png, logo3.png, etc. It's the perfect time for a quick and easy for loop (because I know how many files I have) that just concatenates the loop variable onto the word logo and then the .png.
So on my local computer I throw up an HTML file with the following that works exactly how I need it to.
<script type="text/JavaScript">
for (i = 1; i < 7; i++) {
logoName = '';
logoName += "logo" + i + ".png"
document.write ("<img src=" + logoName + " height=200px>");
}
</script>
Then I put into my Meteor main.html file:
<body>
{{> header}}
<script type="text/JavaScript">
for (i = 1; i < 7; i++) {
logoName = '';
logoName += "logo" + i + ".png"
document.write ("<img src=" + logoName + " height=200px>");
}
</script>
<div class="text-center">
{{> invList}}
</div>
</body>
The problem is my Meteor application is catching that "<" in the "i < 7" statement and expects there to be a tag.
So I get the following error:
While building the application: client/main.html:10: Expected tag name
after < ..."> for (i = 1; i < 7; i++) {
...
I'm probably missing something here about where code needs to be placed or something but I've gone through Meteor docs, DiscoverMeteor, and done some Googling in addition to checking this site and I just haven't found how to make Meteor ignore this bit of javascript so it doesn't catch that less than sign and expect anything.
Should I just put this code in /public somehow? If so I'm not sure how I would call it from main.html so it places the images where I want them.
As you already know, you shouldn't write to HTML like that. Instead, put your loop in a helper.
HTML:
<body>
{{> images}}
</body>
<template name="images">
{{#each logos}}
<img src="{{url}}" class="logo"/>
{{/each}}
</template>
JS:
Template.images.logos = function() {
return _.map(_.range(1, 7), function(idx) {
return {url: 'logo' + idx + '.png'};
});
};
CSS:
.logo {
height: 200px;
}
I don't think that it's a good idea to embed a script in the html when you are using Meteor. If you still want to do so, remember to escape some symbols. To correct your script, use following instead:
<script type="text/JavaScript">
for (i = 1; i < 7; i++) {
logoName = '';
logoName += "logo" + i + ".png"
document.write ("<img src=" + logoName + " height=200px>");
}
</script>

New Twitter Tweet Fetcher only showing 1 tweet

I am using the following code to show my latest tweets from the new twitter API. I've got it working perfectly, however, no matter what I do I can only get it to show one tweet, how can I make it show 5 tweets?
here is my code:
<script type="text/javascript">
var twitterFetcher=function(){var d=null;return{fetch:function(a,b){d=b;var c=document.createElement("script");c.type="text/javascript";c.src="http://cdn.syndication.twimg.com/widgets/timelines/"+a+"?&lang=en&callback=twitterFetcher.callback&suppress_response_codes=true&rnd="+Math.random() document.getElementsByTagName("head")[0].appendChild(c)},callback:function(a){var b=document.createElement("div");b.innerHTML=a.body;a=b.getElementsByClassName("e-entry- title");d(a)}}}();
twitterFetcher.fetch('345901443028488192', function(tweets){
// Do what you want with your tweets here! For example:
var x = tweets.length;
var n = 0;
var numtweets = 5;
var element = document.getElementById('tweets');
var html = '<ul id="tweetul">';
if (tweets[n].innerHTML) {
html += '<li><img src="images/myicon.png" class="twittericon"/>' + tweets[n].innerHTML + '</li>';
} else {
html += '<li><img src="images/myicon.png" class="twittericon"/>' + tweets[n].textContent + '</li>';
}
n++;
html += '</ul>';
element.innerHTML = html;
});
</script>
You are not looping. You increment n, but you're never going back to the code above it.
you can get a new version of the api here :
http://jasonmayes.com/projects/twitterApi/#sthash.CAN6FObk.dpbs
then you can write this :
twitterFetcher.fetch('345170787868762112', 'example1', 1, true);
change with "1" in the code above count of tweets you wanted.
I hope you could help.

Get the whole document's html with JavaScript/JQuery

I know it's already discussed here, but there were no solution to get the whole document (including doctype).
$(document).html(); returns null...
This will get you all the HTML:
document.documentElement.outerHTML
Unfortunately it does not return the doctype. But you can use document.doctype to get it and glue the two together.
You can do
new XMLSerializer().serializeToString(document);
for all browsers newer than IE 9
try this.
$("html").html()
document is a variable it dose not represent the html tag.
EDIT
To get the doctype one could use
document.doctype
This is a function which has support in IE6+, it does't use outerHTML for even more support, it adds the doctype and uses a few tricks to get the html tag and its attributes. In order to receive a string with the doctype, and doesn't use outerHTML so it supports every browser. It uses a few tricks to get the html tag. Add this code:
document.fullHTML = function () {
var r = document.documentElement.innerHTML, t = document.documentElement.attributes, i = 0, l = '',
d = '<!DOCTYPE ' + document.doctype.name + (document.doctype.publicId ? ' PUBLIC "' + document.doctype.publicId + '"' : '') + (!document.doctype.publicId && document.doctype.systemId ? ' SYSTEM' : '') + (document.doctype.systemId ? ' "' + document.doctype.systemId + '"' : '') + '>';
for (; i < t.length; i += 1) l += ' ' + t[i].name + '="' + t[i].value + '"';
return d+'\n<html' + l + '>' + r + '</html>';
}
Now, you can run this function:
console.log(document.fullHTML());
This will return the HTML and doctype.
I ran this on example.com, here are the results
document.documentElement.innerHTML
will return you all document markup as string
to get the whole doctype read this
I'm not sure about getting the complete doc.but what you can do is,you can get the content of html tag seprately and doctype seprately.
$('html').html() for content and document.doctype for getting the doctype
I don't think there is a direct access to the whole document (including the doctype), but this works :
$.get(document.location, function(html) {
// use html (which is the complete source code, including the doctype)
});
I have done it on browser's console
document.documentElement;

Javascript code example copied into a pre-tag gets executed

I'm trying to add a piece of javascript code to a certain <div>.
I enclosed the code in pre and code tags, but when I actually run this the code gets executed. Obviously, that's not what I want at all.
var code = '<pre><code><script type="text/javascript" src="http://source.com/test.js"><\/script>\n';
code = code + '<script type="text/javascript">\n';
code = code + '\tadimp.id = ' + 1 + ';\n';
code = code + '\tadimp.type = ' + 1 + ';\n';
code = code + '\tadimp.generate();\n';
code = code + '<\/script></code></pre>';
$("#code").html(code);
You should use < and > for < and > in this case. Try this
var code = '<pre><code><script type="text/javascript" src="http://source.com/test.js"><\/script>\n';
code = code + '<script type="text/javascript">\n';
code = code + '\tadimp.id = ' + 1 + ';\n';
code = code + '\tadimp.type = ' + 1 + ';\n';
code = code + '\tadimp.generate();\n';
code = code + '<\/script></code></pre>';
$("#code").html(code);
Surprise! You just manufactured your own XSS vulnerability. Always HTML-encode any data you put into HTML. ("data" is anything you want to appear on screen.)
In the HTML DOM this is thankfully completely automatic. Just use the text property, not the HTML property.
var code = [
'<script type="text/javascript" src="http://source.com/test.js"><\/script>',
'<script type="text/javascript">',
'\tadimp.id = ' + 1 + ';',
'\tadimp.type = ' + 1 + ';',
'\tadimp.generate();',
'<\/script>'
].join('\n');
$('#code').text(code);
// --------^^^^
Live demo: http://jsfiddle.net/6qdBD/3/
Pre tags format the text not necessarily keep what the text within them from being executed as html. Or in this case JavaScript. A better method would be to replace < and > with the html entities < and >.
Instead of using the < and > symbols use &lt and &gt
var code = '&ltscript type="text/javascript" src="http://source.com/test.js"&gt&lt/script&gt\n'
I suggest to just simply replace the < in <script tag to '&lt and at the end to '&gt.
Since HTML tags are permitted inside PRE, you cannot just "insert" a text file into an HTML document by slapping <PRE> and </PRE> around them. You have to convert the &, < and > characters into entities first.
From http://htmlhelp.com/reference/wilbur/block/pre.html

Categories