<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>blog.haraldkraft.de &#187; browser</title>
	<atom:link href="http://blog.haraldkraft.de/tag/browser/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.haraldkraft.de</link>
	<description>Blog Project of Harald Kraft</description>
	<lastBuildDate>Thu, 08 Jul 2010 20:32:33 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=abc</generator>
		<item>
		<title>Opera and innerHTML vs. createTextNode()</title>
		<link>http://blog.haraldkraft.de/2010/01/opera-and-innerhtml-vs-createtextnode/</link>
		<comments>http://blog.haraldkraft.de/2010/01/opera-and-innerhtml-vs-createtextnode/#comments</comments>
		<pubDate>Wed, 20 Jan 2010 00:18:26 +0000</pubDate>
		<dc:creator>Harald Kraft</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[Technical]]></category>
		<category><![CDATA[browser]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[opera]]></category>
		<category><![CDATA[xml]]></category>

		<guid isPermaLink="false">http://blog.haraldkraft.de/?p=102</guid>
		<description><![CDATA[Recently I came across the situation where I created a webpage on which I wanted to include some raw XML data in a &#60;textarea&#62; so the user could see that XML data including all tags and stuff. What made the setup special was, that in this scenario I didn&#8217;t just put a predefined XML formatted [...]]]></description>
			<content:encoded><![CDATA[<p>Recently I came across the situation where I created a webpage on which I wanted to include some raw XML data in a &lt;textarea&gt; so the user could see that XML data including all tags and stuff. What made the setup special was, that in this scenario I didn&#8217;t just put a predefined XML formatted data inside the textarea, but the XML data was supposed to be inserted into the webpage (into the textarea) on the client-side via Javascript.<br />
(In order to give you a little bit more information about the whole picture: the source XML data &#8211; to be inserted on the fly &#8211; might change and should be able to be updated without reloading the whole page)</p>
<p><span id="more-102"></span><br />
I thought easy peasy, I&#8217;ll just get the textarea element by its ID and set its innerHTML to the desired XML data:<br />
<code>xmltext = loadXMLText( xmldoc );<br />
document.getElementById(targetid).innerHTML = xmltext;<br />
</code></p>
<p>This did work in IE 7 as well as in FF 3.5, but Opera (10.10 at the time) displayed a strange behavior. It rendered to content of appearing nodes (from the XML data) but replaced the node tags with spaces:<br />
<code>&lt;object&gt;&lt;name&gt;Foobar&lt;/name&gt;<br />
&lt;/object&gt;<br />
</code></p>
<p>would be rendered as (mask to see spaces):<br />
<code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Foobar&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
</code><br />
It took me a while (despite the use of Dragonfly, Opera&#8217;s debug tool) to figure out that the problem was not the &lt;textarea&gt;. Throughout my history with Opera and other browsers I gathered that if a website is viewed &#8220;incorrectly&#8221; in Opera, it usually meant that there was something wrong with the code.<br />
I then switched to the method of adding a new node to the DOM tree, which included the text from the XML data I wanted to be inserted:<br />
<code>xmltext = loadXMLText( xmldoc );<br />
textnode = document.createTextNode( xmltext );<br />
document.getElementById(targetid).appendChild( textnode );<br />
</code><br />
This now worked just fine in Opera. And so I assumed that creating a new DOM node via createTextNode() was the correct method if you wanted to insert any form of text (whether it&#8217;s source code shown as raw text or just text).</p>
<p>Since then I&#8217;ve googled and read a few things about innerHTML, createTextNode() and Opera. It seems that throughout its versions Opera went from supporting innerHTML (the same way other browsers did) to not supporting and to supporting again and so on.<br />
I am usually the kind of guy who thinks &#8220;if this code is wrong, show me so I can see it&#8217;s wrong, don&#8217;t try to guess what I meant&#8221; &#8211; even though guessing what web developers meant seems to be the specialty of most browsers. But in this case we can&#8217;t really say that using innerHTML is &#8220;wrong&#8221; even though it&#8217;s not the best thing to do. One of its advantages might be speed (especially if you&#8217;d have to create a lot of new nodes), but on the other hand it&#8217;s not a standard, so we can&#8217;t blame browsers if they don&#8217;t display it the way we want it to.</p>
<p>So as a final note, I&#8217;d like to say that I hope people having trouble with innerHTML and Opera find this blog post so they can fix their problem.<br />
And for those open to discussion about whether it&#8217;s bad/wrong/good/whatsoever to use innerHTML, I recommend <a href="http://blog.haraldkraft.de/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL3NsYXllcm9mZmljZS5jb20vYXJ0aWNsZXMvaW5uZXJIVE1MX2FsdGVybmF0aXZlcy8=">this article</a> which offers a nice list of ups and downs of innerHTML along with a whole bunch of scenarios and alternate ways to reach your goal without using a non-standard method <img src='http://blog.haraldkraft.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> .</p>
 <img src="http://blog.haraldkraft.de/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=102" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>http://blog.haraldkraft.de/2010/01/opera-and-innerhtml-vs-createtextnode/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Use customized shortcut keyboard setup in Opera browser</title>
		<link>http://blog.haraldkraft.de/2009/09/use-customized-shortcut-keyboard-setup-in-opera-browser/</link>
		<comments>http://blog.haraldkraft.de/2009/09/use-customized-shortcut-keyboard-setup-in-opera-browser/#comments</comments>
		<pubDate>Thu, 03 Sep 2009 17:00:03 +0000</pubDate>
		<dc:creator>Harald Kraft</dc:creator>
				<category><![CDATA[Life and People]]></category>
		<category><![CDATA[Technical]]></category>
		<category><![CDATA[browser]]></category>
		<category><![CDATA[opera]]></category>
		<category><![CDATA[shortcut]]></category>
		<category><![CDATA[windows]]></category>

		<guid isPermaLink="false">http://blog.haraldkraft.de/?p=58</guid>
		<description><![CDATA[Throughout these past weeks, I&#8217;ve installed Opera on a few new systems (with various operating systems btw) and had to make (just) a few adjustments. One of them included setting my own keyboard setup. Even though making my custom shortcut settings was easily done each time (via Tools -> Preferences -> Advanced -> Shortcuts -> [...]]]></description>
			<content:encoded><![CDATA[<p>Throughout these past weeks, I&#8217;ve installed Opera on a few new systems (with various operating systems btw) and had to make (just) a few adjustments. One of them included setting my own keyboard setup. Even though making my custom shortcut settings was easily done each time (via <em>Tools</em> -> <em>Preferences</em> -> <em>Advanced</em> -> <em>Shortcuts</em> -> &#8220;Keyboard setup&#8221; <em>Duplicate</em> + <em>Edit</em>, see <a href="http://blog.haraldkraft.de/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?url=aHR0cDovL215Lm9wZXJhLmNvbS9UYW1pbC9ibG9nL2FkZC1tb2RpZnkta2V5Ym9hcmQtc2hvcnRjdXQ=">Tamil&#8217;s blog</a> for a nice description), embarrassingly I had forgotton how to actually &#8220;enable&#8221; the modified keyboard setup.</p>
<p><span id="more-58"></span><br />
In my opinion, it took me too long to find the solution online, that&#8217;s why I am posting this blog entry (apart from self-interest as a reminder <img src='http://blog.haraldkraft.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  ).</p>
<p>So, after you have possibly created and edited the customized keyboard setup to your needs &#8211; drumroll &#8211; while in the Edit-Dialog of your keyboard setup (<em>Tools</em> -> <em>Preferences</em> -> <em>Advanced</em> -> <em>Shortcuts</em> -> select your &#8220;Keyboard setup&#8221; and click <em>Edit</em>) you need to click on the <strong>Default</strong> button in order to (as I called it) &#8220;enable&#8221; the keyboard setup.<br />
That&#8217;s all there is to it &#8211; simple if you know it, but a bitch if you don&#8217;t and try all sort of tricks <img src='http://blog.haraldkraft.de/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> .</p>
<p>Btw, for those of you who&#8217;re interested: The only change I made in the keyboard setting (and that really matters to me) is that I like <em>Ctrl+D</em> to perform &#8220;Paste + go&#8221; as it used to do in older Opera versions. For me it was one of the most useful shortcuts ever and in my opinion was way more efficient than the &#8220;new&#8221; default setting (after Opera adapted Ctrl+D to be &#8220;Bookmark directly&#8221;, that I never use anyway, from Firefox).</p>
 <img src="http://blog.haraldkraft.de/wp-content/plugins/wordpress-feed-statistics/feed-statistics.php?view=1&post_id=58" width="1" height="1" style="display: none;" />]]></content:encoded>
			<wfw:commentRss>http://blog.haraldkraft.de/2009/09/use-customized-shortcut-keyboard-setup-in-opera-browser/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
