If I try the following test case with prettify, if doesn't work correctly.
<!DOCTYPE html>
<head><script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script></head>
<body>
<pre class="prettyprint lang-java">
for(int i = 0; i <things.length; i++)
</pre>
</body></html>
The output reads "for(int i = 0; i " which suggests it failed to handle the less-than correctly.
I have submitted a bug to the project, but I wonder if there is a workaround I can use in the meantime?
It's possible to workaround this by tweaking the input source code, e.g. changing it to "for(int i =0; i < things.length; i++)" (adding a space after the less-than). However, I can't rely on doing this, as my tool runs unattended on client sites. However, I'd be happy to hack at Prettify, or run the source code through some kind of pre-filter.
Recommendations on alternatives to prettify are welcome.
Literal < and > characters in HTML documents should be encoded as entities, so it should be:
<pre class="prettyprint lang-java">
for(int i = 0; i < things.length; i++)
</pre>
Related
I am trying to modify a webpage with a chrome plugin I wrote myself. I'd like to add an additional link before a existing link.
I am using insertAdjacentHTML to add my new link before the original link.
But as soon as I use the a href it fails.
UPDATE
There were syntax errors in my code as many pointed out. I fixed these
This is the new code (but still won't work...webpage I want to alter seems to load forever and nothing happens):
var anchors = document.getElementsByTagName("a");
for (var i = 0; i < anchors.length; i++) {
anchors[i].href = "javascript:void(0)";
anchors[i].insertAdjacentHTML("beforebegin", "<a href='www.google.de'> bold text</a>")
}
Somehow the whole code works, if I don't add "a href". So this works:
anchors[i].insertAdjacentHTML("beforebegin", "<b> bold text</b>")
If I try the tag ..it somehow fails - can you give me a hint why?
Update2
I was finally able to solve this: I accidentally create an infinite loop. #Andy's answer points out a solutions to this.
Aside from the typos the big problem with the code is that getElementsByName returns a live list of anchor nodes. This can be useful in the right circumstances, but with your loop you're adding a new anchor to the list with each iteration so the loop is never able to finish and the browser hangs. To prevent this use querySelectorAll. It returns a static list instead.
var anchors = document.querySelectorAll('a');
for (var i = 0; i < anchors.length; i++) {
const newAnchor = 'bold text';
anchors[i] = 'javascript:void(0)';
anchors[i].insertAdjacentHTML('beforebegin', newAnchor);
}
Google
Bert
Ernie
In the long-run if you're going to be coding with JS and HTML a lot you'll probably find it easier to always use single quotes for JS strings etc, and double quotes for HTML attributes. That way the number of times you'll have to escape quotes will be limited.
You'll also find using a decent code editor like VSCode will help you see the typos in your code before they get to the browser.
You have a typo where you're setting the href:
anchors[i].href = "javascript:void(0)
You've opened a string there and not closed it. Simply add a " on the end.
Using a text editor with some decent syntax highlighting can help avoid these sorts of issues (although JS syntax highlighting is often a bit weird for this specific problem).
You would also have seen an error if you viewed the console in your browser developer tools (for most browsers these are opened by pressing F12).
Check you code, missing " and ;.
var anchors = document.getElementsByTagName("a");
for (var i = 0; i < anchors.length; i++) {
anchors[i].href = "javascript:void(0)";
anchors[i].insertAdjacentHTML("beforebegin", "<a href='www.google.de'> bold text</a>")
}
I have a XML file which i want to convert to string in java script code. It works fine except one thing.The XML file has on line like below,
.....other lines....
< Source Data>< /Source Data>
.....other lines....
It shows other lines perfectly but for < Source Data>< /Source Data> lines it displays only < Source Data/> in console log. < Source Data> is omitted somehow. I am using below code to display ,
var xmlString = (new XMLSerializer()).serializeToString(xmlFile);
console.log(xmlString)
Please explain me why it is happening and how to resolve this issue to display properly. please note, there is no space after less then character "<". i am putting as it was not displaying here properly without that
Thanks in advance
Here I have a loop to iterator over html elements in a JSF application.
var tmp = document.getElementsByTagName("input");
var counter = 0;
var arr = new Array();
for (var i = 0; i<tmp.length; i++) {
if (tmp[i].parentNode.nodeName === "TD" && tmp[i].getAttribute("type") !== "submit") {
arr[counter] = tmp[i];
counter++;
}
}
This loop is inside this script tag:
<script type="text/javascript">
<!--
//-->
</script>
When I load the page in the web browser I get following error(shown in google chrome developer tools)
As you can see in your screenshot, your script in the HTML page has < where it should have <. This is your syntax error. Are you generating this page with some templating language that "escapes" HTML code? That would cause this problem.
One good solution is to put your JavaScript code in a separate .js file. That should avoid the escaping and leave your code unchanged.
If you do need to have inline JavaScript right there in the HTML page, most templating languages have a way to turn off escaping for a specific piece of text.
The line in picture 2 isn't the same as the one in picture 1. < was substituted for <, which is the HTML escape code for <. The error subsequently does not lie within your code itself, but somewhere in your development workflow. You either saved the file with the wrong contents (which I presume to be unlikely) or your web server or any pre processor is messing up by HTML escaping code inside script-tags.
I am getting this error in my markup validation:
Warning Line 23, Column 23: character "<" is the first character of a delimiter but occurred as data
for (var i = 0; i < array.length; i++) {
Is there something wrong with the "<" character in the following js?
function preloadImages(array) {
if (!preloadImages.list) {
preloadImages.list = [];
}
for (var i = 0; i < array.length; i++) {
var img = new Image();
img.src = array[i];
preloadImages.list.push(img);
}
}
It looks like your document is XHTML and your Javascript is inlined. At least you seem to be validating against XHTML. Since XHTML is rather strict and closer to XML, < is interpreted as the start of a new tag and confused the validator.
There is a number of ways to fix this:
Use HTML5 instead of XHTML; really, this usually is the best choice unless you have a good reason to stick to XHTML. It is understood by all major browsers and is the latest and most modern doctype that allows all the cool new features of the Web 2.0. The doctype for HTML5 looks like this:
<!DOCTYPE html>
<html>
....
Don't inline your Javascript, but add it as an external resource. You should be doing this all the time anyway, no matter what doctype you are using:
<script type="text/javascript" src="yourScript.js"></script>
Enclose the script in a CDATA block:
<script type="text/javascript">
<![CDATA[
// your code
]]>
</script>
You can read up on doctypes and XHTML for further details.
I copied this code from an example. I've read it 100 times.
Array.prototype.map = function(fn) {
var r = [];
var l = this.length;
for(var i = 0; i < l; i++) {
r.push(fn(this[i]));
}
return r;
};
Why does Firefox say:
not well-formed
file:///some/path.html Line: 5
for(var i = 0; i < l; i++) {
-------------------^
UPDATE
The error is only shown when Firebug is turned on for the page.
You are using Javascript code in an HTML page claiming to be fully XHTML-compliant. Therefore, the < character cannot appear in the Javascript, as it would be interpreted as the beginning of an XHTML tag.
There are a number of ways to fix this.
You could change the DOCTYPE and make it not XHTML.
You could enclose the Javascript in a <![CDATA[ section.
You could move the Javascript into a separate .js file.
You could escape every occurrence of < with < and every & with &. I do not recommend this option; it'll make your code unreadable and will almost definitely not work in IE.
Likely your error isn't in this code, but something above it trickling errors down. So, instead of finding an error in this code, look above for malformed HTML or javascript that could be causing this error instead.
If I use the following HTML and your text as "test.js", I too get no errors in Firebug.
<html>
<head>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
test
</body>
</html>
Works for me. Please post the full file, and make sure you are using script tags.
I posted a validating pastebin file (Chetan's was technically not valid), and it works fine with Firebug. So I suggest you come back with a full page of validating code that doesn't work.