Yes, because you are trying to add a text node to an input and inputs cannot have child elements.

Yes, I know that, but the point is: when I make the tests using IE, I have an exception within the jQuery (line 5114).

I can think in two solutions:

• More generic (.append method)
• FROM

      /* 5113 */ if ( this.nodeType === 1 ) {
      /* 5114 */     this.appendChild( elem );
      /* 5115 */ }
      

• TO

      /* 5113 */ if ( this.nodeType === 1 && this.nodeName !== 'INPUT' ) {
      /* 5114 */     this.appendChild( elem );
      /* 5115 */ }
      

• OR

      /* 5113 */ if ( this.nodeType === 1 ) {
      /* 5114 */     try {
      /* 5115 */         this.appendChild( elem );
      /* 5116 */     } catch (e) {}
      /* 5117 */ }
      

• More specific (.text method)
• FROM

      /* 5042 */ return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );
      

• TO

      /* 5042 */ return this.empty().each(function() {
      /* 5043 */     $(this).not(":input").append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );
      /* 5044 */ });
      

Both solutions works... but using the "more specific" solution we can have the same DOM tree on IE, FF, Chrome, etc.

I do not understand the "same DOM tree" comment. It is incorrect to attempt to append DOM elements to an input. A DOM tree with child elements on an input is an invalid document. I don't think we need to add checks for that.

When I wrote "same DOM tree", I was trying to say that:

• Using FF, Chrome and Opera:
• The code

     $('#myInput').text('something');
     

• Produces

     <input type="text" id="myInput">something</input>
     

• Using IE:
• The code

     $('#myInput').text('something');
     

• "Produces" (throw error and don't change the input)

     <input type="text" id="myInput" />
     

I have updated the fiddle: http://jsfiddle.net/laubstein/mRZ5Z/1/

Thanks

I can't really blame IE for throwing an error, rather than producing an invalid document. IE is trying to send a message here ... listen to it: <input> elements cannot have children.

Dave,

did you read that the exception has occurred inside the jQuery file (line 5114 called from 5042)?

This problem came to me because a co-worker tried to do something like that:

// "left" is a generic css class (text-align: left)
$('.left').text('');

We have already fixed using:

$('.left').not(':input').text('');
$(':input.left').val('');

Just for curiosity... I looked in jQuery 1.5.1 source code and have found 3 "try..catches" that just prevent's IE from throwing an error:

• lines 2474 and 2498 - prevent IE from throwing an error for some elements with some event types, see #3533
• line 5802 - Wrapped to prevent IE from throwing errors when 'invalid' values are provided, Fixes bug #5509
• line 6094 - #8138, IE may throw an exception when accessing a field from document.location if document.domain has been set. (extra, because the catch block has some code)

Yes, I know that <input> (and some others) elements cannot have children =). (http://www.w3.org/TR/html4/index/elements.html and http://dev.w3.org/html5/spec/Overview.html)

Thank you!

I have this same problem in IE 8.

That's because you're not supposed to do that. Use .val() instead.