Develop Reference

Can I build opening/closing tags while iterating over a string?

I have a string that has some html tags in it. I want to be able to find an opening and closing tag, and add those that are missing.
For example, lets say I have this string:
Hello <strong>from <em>StackOverflow</strong> Hows it going</em>.
I want to be able to close the first <em> before the closing </strong> and add an opening <em> right after the closing </strong>.
I will know what tags are included, but the stringI am provided could contain any variation of mixed up opening/closing tags.
How could I handle this without help from DOMParser or innerHTML?
Basically, I want to iterate the string and when I come across <, I want to start an opening string, and close it at >. Then, I want to start a closing tag when I come across </ and end it at >.
The problem is, when iterating a string, I will always start an opening tag due to checking one char at a time? How can I build these tags out of my string as I iterate?

You could find where both the opening and closing tags are in JavaScript with a regex like (<.+?>), but considering regex lookbehind is unsupported in JavaScript, what you are asking is probably impossible, due to the fact that you'll never be able to work out which end tag correlates to which start tag.
Hope this helps!

The problem with this is that without the tags being closed properly there is no logic to figure out when they should be closed.
You can loop through strings in Javascript the same way you can loop through arrays.
for(var i = 0; i < string.length; i++){
var character = string[i];
//add more loops here to look through subsequent characters for patterns...
}
Please note that this will have to be done on the string BEFORE it is output to the page because modern browsers will automatically close off opened tags that are missing a closing tab at the following position.
However, looking for patterns and figuring out when to close and open each tag is actually very complex.
I would recommend using a library. Otherwise you will spend 2 months or so re-inventing the wheel.
The example you posted is simple.
Hello <strong>from <em>StackOverflow</strong> Hows it going</em>.
Should become
Hello <strong>from <em>StackOverflow</em></strong><em> Hows it going</em>.
But what happens when you have something like
Hello <em><strong> </strong>from <em></strong> Stackoverflow ...
There are some situations where there is just no way to know where the tags need to be unless you are the content author.
So the best solution would be to eliminate the source of the incorrect tags and make sure that the content creation process doesn't have any of those flaws.
You could also just loop through the string and close off any tags immediately after they are opened if the following closing tag doesn't match the opening tag. This is what Chrome/Firefox etc. will do automatically anyway. That ensures the HTML is staying correct and won't break the page.

jQuery adding unwanted characters to string?

I'm using a jQuery to add localised currency signs to a page. Seemingly an innocent and straightforward procedure:
$('.currency').text( userCurrency() )
However, if the currency string is £, instead the output is £.
I've got no idea what might be causing it, as I cannot recreate the issue in jsFiddle.
It doesn't happen in firefox, ie or safari, only chrome.
By setting a breakpoint at the function call it is possible to see that the text is not actually visible (or loaded?) in the browser (even though the code is only run after the window has loaded).
I understand I'm not giving you much to work with, and I'm sorry - this is a very bizarre issue indeed.
Has anyone out there encountered anything similar, maybe someone has ideas how I can go about troubleshooting?

This is due to the different encodings used. Make sure all documents use the utf-8 encoding, along with setting the meta tag for utf-8. But also as in Qambar Raza's answer mentions you should probably use the html entity of certain characters instead of the actual character.

You need to use this in your of the HTML page:
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
It basically sets the content type of your page to ('utf-8') encoding meaning it can support the character set for currency.
Also, make sure you use HTML entities like:
£ for £
i.e your function userCurrency() should return html entities (e.g £) rather than a direct symbol. You can find more details about this topic on the following link:
http://webdesign.about.com/od/localization/l/blhtmlcodes-cur.htm

Django CMS / WYMEditor Stop Stripping of Whitespace

I'm aware of what WYMEditor is all about and that using Paragraphs for spacing is not intended, however the problem here is with the client requiring that we give them this functionality.
I've looked high and low to find where WYMEditor does it's stripping of whitespace and can't seem to find it at all.
It seems that when you press enter it creates a P visually, however when clicking the source it doesn't contain it. Furthermore, manually editing HTML source to contain <p> </p> doesn't work, as WYMEditor strips it out.
Just wondering if anybody has had this issue before and knows how to get rid of this functionality? It's worth noting that I believe the replacement is happening both in the 'text' module of Django-CMS, and also in the Javascript for WYMEditor.

