4 ID : 2, // width, height, x, y
\r
5 CONTENT : 4, // width, height, x, y textNode の内容
\r
6 CLASSNAME : 8, // _getCharSize, width, height, x, y
\r
7 ATTR : 16, // _getCharSize, width, height, x, y
\r
8 CSS : 32, // _getCharSize, width, height, x, y
\r
9 IE_FILTER : X.UA.IE < 9 && !X.UA.MacIE ? 64 : 0,
\r
10 UNKNOWN_TAG_FIX : 128,
\r
11 IE4_TEXTNODE_FIX : 256
\r
20 DISPLAY_INLINE : 16,
\r
21 POSITION_ABSOLUTE : 32,
\r
22 OVERFLOW_HIDDEN : 64,
\r
23 HAS_WIDTH_LENGTH : 128,
\r
24 HAS_WIDTH_PERCENT : 256,
\r
25 HAS_HEIGHT_LENGTH : 512,
\r
26 HAS_HEIGHT_PERCENT : 1024,
\r
27 IE4_ONLY_TEXT : 2048,
\r
28 IE5_DISPLAY_NONE_FIX : !X.UA.MacIE && 5 <= X.UA.IE && X.UA.IE < 5.5 ? 4096 : 0 // filterがかかっていると不可? MacIE5.2- は ?
\r
31 X.Dom._strictElmCreation = !X.UA.MacIE && X.UA.IE5678;// && !X.UA.MacIE;
\r
33 X.Dom._useDocumentFragment = document.createDocumentFragment && ( !X.UA.IE || 5.5 <= X.UA.IE ) && document.createDocumentFragment();
\r
36 * Node( rawElement | rawTextnode | htmlString | textString )
\r
39 X.Dom.Node = X.EventDispatcher.inherits(
\r
41 X.Class.POOL_OBJECT,
\r
52 _root : null, // xnode が文書ツリーに属しているか?はこれを見る
\r
53 parent : null, // remove された枝も親子構造は維持している。
\r
62 _attrs : null, // X.Dom.Attr
\r
64 _attrText : '', // X.Dom.Attr.objToAttrText が必要な場合は false が入っている
\r
66 _css : null, // X.Dom.Style
\r
74 * TODO Node の継承ができない!
\r
76 Constructor : function( v ){
\r
77 var css, xnodes, xnode, parent, uid = Node._chashe.length;
\r
79 if( Node._newByTag ){
\r
80 Node._newByTag = false;
\r
81 this._tag = v.toUpperCase();
\r
82 this._xnodeType = 1;
\r
83 this._state = X.Dom.State.DISPLAY_INLINE; // todo
\r
84 arguments[ 1 ] && this.attr( arguments[ 1 ] );
\r
85 css = arguments[ 2 ];
\r
86 css && this[ X.Type.isString( css ) ? 'cssText' : 'css' ]( css );
\r
88 if( Node._newByText ){
\r
89 Node._newByText = false;
\r
91 this._xnodeType = 3;
\r
92 this._state = X.Dom.State.DISPLAY_INLINE;
\r
94 if( 1 < arguments.length ) return new X.Dom.NodeList( arguments );
\r
95 if( X.Type.isArray( v ) && v.length ) return new X.Dom.NodeList( v );
\r
96 //if( !this || this.append !== Node.prototype.append ){
\r
97 // return new Node( v );
\r
99 switch( Node._getType( v ) ){
\r
100 case Node.IS_XNODE :
\r
101 case Node.IS_XNODE_LIST :
\r
103 case Node.IS_RAW_HTML :
\r
104 if( xnode = Node._getXNode( v ) ) return xnode;
\r
105 // v.parentNode || v.parentElement : dom1 || dom0
\r
106 this.parent = ( parent = v.parentNode || v.parentElement ) && parent.tagName /* ie7- */ && Node._getXNode( parent );
\r
107 this._root = this.parent ? this.parent._root : null;
\r
108 this._rawObject = v;
\r
109 this._xnodeType = 1;
\r
110 this._state = X.Dom.State.DISPLAY_BLOCK; // todo
\r
111 this._tag = v.tagName.toUpperCase();
\r
113 this._className = v.className;
\r
114 this.cssText( v.style.cssText );
\r
115 // X.Dom.Dirty.CSS を落とす
\r
118 if( X.Dom.DOM_IE4 ){
\r
119 v.setAttribute( 'UID', '' + uid );
\r
125 case Node.IS_RAW_TEXT :
\r
126 if( xnode = Node._getXNode( v ) ) return xnode;
\r
127 this.parent = Node._getXNode( v.parentNode );
\r
128 this._root = this.parent ? this.parent._root : null;
\r
129 this._rawObject = v;
\r
130 this._xnodeType = 3;
\r
131 this._state = X.Dom.State.DISPLAY_INLINE;
\r
132 this._text = v.data;
\r
135 case Node.IS_HTML_STRING :
\r
136 case Node.IS_STRING :
\r
137 if( xnodes = X.Dom.parse( v, true ) && 1 < xnodes.length ) return new X.Dom.NodeList( xnodes );
\r
138 if( xnodes.length ) return xnodes[ 0 ];
\r
140 case Node.IS_IMAGE :
\r
141 if( xnode = Node._getXNode( v ) ) return xnode;
\r
142 this._rawObject = v;
\r
143 this._xnodeType = 4;
\r
145 this._state = X.Dom.State.EXIST;
\r
148 case Node.IS_WINDOW :
\r
149 case Node.IS_DOCUMENT :
\r
150 if( xnode = Node._getXNode( v ) ) return xnode;
\r
151 this._rawObject = v;
\r
152 this._xnodeType = 2;
\r
153 this._state = X.Dom.State.DISPLAY_BLOCK;
\r
156 if( Node.none ) return Node.none;
\r
161 Node._chashe[ this._uid = uid ] = this;
\r
166 var Node = X.Dom.Node;
\r
169 Node.IS_RAW_HTML = 2;
\r
170 Node.IS_RAW_TEXT = 3;
\r
171 Node.IS_HTML_STRING = 4;
\r
172 Node.IS_STRING = 5;
\r
173 //Node.IS_DOC_FRAG = 6;
\r
174 Node.IS_XNODE_LIST = 7;
\r
175 Node.IS_WINDOW = 8;
\r
176 Node.IS_DOCUMENT = 9;
\r
177 Node.IS_IMAGE = 10;
\r
179 Node._getType = function( v ){
\r
180 if( v === '' ) return Node.IS_STRING;
\r
182 if( v === window ) return Node.IS_WINDOW;
\r
183 if( v === document ) return Node.IS_DOCUMENT;
\r
184 if( v.constructor === Node ) return Node.IS_XNODE;
\r
185 if( v.constructor === X.Dom.NodeList ) return Node.IS_XNODE_LIST;
\r
186 if( X.Type.isHTMLElement( v ) ) return Node.IS_RAW_HTML;
\r
187 if( v.nodeType === 3 ) return Node.IS_RAW_TEXT;
\r
188 if( X.Type.isImage( v ) ) return Node.IS_IMAGE;
\r
189 if( typeof v === 'string' ){
\r
190 return '<' === v.charAt( 0 ) && v.charAt( v.length - 1 ) === '>' ? Node.IS_HTML_STRING : Node.IS_STRING;
\r
192 //if( v.nodeType === 11 ) return Node.IS_DOC_FRAG;
\r
195 Node._getXNode = function( v ){
\r
196 var uid, i, chashe, xnode;
\r
197 switch( Node._getType( v ) ){
\r
198 case Node.IS_XNODE :
\r
199 case Node.IS_XNODE_LIST :
\r
201 case Node.IS_RAW_HTML :
\r
202 case Node.IS_IMAGE :
\r
203 // fake TextNode too.
\r
204 if( X.Dom.DOM_IE4 ){
\r
205 uid = v.getAttribute( 'UID' );
\r
206 return uid && Node._chashe[ uid ];
\r
208 return v.UID && Node._chashe[ v.UID ];
\r
209 case Node.IS_WINDOW :
\r
210 return Node._window;
\r
211 case Node.IS_DOCUMENT :
\r
212 return Node._document;
\r
213 case Node.IS_RAW_TEXT :
\r
214 if( v.UID ) return Node._chashe[ v.UID ];
\r
215 for( chashe = Node._chashe, i = chashe.length; i; ){
\r
216 if( ( xnode = Node._chashe[ --i ] ) && ( xnode._rawObject === v ) ) return xnode;
\r
222 Node.create = function( tag, opt_attrs, opt_css ){
\r
224 switch( Node._getType( tag ) ){
\r
225 case Node.IS_STRING :
\r
226 Node._newByTag = true;
\r
227 return new Node( tag, opt_attrs, opt_css );
\r
228 case Node.IS_HTML_STRING :
\r
229 list = X.Dom.parse( tag, true );
\r
230 for( i = list.length; 1 < i; ){
\r
231 list[ --i ].destroy();
\r
236 Node.createText = function( text ){
\r
237 Node._newByText = true;
\r
238 return new Node( text );
\r
242 Node.getRoot = function( xnode ){
\r
243 return Node._document;
\r
244 //return xNode._body._rawObject.documentElement ? node : node.ownerDocument || node.document;
\r
247 Node.isXmlDocument =
\r
251 if( X.Type.isBoolean( root.isXML ) ) return root.isXML;
\r
252 return root.isXML = root._rawObject.createElement( 'p' ).tagName !== root._rawObject.createElement( 'P' ).tagName;
\r
256 Node.none = Node._chashe[ 0 ] = new Node();
\r
257 Node._window = new X.EventDispatcher( window );
\r
258 Node._document = new X.EventDispatcher( document );
\r
259 Node._html = null; // = Node._chashe[ 1 ] <html>
\r
260 Node._body = null; // = Node._chashe[ 2 ] <body>
\r
261 Node._systemNode = null; // = Node._chashe[ ? ]
\r
263 Node._reserveRemoval = [];
\r
265 if( X.Dom.DOM_IE4 ){
\r
266 Node.prototype._ie4getRawNode = function(){
\r
267 var elm = this._rawObject;
\r
269 ( ( elm = document.all[ 'ie4uid' + this._uid ] ) && ( this._rawObject = elm ) ) ||
\r
270 ( this._id && ( elm = document.all[ this._id ] ) ) && ( this._rawObject = elm );
\r
275 /* --------------------------------------
\r
278 Node.prototype.create = function( tag, opt_attrs, opt_css ){
\r
280 if( this._xnodeType !== 1 ) return;
\r
281 if( !this._xnodes ) this._xnodes = [];
\r
283 xnode = Node.create( tag, opt_attrs, opt_css );
\r
285 xnode.parent = this;
\r
286 this._xnodes[ this._xnodes.length ] = xnode;
\r
287 this._root && this._reserveUpdate();
\r
290 Node.prototype.createAt = function( index, tag, opt_attrs, opt_css ){
\r
291 var xnode = Node.create( tag, opt_attrs, opt_css );
\r
292 this.appendAt( index, xnode );
\r
296 /* --------------------------------------
\r
299 Node.prototype.createText = function( text ){
\r
301 if( this._xnodeType !== 1 ) return;
\r
302 if( !this._xnodes ) this._xnodes = [];
\r
304 Node._newByText = true;
\r
305 xnode = new Node( text );
\r
306 xnode.parent = this;
\r
308 this._root && this._reserveUpdate();
\r
309 this._xnodes[ this._xnodes.length ] = xnode;
\r
312 Node.prototype.createTextAt = function( index, text ){
\r
313 var xtext = Node.createText( text );
\r
314 this.appendAt( index, xtext );
\r
318 /* --------------------------------------
\r
320 * http://d.hatena.ne.jp/think49/20110724/1311472811
\r
321 * http://d.hatena.ne.jp/uupaa/20100508/1273299874
\r
323 Node.prototype.clone = function( opt_clone_children ){
\r
324 var xnode, xnodes, i, l;
\r
325 switch( this._xnodeType ){
\r
327 Node._newByTag = true;
\r
328 xnode = new Node( this._tag, X.cloneObject( this._attrs ), X.cloneObject( this._css ) )
\r
329 .attr( { 'id' : this._id } )
\r
330 .className( this._className );
\r
331 if( opt_clone_children && ( xnodes = this._xnodes ) && ( l = xnodes.length ) ){
\r
332 for( i = 0; i < l; ++i ){
\r
333 xnode.append( xnodes[ i ].clone( true ) );
\r
338 Node._newByText = true;
\r
339 xnode = new Node( this._text );
\r
348 /* --------------------------------------
\r
351 * HtmlElement の場合は内部使用専用 そのため event の破棄等しない
\r
353 Node.prototype.append = function( v ){
\r
354 var i, l, xnodes, frg;
\r
355 if( this._xnodeType !== 1 ) return;
\r
357 if( 1 < ( l = arguments.length ) ){
\r
358 for( i = 0; i < l; ++i ){
\r
359 this.append( arguments[ i ] );
\r
364 if( !( xnodes = this._xnodes ) ) this._xnodes = xnodes = [];
\r
366 switch( Node._getType( v ) ){
\r
367 case Node.IS_RAW_HTML :
\r
368 case Node.IS_RAW_TEXT :
\r
371 case Node.IS_HTML_STRING :
\r
372 case Node.IS_STRING :
\r
373 return this.append.apply( this, X.Dom.parse( v, true ) );
\r
374 case Node.IS_XNODE :
\r
375 if( v._xnodeType !== 1 && v._xnodeType !== 3 ) return this;
\r
376 // 親の xnodes から v を消す
\r
378 //if( X.Dom.DOM_W3C ){
\r
379 // v.parent._xnodes.splice( v.parent._xnodes.indexOf( v ), 1 );
\r
381 //if( X.Dom.DOM_IE4 ){
\r
387 //if( ( i = Node._reserveRemoval.indexOf( v ) ) !== -1 ){
\r
388 // if( !this._state ) alert( 'xnode already destroyed!' );
\r
389 // Node._reserveRemoval.splice( i, 1 );
\r
397 xnodes[ xnodes.length ] = v;
\r
398 this._root && this._reserveUpdate();
\r
403 Node.prototype.appendAt = function( start, v ){
\r
406 if( this._xnodeType !== 1 ) return this;
\r
408 l = arguments.length;
\r
409 if( !( xnodes = this._xnodes ) ) xnodes = this._xnodes = [];
\r
411 if( xnodes.length <= start ){
\r
412 if( l === 2 ) return this.append( v );
\r
413 for( i = 1; i < l; ++i ){
\r
414 this.append( arguments[ i ] );
\r
418 if( start < 0 ) start = 0;
\r
421 this.appendAt( start, arguments[ --l ] );
\r
426 switch( Node._getType( v ) ){
\r
427 case Node.IS_RAW_HTML :
\r
428 case Node.IS_RAW_TEXT :
\r
431 case Node.IS_HTML_STRING :
\r
432 case Node.IS_STRING :
\r
433 v = X.Dom.parse( v, true );
\r
434 for( i = v.length; i; ){
\r
435 this.appendAt( start, v[ --i ] );
\r
438 case Node.IS_XNODE :
\r
439 if( v._xnodeType !== 1 && v._xnodeType !== 3 ) return this;
\r
440 // 親の xnodes から v を消す
\r
442 //if( X.Dom.DOM_W3C ){
\r
443 // v.parent._xnodes.splice( v.parent._xnodes.indexOf( v ), 1 );
\r
445 //if( X.Dom.DOM_IE4 ){
\r
451 //if( ( i = Node._reserveRemoval.indexOf( v ) ) !== -1 ){
\r
452 // if( !this._state ) alert( 'xnode already destroyed!' );
\r
453 // Node._reserveRemoval.splice( i, 1 );
\r
461 this._xnodes.splice( start, 0, v );
\r
462 this._root && this._reserveUpdate();
\r
466 Node.prototype.appendTo = function( parent, opt_index ){
\r
467 switch( Node._getType( parent ) ){
\r
468 case Node.IS_RAW_HTML :
\r
469 parent = new Node( parent );
\r
471 case Node.IS_HTML_STRING :
\r
472 parent = X.Dom.parse( parent, true );
\r
473 parent = parent[ 0 ] || parent;
\r
474 case Node.IS_XNODE :
\r
479 opt_index === undefined ? parent.append( this ) : parent.appendAt( opt_index, this );
\r
483 Node.prototype.appendToRoot = function( opt_index ){
\r
484 opt_index === undefined ? Node._body.append( this ) : Node._body.appendAt( opt_index, this );
\r
488 /* --------------------------------------
\r
489 * Before , After, Replace
\r
491 Node.prototype.before = Node.prototype.prevNode = function( v ){
\r
492 var parent = this.parent, xnodes, i, l, start;
\r
495 if( v === undefined ){
\r
496 if( !parent ) return;
\r
497 xnodes = parent._xnodes;
\r
498 i = xnodes.indexOf( this );
\r
499 return 0 < i ? xnodes[ i - 1 ] : v;
\r
502 if( !parent ) return this;
\r
504 l = arguments.length;
\r
505 start = this.getOrder();
\r
508 parent.appendAt( start, arguments[ --l ] );
\r
512 parent.appendAt( start, v );
\r
516 Node.prototype.after = Node.prototype.nextNode = function( v ){
\r
517 var parent = this.parent, xnodes, i, l, start;
\r
520 if( v === undefined ){
\r
521 if( !parent ) return;
\r
522 xnodes = parent._xnodes;
\r
523 i = xnodes.indexOf( this );
\r
524 return ++i < xnodes.length ? xnodes[ i ] : v;
\r
527 if( !parent ) return this;
\r
529 l = arguments.length;
\r
530 start = this.getOrder() + 1;
\r
531 if( parent._xnodes.length <= start ){
\r
533 for( i = 0; i < l; ++i ){
\r
534 parent.append( arguments[ i ] );
\r
538 parent.append( v );
\r
543 parent.appendAt( start, arguments[ --l ] );
\r
547 parent.appendAt( start, v );
\r
551 Node.prototype.replace = function( v ){
\r
552 if( !this.parent ) return this;
\r
553 return arguments.length === 1 ? this.before( v ).remove() : this.before.apply( this, arguments ).remove();
\r
556 /* --------------------------------------
\r
559 Node.prototype.remove = function(){
\r
560 var parent = this.parent;
\r
562 if( !parent ) return this;
\r
564 parent._xnodes.splice( parent._xnodes.indexOf( this ), 1 );
\r
566 Node._reserveRemoval[ Node._reserveRemoval.length ] = this;
\r
567 this._reserveUpdate();
\r
569 delete this.parent;
\r
574 Node.prototype.empty = function(){
\r
575 var xnodes = this._xnodes, i;
\r
576 if( xnodes && ( i = xnodes.length ) ){
\r
578 xnodes[ --i ].destroy();
\r
585 /* --------------------------------------
\r
588 Node._destroyChildFlag = false; // TODO
\r
590 Node.prototype.destroy = function( isChild ){
\r
591 var xnodes = this._xnodes, i, elm;
\r
593 if( !this._state ) return;
\r
595 elm = this._rawObject || this._ie4getRawNode && this._ie4getRawNode();
\r
597 if( xnodes && ( i = xnodes.length ) ){
\r
599 // xnodes[ --i ].destroy( true );
\r
602 elm && this._listeners && this.unlisten(); // イベントの退避
\r
604 delete Node._chashe[ this._uid ];
\r
605 delete this._state;
\r
608 !isChild && this.remove();
\r
610 this.parent && this.parent._xnodes.splice( this.parent._xnodes.indexOf( this ), 1 );
\r
611 elm && !isChild && this._actualRemove();
\r
618 /* --------------------------------------
\r
621 Node.prototype.contains = function( v ){
\r
622 var elm, type, xnodes, i;
\r
623 if( !v || this._xnodeType !== 1 ) return false;
\r
625 if( ( elm = this._rawObject || this._ie4getRawNode && this._ie4getRawNode() ) && document.contains && ( type = Node._getType( v ) ) && ( type === Node.IS_RAW_HTML || type === Node.IS_RAW_TEXT ) ){
\r
626 return elm.contains( v );
\r
628 //if( document.compareDocumentPosition ){
\r
631 xnodes = this._xnodes;
\r
632 if( !xnodes || !xnodes.length ) return false;
\r
633 if( xnodes.indexOf( v ) !== -1 ) return true; // fast
\r
634 if( elm === v.parentNode ) return false;
\r
635 for( i = xnodes.length; i; ){
\r
636 if( xnodes[ --i ].contains( v ) ) return true;
\r
641 /* --------------------------------------
\r
644 Node.prototype.getChildAt = function( i ){
\r
645 var xnodes = this._xnodeType === 1 && this._xnodes;
\r
646 return xnodes && 0 <= i && i < xnodes.length && xnodes[ i ];
\r
650 /* --------------------------------------
\r
651 * firstChild, lastChild
\r
653 Node.prototype.firstChild = function(){
\r
654 return this.getChildAt( 0 );
\r
656 Node.prototype.lastChild = function(){
\r
657 return this.getChildAt( this._xnodes.length - 1 );
\r
660 /* --------------------------------------
\r
663 Node.prototype.getOrder = function(){
\r
664 var parent = this.parent;
\r
665 if( !parent ) return -1;
\r
666 return parent._xnodes.indexOf( this );
\r
669 /* --------------------------------------
\r
670 * className, addClass, removeClass, hasClass
\r
672 Node.prototype.className = function( v ){
\r
675 if( v === undefined ) return this._className;
\r
678 if( this._className === v ) return this;
\r
679 if( !v || typeof v !== 'string' ){
\r
680 delete this._className;
\r
685 while( v.indexOf( __ ) !== -1 ){ v = v.split( __ ).join( _ ); };
\r
686 v.charAt( 0 ) === _ && ( v = v.substr( 1 ) );
\r
687 v.lastIndexOf( _ ) === 0 && ( v = v.substr( 0, v.length - 1 ) );
\r
689 if( this._className === v ) return this;
\r
690 v ? ( this._className = v ) : delete this._className;
\r
692 this._dirty |= X.Dom.Dirty.CLASSNAME;
\r
693 this._root && this._reserveUpdate();
\r
696 Node.prototype.addClass = function( v ){
\r
697 var names = v.split( ' ' ),
\r
702 name = names[ --i ];
\r
703 if( !name ) continue;
\r
704 !this.hasClass( name ) && ( v += ( v ? ' ' : '' ) + name );
\r
706 return v ? this.className( this._className + ( this._className ? ' ' : '' ) + v ) : this;
\r
708 Node.prototype.removeClass = function( v ){
\r
710 className = this._className,
\r
711 names = v.split( _ ),
\r
712 classNames, i, f, j;
\r
713 if( !className ) return this;
\r
714 for( classNames = className.split( _ ), i = classNames.length; i; ){
\r
715 className = classNames[ --i ];
\r
716 for( j = names.length; j; ){
\r
717 if( className === names[ --j ] ){
\r
718 classNames.splice( i, 1 );
\r
719 names.splice( j, 1 );
\r
725 return f ? this.className( classNames.join( _ ) ) : this;
\r
727 Node.prototype.toggleClass = function( v, opt_toggle ){
\r
728 var names, i, name;
\r
729 if( opt_toggle !== undefined ){
\r
730 return !!opt_toggle ? this.addClass( v ) : this.removeClass( v );
\r
732 names = v.split( ' ' );
\r
733 for( i = names.length; i; ){
\r
734 name = names[ --i ];
\r
735 this.hassClass( name ) ? this.removeClass( name ) : this.addClass( name );
\r
739 Node.prototype.hasClass = function( v ){
\r
741 className = this._className,
\r
743 if( className === v ) return true;
\r
744 if( !className ) return false;
\r
746 className = _ + className + _;
\r
747 if( className.indexOf( _ + v + _ ) !== -1 ) return true; // lucky hit
\r
749 for( v = v.split( _ ), i = v.length; i; ){
\r
751 if( name === '' ) continue;
\r
752 if( className.indexOf( _ + name + _ ) === -1 ) return false;
\r
757 /* --------------------------------------
\r
761 Node._outerFlag = null;
\r
763 Node.prototype.html = function( html ){
\r
764 var _ = '', q = '"', xnodes, n, i, l;
\r
766 if( html !== undefined ){ // String 以外に Number や false null なども許可
\r
767 if( this._xnodeType === 3 ) return this.text( html );
\r
768 return html ? this.empty().append.apply( this, X.Dom.parse( html, true ) ) : this.empty();
\r
772 if( this._xnodeType === 3 ){
\r
776 if( this._dirty & X.Dom.Dirty.CSS && !( this._cssText = X.Dom.Style.objToCssText( this._css ) ) ){
\r
777 delete this._cssText;
\r
779 html = !Node._outerFlag ? [] : [
\r
781 this._id ? ' id="' + this._id + q : _,
\r
782 this._className ? ' class="' + this._className + q : _,
\r
783 this._attrText === false ? ( this._attrText = X.Dom.Attr.objToAttrText( this._attrs ) ) : this._attrText,
\r
784 this._cssText ? ' style="' + this._cssText + q : _,
\r
788 if( ( xnodes = this._xnodes ) && ( l = xnodes.length ) ){
\r
789 if( !Node._outerFlag ) Node._outerFlag = this;
\r
790 for( i = 0; i < l; ++i ){
\r
791 html[ n ] = xnodes[ i ].html();
\r
794 if( Node._outerFlag === this ) Node._outerFlag = null;
\r
796 !Node._outerFlag || X.Dom.DTD.EMPTY[ this._tag ] || ( html[ n ] = '<\/' + this._tag + '>' );
\r
797 return html.join( _ );
\r
800 Node.prototype.text = function( text ){
\r
801 var xnodes, texts, i, l;
\r
803 if( text !== undefined ){
\r
804 if( this._xnodeType === 3 ){
\r
805 if( this._text !== text ){
\r
806 text ? ( this._text = text ) : delete this.text;
\r
807 this._root && this._reserveUpdate();
\r
808 this._dirty |= X.Dom.Dirty.CONTENT;
\r
812 if( !text ) return this.empty();
\r
813 if( ( xnodes = this._xnodes ) && xnodes.length === 1 && xnodes[ 0 ]._xnodeType === 3 ){
\r
814 xnodes[ 0 ].text( text );
\r
817 this.empty().createText( text );
\r
821 if( this._xnodeType === 1 ){
\r
822 if( ( xnodes = this._xnodes ) && ( l = xnodes.length ) ){
\r
823 for( texts = [], i = 0; i < l; ++i ){
\r
824 texts[ i ] = xnodes[ i ].text();
\r
826 return texts.join( '' );
\r
834 * HTML要素に対して name の関数を実行しその戻り値を返す。関数に渡す引数も任意に設定できる。
\r
836 Node.prototype.call = function( name /*, opt_args... */ ){
\r
837 var raw = this._rawObject || this._ie4getRawNode && this._ie4getRawNode(),
\r
838 l = arguments.length - 1,
\r
839 func, args, params, i;
\r
841 func = raw[ name ];
\r
842 if( X.Type.isFunction( func ) ){
\r
844 args = X.copyArray( arguments );
\r
846 return func.apply( raw, args );
\r
848 return raw[ name ]();
\r
850 if( X.Type.isUnknown( func ) ){
\r
851 // typeof func === unknown に対策
\r
852 // http://la.ma.la/blog/diary_200509031529.htm
\r
854 args = X.copyArray( arguments );
\r
858 for( i = 0; i < l; ++i ){
\r
859 params[ i ] = '_' + i;
\r
861 params = params.join( ',' );
\r
864 [ 'return this.', name, '(', params, ')' ].join( '' )
\r
865 ).apply( raw, args );
\r
867 return raw[ name ]();
\r
872 * xnode を this として関数を実行する。 NodeList.each と動作を合わせてあるため関数の戻り値は破棄される。
\r
873 * 関数に渡す引数も任意に設定できる。
\r
875 Node.prototype.each = function( func /*, opt_args */ ){
\r
877 if( 1 < arguments.length ){
\r
878 args = X.copyArray( arguments );
\r
880 func.apply( this, args );
\r
882 func.call( this, 0 );
\r
888 /* --------------------------------------
\r
889 * Async commit update
\r
899 * root._reserveRemoval = [] に追加。commitUpdate で remove して state は not_added
\r
901 * root._reserveRemoval にいたら消す, new_parent._xnodes に挿入 steta は not_added にして commitUpdate を待つ
\r
904 Node.prototype._reserveUpdate = function(){
\r
905 var root = Node._body;
\r
906 if( root && !root._updateTimerID ) root._updateTimerID = X.Timer.requestFrame( root, root._startUpdate );
\r
909 Node.prototype._startUpdate = function(){
\r
910 var removal, i, xnode, tmp;
\r
911 if( X.Dom.readyState < X.Dom.Event.DOM_INIT ){
\r
914 if( this._updateTimerID ){
\r
915 X.Timer.cancelFrame( this._updateTimerID );
\r
916 this._updateTimerID = 0;
\r
920 // このイベントでサイズを取ると無限ループに
\r
921 // X.Dom._listeners && X.Dom._listeners[ X.Dom.Event.BEFORE_UPDATE ] && X.Dom.dispatch( { type : X.Dom.Event.BEFORE_UPDATE } );
\r
923 removal = Node._reserveRemoval;
\r
925 tmp = this._rawObject.style.visibility;
\r
926 //this._rawObject.style.visibility = 'hidden';
\r
928 //console.log( '_actualRemove().' );
\r
930 if( i = removal.length ){
\r
932 xnode = removal[ --i ];
\r
933 xnode._actualRemove();
\r
934 !this._state && xnode.kill();
\r
936 removal.length = 0;
\r
939 //console.log( 'start _startUpdate().' );
\r
941 Node._html._dirty ? Node._html._commitUpdate() : this._commitUpdate();
\r
943 //console.log( 'end of _startUpdate().' );
\r
945 X.Dom._listeners && X.Dom._listeners[ X.Dom.Event.AFTER_UPDATE ] && X.Dom.asyncDispatch( 0, { type : X.Dom.Event.AFTER_UPDATE } );
\r
946 //this._rawObject.style.visibility = tmp;
\r
949 Node.prototype._commitUpdate =
\r
951 ( function( parentElement, nextElement ){
\r
952 var elm = this._rawObject,
\r
953 xnodes, l, i, frg, next, k, v;
\r
955 if( this._state & X.Dom.State.IE5_DISPLAY_NONE_FIX ){
\r
956 //alert( this._tag + ' ' + !!elm );
\r
957 // filter の効いている要素だけdisplay:none が無視される模様。filter を切ればよい?
\r
958 // 親が、display:none の場合は?
\r
959 elm && elm.parentNode && this._actualRemove();
\r
960 return nextElement;
\r
963 if( !elm || ( parentElement && elm.parentNode !== parentElement ) || ( nextElement && elm.nextSibling !== nextElement ) ){
\r
965 parentElement.insertBefore( this._actualCreate(), nextElement ) :
\r
966 parentElement.appendChild( this._actualCreate() );
\r
967 this._afterActualCreate();
\r
969 return elm || this._rawObject;
\r
971 if( ( xnodes = this._xnodes ) && ( l = xnodes.length ) ) {
\r
973 /*if( elm.childNodes.length !== l && ( frg = X.Dom._useDocumentFragment ) ){
\r
974 for( i = 0; i < l; ++i ){
\r
975 frg.appendChild( xnodes[ i ]._actualCreate( true ) );
\r
977 elm.appendChild( frg );
\r
978 for( i = 0; i < l; ++i ){
\r
979 xnodes[ i ]._afterActualCreate( true );
\r
983 next = xnodes[ --l ]._commitUpdate( elm, next );
\r
988 delete this._fontSize;
\r
989 this._dirty && this._updateRawNode( elm );
\r
990 if( this._state & X.Dom.State.IE5_DISPLAY_NONE_FIX ){
\r
991 return nextElement;
\r
996 ( function( parentElement, prevElement ){
\r
997 var elm = this._rawObject || this._ie4getRawNode(),
\r
998 xnodes, l, i, html, text, prev;
\r
1002 prevElement.insertAdjacentHTML( 'AfterEnd', this._actualCreate() ) :
\r
1003 parentElement.insertAdjacentHTML( 'AfterBegin', this._actualCreate() );
\r
1004 this._afterActualCreate();
\r
1005 return this._rawObject || this._ie4getRawNode();
\r
1008 xnodes = this._xnodes;
\r
1009 l = xnodes ? xnodes.length : 0;
\r
1011 if( this._dirty & X.Dom.Dirty.IE4_TEXTNODE_FIX || ( this._state & X.Dom.State.IE4_ONLY_TEXT && ( l !== 1 || xnodes[ 0 ]._xnodeType !== 3 ) ) ){ // 1 < l && elm.children.length === 0
\r
1013 for( i = 0; i < l; ++i ){
\r
1014 html[ i ] = xnodes[ i ]._actualCreate();
\r
1016 elm.innerHTML = html.join( '' );
\r
1017 for( i = 0; i < l; ++i ){
\r
1018 xnodes[ i ]._afterActualCreate();
\r
1020 this._state &= ~X.Dom.State.IE4_ONLY_TEXT;
\r
1022 if( this._state & X.Dom.State.IE4_ONLY_TEXT ){ // textNode が swap した場合の検出は、_root で行う
\r
1023 text = xnodes[ 0 ];
\r
1024 if( text._dirty || !text._root ){
\r
1025 elm.innerHTML = text._text;
\r
1026 delete text._dirty;
\r
1027 text._root = this._root;
\r
1031 for( i = 0; i < l; ++i ){
\r
1032 prev = xnodes[ i ]._commitUpdate( elm, prev );
\r
1036 delete this._fontSize;
\r
1037 this._dirty && this._updateRawNode( elm );
\r
1042 Node.prototype._updateRawNode =
\r
1044 ( function( elm ){
\r
1045 var attrs, rename, k, v;
\r
1048 if( this._dirty & X.Dom.Dirty.CONTENT ){
\r
1049 elm.data = X.Dom.chrReferanceTo( this._text );
\r
1050 delete this._dirty;
\r
1054 if( this._dirty & X.Dom.Dirty.ID ){
\r
1055 this._id ? ( elm.id = this._id ) : ( elm.id && elm.removeAttribute( 'id' ) );
\r
1058 if( this._dirty & X.Dom.Dirty.CLASSNAME ){
\r
1059 this._className ? ( elm.className = this._className ) : ( elm.className && elm.removeAttribute( X.UA.IE5678 ? 'className' : 'class' ) ); // className は ie7-?
\r
1062 if( X.Dom.State.IE5_DISPLAY_NONE_FIX && elm.currentStyle.display === 'none' ){
\r
1063 this._actualRemove();
\r
1064 this._state |= X.Dom.State.IE5_DISPLAY_NONE_FIX;
\r
1069 // TODO display:none の場合、更新をスキップ
\r
1070 if( this._dirty & X.Dom.Dirty.CSS ){
\r
1071 if( this._cssText !== null || ( this._cssText = X.Dom.Style.objToCssText( this._css ) ) ){
\r
1072 X.UA.Opera78 || X.UA.NN6 ?
\r
1073 elm.setAttribute( 'style', this._cssText ) : // opera8用
\r
1074 ( elm.style.cssText = this._cssText );
\r
1076 elm.style.cssText = ''; // IE5.5以下 Safari3.2 で必要
\r
1077 elm.removeAttribute( 'style' );
\r
1078 delete this._cssText;
\r
1082 if( this._dirty & X.Dom.Dirty.IE_FILTER ){
\r
1083 elm.style.filter = X.Dom.Style.SPECIAL_FIX( this._css );
\r
1087 // TODO display:none の場合、更新をスキップ
\r
1088 if( this._dirty & X.Dom.Dirty.ATTR && ( attrs = this._newAttrs || this._attrs ) ){
\r
1089 rename = X.Dom.Attr.renameForDOM;
\r
1090 for( k in attrs ){
\r
1091 if( !X.UA.MacIE && 5 <= X.UA.IE && X.UA.IE < 6 ){ // IETester 5.5 ではエラーが出なかった.MultipulIE5.5 ではエラーが出たので
\r
1092 if( this._tag === 'TEXTAREA' && k === 'value' ){
\r
1094 ( elm.firstChild.data = attrs[ k ] ) :
\r
1095 elm.appendChild( document.createTextNode( attrs[ k ] ) );
\r
1099 // TODO IE では input, なぜか buttonも、type の変更が出来ない、k === 'type' && alert( this._dirty + ' ' + elm.outerHTML );
\r
1100 ( v = attrs[ k ] ) === undefined ?
\r
1101 elm.removeAttribute( rename[ k ] || k ) :
\r
1102 ( elm[ rename[ k ] || k ] = X.Dom.Attr.noValue[ k ] ? k : v );
\r
1105 delete this._newAttrs;
\r
1108 delete this._dirty;
\r
1111 ( function( elm ){
\r
1112 var attrs, rename, k, v;
\r
1115 if( this._dirty & X.Dom.Dirty.CONTENT ){
\r
1116 elm.innerText = this._text;
\r
1117 delete this._dirty;
\r
1122 * http://www.tohoho-web.com/js/element.htm
\r
1123 * title、className、id、lang、language には setAttribute でなく、element.id で直接読み書きできる
\r
1126 if( this._dirty & X.Dom.Dirty.CONTENT ) elm.setAttribute( 'id', this._id || ( 'ie4uid' + xnode._uid ) );
\r
1129 if( this._dirty & X.Dom.Dirty.CLASSNAME ){
\r
1130 this._className ? ( elm.className = this._className ) : elm.removeAttribute( 'class' );
\r
1133 if( this._dirty & X.Dom.Dirty.CSS ){
\r
1134 if( this._cssText !== null || ( this._cssText = X.Dom.Style.objToCssText( this._css ) ) ){
\r
1135 elm.style.cssText = this._cssText;
\r
1137 elm.style.cssText = '';
\r
1138 elm.removeAttribute( 'style' );
\r
1139 delete this._cssText;
\r
1143 if( this._dirty & X.Dom.Dirty.IE_FILTER ){
\r
1144 this._rawObject.style.filter = X.Dom.Style.SPECIAL_FIX( this._css );
\r
1148 if( this._dirty & X.Dom.Dirty.ATTR && ( attrs = this._newAttrs || this._attrs ) ){
\r
1149 rename = X.Dom.Attr.renameForDOM;
\r
1150 for( k in attrs ){
\r
1151 ( v = attrs[ k ] ) === undefined ?
\r
1152 elm.removeAttribute( rename[ k ] || k ) :
\r
1153 elm.setAttribute( rename[ k ] || k, v ); // TODO X.Dom.Attr.noValue
\r
1155 delete this._newAttrs;
\r
1158 delete this._dirty;
\r
1162 /* --------------------------------------
\r
1165 * http://d.hatena.ne.jp/uupaa/20080718/1216362040
\r
1166 * DOM Rangeが使える環境(Firefox2+,Opera9+,Safari3+)なら、innerHTMLいらずで、ガーって書けます。
\r
1167 * return document.createRange().createContextualFragment("<div><select><option></option></select></div>");
\r
1168 * insertAdjacentHTML
\r
1170 * ie7 以下では iframe の frameborder や、input name は、createElement 後に setAttribute しても無視される
\r
1172 * fragument がある場合 children も足して
\r
1173 * Mozilla: 1.0+, IE: 5.5+, Netscape: 2.0+, Safari: 1.0+, Opera: 7.0+
\r
1174 * ie6 大丈夫?fragment の場合リークしないか?チェックが必要
\r
1175 * http://msdn.microsoft.com/ja-jp/library/bb250448%28v=vs.85%29.aspx
\r
1177 * document.createElement of ie4 is only for OPTION & IMAGE.
\r
1179 Node.prototype._actualCreate =
\r
1180 X.Dom.DOM_W3C ? (function( isChild ){
\r
1181 var elm = this._rawObject,
\r
1182 xnodes, frg, i, l;
\r
1184 if( this._xnodeType === 3 ){
\r
1185 if( elm ) return elm;
\r
1186 delete this._dirty;
\r
1187 return this._rawObject = document.createTextNode( X.Dom.chrReferanceTo( this._text ) );
\r
1191 if( this._dirty & X.Dom.Dirty.CSS && !( this._cssText = X.Dom.Style.objToCssText( this._css ) ) ){
\r
1192 delete this._cssText;
\r
1194 this._isNew = true;
\r
1195 this._rawObject = elm =
\r
1196 X.Dom._strictElmCreation ?
\r
1197 document.createElement( [
\r
1199 ' UID="', this._uid, '"',
\r
1200 this._id ? ' id="' + this._id + '"' : '',
\r
1201 this._className ? ' class="' + this._className + '"' : '',
\r
1202 this._attrText === false ? ( this._attrText = X.Dom.Attr.objToAttrText( this._attrs ) ) : this._attrText,
\r
1203 this._cssText ? ' style="' + this._cssText + '"' : '',
\r
1204 '>' ].join( '' ) ) :
\r
1205 document.createElement( this._tag );
\r
1207 if( X.Dom._useDocumentFragment ){
\r
1208 if( ( xnodes = this._xnodes ) && ( l = xnodes.length ) ){
\r
1209 !isChild && ( frg = X.Dom._useDocumentFragment ).appendChild( elm );
\r
1210 for( i = 0; i < l; ++i ){
\r
1211 elm.appendChild( xnodes[ i ]._actualCreate( true ) );
\r
1213 return frg || elm;
\r
1219 X.Dom.DOM_IE4 ? (function( isChild ){
\r
1220 var uid = this._uid,
\r
1221 html, xnodes, n, i, l;
\r
1223 if( this._xnodeType === 3 ){
\r
1224 html = [ '<FONT id=ie4uid', uid, ' UID="', uid, '">', this._text, '</FONT>' ];// fake textNode
\r
1225 delete this._rawObject;
\r
1227 if( this._rawObject && !isChild ) this._actualRemove( true );
\r
1229 if( this._dirty & X.Dom.Dirty.CSS && !( this._cssText = X.Dom.Style.objToCssText( this._css ) ) ){
\r
1230 delete this._cssText;
\r
1234 '<', this._tag, ' id=', ( this._id || ( 'ie4uid' + uid ) ), ' UID="', uid, '"',
\r
1235 this._className ? ' class="' + this._className + '"' : '',
\r
1236 this._attrText === false ? ( this._attrText = X.Dom.Attr.objToAttrText( this._attrs ) ) : this._attrText,
\r
1237 this._cssText ? ' style="' + this._cssText + '"' : '',
\r
1241 if( ( xnodes = this._xnodes ) && ( l = xnodes.length ) ){
\r
1242 if( l === 1 && xnodes[ 0 ]._xnodeType === 3 ){
\r
1244 html[ n ] = xnodes[ 0 ]._text;
\r
1246 this._state |= X.Dom.State.IE4_ONLY_TEXT;
\r
1248 for( i = 0; i < l; ++i ){
\r
1249 html[ n ] = xnodes[ i ]._actualCreate( true );
\r
1254 X.Dom.DTD.EMPTY[ this._tag ] || ( html[ n ] = '<\/' + this._tag + '>' );
\r
1256 delete this._newAttrs;
\r
1259 return html.join( '' );
\r
1263 Node.prototype._afterActualCreate =
\r
1264 X.Dom.DOM_W3C ? (function(){
\r
1265 var elm = this._rawObject, xnodes, l, attrs, k, i;
\r
1267 this._root = this.parent._root;
\r
1269 if( this._xnodeType === 3 ){
\r
1270 this._dirty && this._updateRawNode( elm );
\r
1274 xnodes = this._xnodes;
\r
1275 l = xnodes && xnodes.length;
\r
1277 if( this._isNew ){
\r
1278 if( !X.Dom._useDocumentFragment && l ){// docFrg が使えない場合、doc 追加後に子を追加
\r
1279 for( i = 0; i < l; ++i ){
\r
1280 elm.appendChild( xnodes[ i ]._actualCreate( true ) );
\r
1283 if( !X.Dom._strictElmCreation ){
\r
1284 elm.UID = this._uid;
\r
1285 this._newAttrs = this._attrs;
\r
1286 this._dirty = X.Dom.Dirty.ID | X.Dom.Dirty.CLASSNAME | X.Dom.Dirty.CSS | X.Dom.Dirty.ATTR | X.Dom.Dirty.IE_FILTER;
\r
1287 this._updateRawNode( elm );
\r
1289 if( this._dirty & X.Dom.Dirty.IE_FILTER ){
\r
1290 elm.style.filter = X.Dom.Style.SPECIAL_FIX( this._css );
\r
1291 delete this._dirty;
\r
1294 delete this._isNew;
\r
1296 this._dirty && this._updateRawNode( elm );
\r
1300 for( i = 0; i < l; ++i ){
\r
1301 xnodes[ i ]._afterActualCreate();
\r
1304 // src の onload があるので先ではないか?
\r
1305 // ie の str から要素を作る場合、srcだけ イベント設定後ではないか?
\r
1306 X_EventDispatcher_restoreEvent( this );// イベントの復帰
\r
1308 X.Dom.DOM_IE4 ? (function(){
\r
1310 this._root = this.parent._root;
\r
1312 if( this._xnodeType !== 1 ) return this;
\r
1314 if( ( xnodes = this._xnodes ) && ( i = xnodes.length ) ){
\r
1316 xnodes[ --i ]._afterActualCreate();
\r
1319 // textarea への value の適用はここで
\r
1320 if( this._dirty & X.Dom.Dirty.IE_FILTER ){
\r
1321 this._ie4getRawNode().style.filter = X.Dom.Style.SPECIAL_FIX( this._css );
\r
1323 delete this._dirty;
\r
1324 X_EventDispatcher_restoreEvent( this );// イベントの復帰
\r
1328 Node.prototype._actualRemove =
\r
1330 ( function( isChild ){
\r
1331 var xnodes = this._xnodes,
\r
1332 elm = this._rawObject,
\r
1334 if( xnodes && ( l = xnodes.length ) ){
\r
1335 for( i = 0; i < l; ++i ){
\r
1336 child = xnodes[ i ];
\r
1337 child._xnodeType === 1 && child._actualRemove( true );
\r
1341 if( !elm ) return;
\r
1342 this._xnodeType === 1 && X_EventDispatcher_migrateEvent( this );// イベントの退避
\r
1343 // elm.parentNode.tagName for ie7
\r
1344 if( !X.UA.MacIE ){
\r
1345 !isChild && elm.parentNode && elm.parentNode.tagName && elm.parentNode.removeChild( elm );
\r
1347 !isChild && elm.parentNode && elm.parentNode.tagName && X.Dom._fixed_remove( elm, this );
\r
1351 ( function( isChild ){
\r
1352 var xnodes = this._xnodes,
\r
1353 elm = this._rawObject || this._ie4getRawNode(),
\r
1355 if( xnodes && ( l = xnodes.length ) ){
\r
1356 for( i = 0; i < l; ++i ){
\r
1357 xnodes[ i ]._actualRemove( true );
\r
1361 if( !elm ) return;
\r
1362 this._xnodeType === 1 && X_EventDispatcher_migrateEvent( this );// イベントの退避
\r
1364 if( X.Dom.Attr.HAS_VALUE[ this._tag ] && ( !this._newAttrs || !X.inObject( 'value', this._newAttrs ) ) ){
\r
1365 this._attrs.value = elm.value;
\r
1367 elm.removeAttribute( 'id' ); // ?
\r
1368 //document.all[ this._id || ( 'ie4uid' + this._uid ) ] = null; // MacIE5 でエラー
\r
1369 if( !isChild ) elm.outerHTML = '';
\r
1370 delete this._rawObject;
\r
1374 console.log( 'X.Dom.Node' );
\r