simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
If I have any Element Nodes within that dt or wrap that dt text node
with a <span>, IE and firefox will append without a space. Obviously
IE is adding whitespace to the text node where Firefox is not (and not
doing that behavior when an Element Node exists. I have looked around
and have not seen any comments on this issue. Am I missing something?
9  3335 
On May 2, 12:11 am, martymix <m...@ericksonbarnett.comwrote:
simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
If I have any Element Nodes within that dt or wrap that dt text node
with a <span>, IE and firefox will append without a space. Obviously
IE is adding whitespace to the text node where Firefox is not (and not
doing that behavior when an Element Node exists. I have looked around
and have not seen any comments on this issue. Am I missing something?
What is the exact HTML source, can you post here?
On May 1, 4:27 pm, VK <schools_r...@yahoo.comwrote:
On May 2, 12:11 am, martymix <m...@ericksonbarnett.comwrote:
simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
If I have any Element Nodes within that dt or wrap that dt text node
with a <span>, IE and firefox will append without a space. Obviously
IE is adding whitespace to the text node where Firefox is not (and not
doing that behavior when an Element Node exists. I have looked around
and have not seen any comments on this issue. Am I missing something?
What is the exact HTML source, can you post here?
dumbed down for the example..
<dt class="header" id="invest">Investment Professionals</dt>
<dd class="header">
<p>This is the venture partners copy</p>
</dd>
</dt>
and the JS
var dt = document.getElementById('invest');
var text = dt.innerHTML + 'new'
alert(text); // FF = 'Investment Professionalsnew' IE='Investment
Professionals new'
And I was wrong, wrapping 'investment professionals' in a <span>
yields the same space. Wrapping in a <pcollapses it. Must be an
inline thing.
On May 2, 6:11 am, martymix <m...@ericksonbarnett.comwrote:
simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
The unsatisfying answer is that innerHTML is a proprietary Microsoft
invention that has been widely copied by other browsers and there is
no public standard for its implementation. A small amount of testing
in different browsers will show there are a number of differences
across browsers.
Opera, which usually follows IE pretty closely, does the same as
Firefox in this case.
innerHTML is usually OK for inserting HTML, however it starts to fall
apart if you depend upon it for anything else, particularly if you
expect it to be the same as the HTML source.
--
Rob
RobG wrote:
On May 2, 6:11 am, martymix <m...@ericksonbarnett.comwrote:
>simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
The unsatisfying answer is that innerHTML is a proprietary Microsoft
invention that has been widely copied by other browsers and there is
no public standard for its implementation. A small amount of testing
in different browsers will show there are a number of differences
across browsers.
Opera, which usually follows IE pretty closely, does the same as
Firefox in this case.
innerHTML is usually OK for inserting HTML, however it starts to fall
apart if you depend upon it for anything else, particularly if you
expect it to be the same as the HTML source.
What alternatives are there if you desire the source to be the same?
In fact, when is it not appropriate to use innerHTML? Any example of
when the DOM is the best choice?
I hope I worded that right.
--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
-Lost wrote:
RobG wrote:
>On May 2, 6:11 am, martymix <m...@ericksonbarnett.comwrote:
>>simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
The unsatisfying answer is that innerHTML is a proprietary Microsoft
invention that has been widely copied by other browsers and there is
no public standard for its implementation. A small amount of testing
in different browsers will show there are a number of differences
across browsers.
Opera, which usually follows IE pretty closely, does the same as
Firefox in this case.
innerHTML is usually OK for inserting HTML, however it starts to fall
apart if you depend upon it for anything else, particularly if you
expect it to be the same as the HTML source.
What alternatives are there if you desire the source to be the same?
In fact, when is it not appropriate to use innerHTML? Any example of
when the DOM is the best choice?
I hope I worded that right.
OK, I am not liking how I worded all that. Sorry.
What alternatives, aside from createElement, createTextNode,
setAttribute, and appendChild are there?
None?
And in the DOM fashion your source will be exactly as you created it?
The reason I ask actually is because of the code below.
<p id="p1" onclick="json1['widget']['window'].winFunc1(this.onclick);">
alert json bracket</p>
<p id="p2" onclick="json1.widget.window.winFunc1(this.onclick );">
alert json dot</p>
The winFunc1 function simply alerts what is passed. In both cases you get:
function onclick(event) {
json1.widget.window.winFunc1(this.onclick);
}
Is it possible to actually get:
function onclick(event) {
json1['widget']['window'].winFunc1(this.onclick);
}
? It is pointless and all, I am just wondering.
(Yes, I am lazy (and slightly inebriated). I figured it would be much
easier me asking than actually writing a test.) Thanks!
--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
On May 2, 8:28 pm, -Lost <maventheextrawo...@techie.comwrote:
-Lost wrote:
RobG wrote:
On May 2, 6:11 am, martymix <m...@ericksonbarnett.comwrote:
simple question:
I have a simple <dt>test text</dt>
>I get the innerHTML of that dt, and I try and append some text to it
like so:
>dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
>in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
The unsatisfying answer is that innerHTML is a proprietary Microsoft
invention that has been widely copied by other browsers and there is
no public standard for its implementation. A small amount of testing
in different browsers will show there are a number of differences
across browsers.
Opera, which usually follows IE pretty closely, does the same as
Firefox in this case.
innerHTML is usually OK for inserting HTML, however it starts to fall
apart if you depend upon it for anything else, particularly if you
expect it to be the same as the HTML source.
What alternatives are there if you desire the source to be the same?
I don't know of any reliable, cross-browser way to ensure that an
element's innerHTML is the same as its source in anything other than
trivial cases. There is certainly no way to ensure that any two
browsers will report the same value for the innerHTML property of a
non-trival element.
>
In fact, when is it not appropriate to use innerHTML? Any example of
when the DOM is the best choice?
Modifying a table or a complex structure, modifying attribute values,
there are likely many more.
I hope I worded that right.
OK, I am not liking how I worded all that. Sorry.
What alternatives, aside from createElement, createTextNode,
setAttribute, and appendChild are there?
None?
There are a variety of standard and non-standard ways to modify the
DOM, e.g. new Option, that are widely supported and "better" than
innerHTML in certain circumstances. My opinion is that innerHTML
should be reserved for simple cases, such as where text content is to
be replaced.
And in the DOM fashion your source will be exactly as you created it?
Browsers read the source and parse it to create a DOM. According to
MSDN, the innerHTML property:
"Sets or retrieves the HTML between the start and end tags of the
object."
<URL: http://msdn2.microsoft.com/en-us/library/ms533897.aspx >
The phrase "the HTML" seems to indicate that getting an element's
innerHTML property returns the browser's reverse engineering of a DOM
fragment back to HTML. It is not the literal source that created it,
otherwise they would have said "the source HTML" or such (though given
the generally dreadful quality of MSDN documentation I'm not too sure
about that).
Unless you set out to write the source to be the same as the innerHTML
property, you can almost guarantee that the two will be different to
varying degrees and that any two browsers will also vary in their
innerHTML property.
>
The reason I ask actually is because of the code below.
<p id="p1" onclick="json1['widget']['window'].winFunc1(this.onclick);">
alert json bracket</p>
<p id="p2" onclick="json1.widget.window.winFunc1(this.onclick );">
alert json dot</p>
The winFunc1 function simply alerts what is passed. In both cases you get:
function onclick(event) {
json1.widget.window.winFunc1(this.onclick);
}
It isn't "what is passed", otherwise it would be the literal source.
>
Is it possible to actually get:
function onclick(event) {
json1['widget']['window'].winFunc1(this.onclick);
}
In some browser, maybe - in all browsers, no as your above example
(presuming it is a real example) demonstrates.
? It is pointless and all, I am just wondering.
Yes, pointless.
(Yes, I am lazy (and slightly inebriated). I figured it would be much
easier me asking than actually writing a test.) Thanks!
You did write an example and found the innerHTML is different to the
source. What more needs to be said?
--
Rob
-Lost wrote:
<snip>
What alternatives, aside from createElement, createTextNode,
setAttribute, and appendChild are there?
JFTR, some range methods also permit to parse some HTML string into some
DOM fragment; in IE, you can use pasteHTML, and Mozilla extends the W3C
Range specification with a specific createContextualFragment method.
Since these methods are both proprietary, I would not expect other
browsers to implement them, though.
<URL:http://msdn2.microsoft.com/en-us/library/ms536656.aspx>
<URL:http://developer.mozilla.org/en/docs/DOM:range.createContextualFragment>
Regards,
Elegie 'Never out of range'
RobG wrote:
On May 2, 8:28 pm, -Lost <maventheextrawo...@techie.comwrote:
>-Lost wrote:
>>RobG wrote:
On May 2, 6:11 am, martymix <m...@ericksonbarnett.comwrote:
simple question:
I have a simple <dt>test text</dt>
I get the innerHTML of that dt, and I try and append some text to it
like so:
dt = document.getElementsByTagName('dt')[0]
var text = dt.innerHTML + 'new'
in Firefox, I get "test textnew"
and in IE I get "test text new" (with a space)
The unsatisfying answer is that innerHTML is a proprietary Microsoft
invention that has been widely copied by other browsers and there is
no public standard for its implementation. A small amount of testing
in different browsers will show there are a number of differences
across browsers.
Opera, which usually follows IE pretty closely, does the same as
Firefox in this case.
innerHTML is usually OK for inserting HTML, however it starts to fall
apart if you depend upon it for anything else, particularly if you
expect it to be the same as the HTML source.
What alternatives are there if you desire the source to be the same?
I don't know of any reliable, cross-browser way to ensure that an
element's innerHTML is the same as its source in anything other than
trivial cases. There is certainly no way to ensure that any two
browsers will report the same value for the innerHTML property of a
non-trival element.
>>In fact, when is it not appropriate to use innerHTML? Any example of
when the DOM is the best choice?
Modifying a table or a complex structure, modifying attribute values,
there are likely many more.
>>I hope I worded that right.
OK, I am not liking how I worded all that. Sorry.
What alternatives, aside from createElement, createTextNode,
setAttribute, and appendChild are there?
None?
There are a variety of standard and non-standard ways to modify the
DOM, e.g. new Option, that are widely supported and "better" than
innerHTML in certain circumstances. My opinion is that innerHTML
should be reserved for simple cases, such as where text content is to
be replaced.
>And in the DOM fashion your source will be exactly as you created it?
Browsers read the source and parse it to create a DOM. According to
MSDN, the innerHTML property:
"Sets or retrieves the HTML between the start and end tags of the
object."
<URL: http://msdn2.microsoft.com/en-us/library/ms533897.aspx >
The phrase "the HTML" seems to indicate that getting an element's
innerHTML property returns the browser's reverse engineering of a DOM
fragment back to HTML. It is not the literal source that created it,
otherwise they would have said "the source HTML" or such (though given
the generally dreadful quality of MSDN documentation I'm not too sure
about that).
Unless you set out to write the source to be the same as the innerHTML
property, you can almost guarantee that the two will be different to
varying degrees and that any two browsers will also vary in their
innerHTML property.
>The reason I ask actually is because of the code below.
<p id="p1" onclick="json1['widget']['window'].winFunc1(this.onclick);">
alert json bracket</p>
<p id="p2" onclick="json1.widget.window.winFunc1(this.onclick );">
alert json dot</p>
The winFunc1 function simply alerts what is passed. In both cases you get:
function onclick(event) {
json1.widget.window.winFunc1(this.onclick);
}
It isn't "what is passed", otherwise it would be the literal source.
Right, good point.
>Is it possible to actually get:
function onclick(event) {
json1['widget']['window'].winFunc1(this.onclick);
}
In some browser, maybe - in all browsers, no as your above example
(presuming it is a real example) demonstrates.
>? It is pointless and all, I am just wondering.
Yes, pointless.
>(Yes, I am lazy (and slightly inebriated). I figured it would be much
easier me asking than actually writing a test.) Thanks!
You did write an example and found the innerHTML is different to the
source. What more needs to be said?
Fair enough.
Sometimes my mind and my understanding forget to share information with
each other. ;)
Thanks, RobG!
--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not.
Elegie wrote:
-Lost wrote:
<snip>
>What alternatives, aside from createElement, createTextNode,
setAttribute, and appendChild are there?
JFTR, some range methods also permit to parse some HTML string into some
DOM fragment; in IE, you can use pasteHTML, and Mozilla extends the W3C
Range specification with a specific createContextualFragment method.
Since these methods are both proprietary, I would not expect other
browsers to implement them, though.
<URL:http://msdn2.microsoft.com/en-us/library/ms536656.aspx>
<URL:http://developer.mozilla.org/en/docs/DOM:range.createContextualFragment>
Thanks for the additional information.
--
-Lost
Remove the extra words to reply by e-mail. Don't e-mail me. I am
kidding. No I am not. This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: Jürgen Holly |
last post by:
Hi!
I have the following xml-node:
<docu>
<p>Sample: <b>bold</b></p>
<p>and text in <i>italic</i></p>
</docu>
I need to create a text-file, so I set the output-mode to text.
|
by: Phil N |
last post by:
Hello again
Site I'm working on: http://www3.telus.net/bikim/lightning/test/
- 'coach' & 'main' links swap innerHTML of div element - id 'textArea'
works fine in NN7; IE6 reports 'Object...
|
by: Mitch |
last post by:
Here is some code I have bastardised from a few places, Obviously the
innerHTML coding won't work in Mozilla, could anyone suggest a work
around or fix?
cheers,
Mitch....
|
by: Ron Brennan |
last post by:
I want if possible to use something like:
element.getElementsByTagName('text')
but that doesn't work. Is there another value for the parameter, or is it
not possible with getElementsByTagName?...
|
by: RobG |
last post by:
Why does Firefox insert #text nodes as children of TR elements?
As a work-around for older Safari versions not properly supporting a
table row's cells collection, I used the row's childNodes...
|
by: Joel Byrd |
last post by:
I am having this ridiculous problem of trying to set the innerHTML of a
div node. It works in all other browsers, but internet explorer is
giving me an "Unknown runtime error". This is actually...
|
by: uwe.braunholz |
last post by:
Hello,
I want to set the text of a marqee dynamical. So I created the
following code:
****snip****
<style>
#noticeMarquee
{
background-color:#ff00ff;
color:#ffffff;
|
by: CES |
last post by:
All,
Visual Studio 2005 doesn't include an auto complete item for innerHTML document.getElementById("SomeID").innerHTML, is their a way of referencing the inner text of an element without using...
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
| |