Turns out, the function that does this stripping is very simply named, for some reason I missed it in (multiple!) searches for the word 'empty' in the script file.
It's located in jquery.wymeditor.js, line ~3440 there is the function WYMeditor.XhtmlSaxListener.prototype.removeEmptyTags, simply stop the replacement:
WYMeditor.XhtmlSaxListener.prototype.removeEmptyTags = function(xhtml)
{
return xhtml;// .replace(new RegExp('<('+this.block_tags.join("|").replace(/\|td/,'').replace(/\|th/, '')+')>(<br \/>| | |\\s)*<\/\\1>' ,'g'),'');
};
That obviously stops the stripping of whitespace!

Why doesn’t JavaScript newlines work inside HTML?

I have the following:
<html>
<body>
<script type="text/javascript">
document.write('Hello\nWorld')
</script>
</body>
</html>
As you probably all know, \n doesn’t work and I have to use <br> instead. It won’t work either if I link to an external .js file. Here are my questions:
Why doesn’t \n work?
Why does <br> even work? Shouldn’t everything that’s inside the script tags be strictly JavaScript instead of a dirty mix between HTML and JS?
Is it possible to make \n work somehow?
I know \t doesn’t work either. Any other stuff that won’t work inside HTML files?
Unrelated question (I didn’t want to open a new question just for this): I installed Node.js to be able to try out JS scripts from inside vim but when I run this script I get the error "document is not defined". Same thing happens when I try from the REPL. Any ideas?
When searching for similar questions, all I got was that I should use <br> instead of \n.

I had:
<div>Hello\nworld</div>
I added the below css to div class and it's working now:
div {
white-space: pre-wrap;
}
I hope this solve your problem too.

Why doesn’t \n work?
Because white space is just white space in HTML.
Why does <br> even work?
Because it is the HTML for a line break
Shouldn’t everything that’s inside the script tags be strictly JavaScript instead of a dirty mix between HTML and JS?
That’s subjective. document.write is considered dirty by many as well.
You can always use createElement and createTextNode
Is it possible to make \n work somehow?
<pre>, white-space
I know \t doesn’t work either. Any other stuff that won’t work inside HTML files?
HTML is not plain text. Listing all the differences would be time-consuming, and out of scope for Stack Overflow. Try reading the specification.
Unrelated question (I didn’t want to open a new question just for this)
It is completely unrelated. Open a new question.

\n works. If you have a debugger of sorts (or similar developer tool), you can see the document source, and you will see that there is indeed a newline character. The problem is the way you are looking at the page: you’re not reading its source, you’re reading it as an HTML document. Whitespace in HTML is collapsed into a single space. So when you change the source, it does indeed change, although when interpreted as an HTML document, that change isn’t shown.
Your Node.js error is most probably caused by the fact that you’re running browser scripts on the server. I.e. scripts that refer to the document are intended to be run in a browser, where there is a DOM etc. Although a generic node process doesn’t have such a global object because it isn’t a browser. As such, when you try and run code that references a global object called document on the assumption that it exists just like in the browser, it will throw an error. document.write doesn’t exist; if you want to write to the screen, try console.log or look into the other util functions.

When HTML renders, it ignores whitespace. Thus the only way is to use line breaks.
Use <br/> instead of \n and it will work fine
The document.write() function writes HTML into the element.

Use <pre></pre> on the html and it will respect the text format from JS.

When you write to the page, you're not writing JavaScript; you're writing HTML. \n is a special "line feed" character that doesn't create a line break in the browser's rendering of the HTML. It WILL create a line break in the HTML file itself, but the browser doesn't take this into consideration when it renders out the markup.
Thus, the br tag is required.

Use the html tag <br/> to input line endings (your output is interpreted by an html parser), for example:
Javascript:
document.write("Hello<br/>World");

Whitespace emitted by JavaScript works like any other whitespace in your HTML file. That seems the expected behavior to me.

1) \n works in plain text files.
2) <br /> works because you are doing HTML in string. Strings can hold characters without breaking the rest of the JS script.
3) Not really. Perhaps when you are using <textarea>s.
4) Most other \*'s
5) More info needed.

1,3. "\n" does work. If you do a document.write inside the body tag you can check document.body.innerHTML and see that the line break is indeed there.
4.Anything HTML specific will be rendered HTML specific, so you will have to escape < and > into < and > for instance.
5.document is an object available in browsers, it is not used in node since the DOM doesn't exist there. require("sys"); and use sys.print in nodejs.

The document object represents an HTML document; any text written to the document will be processed by the browser's HTML renderer. In HTML, all adjacent whitespace, including line breaks (e.g., "\n"), are collapsed into a single space when rendered. This is why you need <br />, which is rendered as a line break. You can make \n work by replacing it with <br /> or by writing into a <pre> element:
Hello
World

Actually your code is works. When you run it on browser console like Firefox, it will show you:
<html><head></head><body>
<script type="text/javascript">
document.write('Hello\nWorld')
</script>Hello
World
</body></html>
Note on the Hello and World that is separated.
But when displayed on HTML, line break (whitespace) will be ommited.
To display "as is", you may surround the javascript with PRE tag, like:
<html>
<body>
<pre>
<script type="text/javascript">
document.write('Hello\nWorld')
</script>
</pre>
</body>
</html>
You will get your line break displayed on HTML.

Everyone has said what it was to be said but in case if you are using firebug/chrome Javascript console ..then try this >
console.log("Hello\nWorld");
This is the key difference. When you are printing something in HTML, the HTML rules apply. Elsewhere you can see the line breaks work.

Weird javascript

I 've got a very interesting thing with an html here.
<html>
<head>
<script language="Javascript">
var str="me&myhtml";
function delimit(){
document.write(str);
document.write("<hr>");
}
</script>
</head>
<body onload="delimit()">
</body>
</html>
You see 'me&myhtml' with a line beneath. However, if you comment //document.write("<hr>");
then you just see 'me', which is weird.
Thing is, javascript normally doesn't read '&', but rather interprets as a command. However, if you have any document.write() with at least 6 characters, or a 'br', or 'hr', then it displays '&' as it is.
Any ideas?

If there is no HTML tag after &myhtml JavaScript or the HTML rendering engine probably interprets it as an unrecognized or incomplete entity (lacking an ending ;) and does not render it. If you follow me&myhtml with an HTML tag, then JavaScript or the HTML rendering engine recognizes that &myhtml is not an incomplete entity because it is followed by an HTML tag instead of a ;.
It doesn't matter what HTML tag you follow the string with, <a> or <p> work just as well as <br>.
The behavior is not consistent across all browsers. IE 6, 7 & 8 and Firefox 2, 3 & 3.5 behave the way you describe, Safari for Windows 3 & 4 render nothing when you comment out the second document.write() or do something like document.write("abc");. Opera 9.64 & 10b3 render the text correctly regardless of the content of the second write().
Note that using document.write() in the onload event without writing out correctly formatted and valid HTML (complete with doctype and <html>, <head>, etc) is probably a bug anyway. Note the problem does not manifest itself if you do:
<html>
<head>
<script>
function delimit() {
document.write('me&myhtml');
}
</script>
</head>
<body>
<script>
delimit();
</script>
</body>
</html>
To answer your question, it is a bug in either the implementation of a specification, or an undefined part of a specification that each browser implements differently. What you are doing is slightly incorrect, the outcome of that slightly incorrect code is not defined and it can not be relied on to behave consistently across all of the major browsers in use today. What you are doing should be avoided.

Try str = "me&myhtml";

I just wanted to know why this is happening.
Well, the browser doesn't yet know whether your &myhtml is an entity reference you haven't finished writing yet, or just broken code it will have to fix up. For example you can say:
document.write('&eac');
document.write('ute;');
(Of course there is no entity reference like &myhtmlpotato; that you could be referring to, but the parser doesn't know that yet.)
If you let the parser know there's no more bits of entity reference coming, by document-writing something that couldn't possibly be in an entity reference, such as a <tag>, or spaces, it'll give up and decide your code was simply broken, and fix it.
Normally the end of the page would be a place where this would happen, but you don't have an end of the page, because the script isn't doing what you think it's doing.
Instead of calling document.write() during the original page loading process when it can write some content to your current page, you're calling it in the onload, by which time the document is completely loaded and you can't add to it. In this state, calling document.write() actually calls document.open() implicitly, destroying the current page and starting a new one, to which you then write ‘my&myhtml’. That new page you have opened stays open and not fully loaded until you call document.close() to tell it you aren't going to write any more to it. At that point your partial entity reference will be resolved as bad markup and fixed.

It probably has to do with the fact that & is essentially an escaping character in HTML. If you want to write out an ampersand to the page, you should use &