Extjs3.0 DomHelper Bug
Ext.apply(Ext.DomHelper,
function(){
var pub,
afterbegin = 'afterbegin',
afterend = 'afterend',
beforebegin = 'beforebegin',
beforeend = 'beforeend';
// private
function doInsert(el, o, returnElement, pos, sibling, append){
el = Ext.getDom(el);
var newNode;
// , , useDom=true 。
if (pub.useDom) {
// Ext.DomHelper.useDom
newNode = createDom(o, null);
if (append) {
el.appendChild(newNode);
} else {
(sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
}
} else {
newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
}
return returnElement ? Ext.get(newNode, true) : newNode;
}
// build as dom
/** @ignore */
function createDom(o, parentNode){
var el,
doc = document,
useSet,
attr,
val,
cn;
if (Ext.isArray(o)) { // Allow Arrays of siblings to be inserted
el = doc.createDocumentFragment(); // in one shot using a DocumentFragment
Ext.each(o, function(v) {
createDom(v, el);
});
} else if (Ext.isString(o)) { // Allow a string as a child spec.
el = doc.createTextNode(o);
} else {
el = doc.createElement( o.tag || 'div' );
useSet = !!el.setAttribute; // In IE some elements don't have setAttribute
Ext.iterate(o, function(attr, val){
if(!/tag|children|cn|html|style/.test(attr)){
if(attr == 'cls'){
el.className = val;
}else{
if(useSet){
el.setAttribute(attr, val);
}else{
el[attr] = val;
}
}
}
});
pub.applyStyles(el, o.style);
if ((cn = o.children || o.cn)) {
createDom(cn, el);
} else if (o.html) {
el.innerHTML = o.html;
}
}
if(parentNode){
parentNode.appendChild(el);
}
return el;
}
pub = {
/**
* Creates a new Ext.Template from the DOM object spec.
* @param {Object} o The DOM object spec (and children)
* @return {Ext.Template} The new template
*/
createTemplate : function(o){
var html = Ext.DomHelper.createHtml(o);
return new Ext.Template(html);
},
/** True to force the use of DOM instead of html fragments @type Boolean */
useDom : false,
/**
* Applies a style specification to an element.
* @param {String/HTMLElement} el The element to apply styles to
* @param {String/Object/Function} styles A style specification string e.g. 'width:100px', or object in the form {width:'100px'}, or
* a function which returns such a specification.
*/
applyStyles : function(el, styles){
if(styles){
var i = 0,
len,
style;
el = Ext.fly(el);
if(Ext.isFunction(styles)){
styles = styles.call();
}
if(Ext.isString(styles)){
styles = styles.trim().split(/\s*(?::|;)\s*/);
for(len = styles.length; i < len;){
el.setStyle(styles[i++], styles[i++]);
}
}else if (Ext.isObject(styles)){
el.setStyle(styles);
}
}
},
/**
* Creates new DOM element(s) and inserts them before el.
* @param {Mixed} el The context element
* @param {Object/String} o The DOM object spec (and children) or raw HTML blob
* @param {Boolean} returnElement (optional) true to return a Ext.Element
* @return {HTMLElement/Ext.Element} The new node
* @hide (repeat)
*/
insertBefore : function(el, o, returnElement){
return doInsert(el, o, returnElement, beforebegin);
},
/**
* Creates new DOM element(s) and inserts them after el.
* @param {Mixed} el The context element
* @param {Object} o The DOM object spec (and children)
* @param {Boolean} returnElement (optional) true to return a Ext.Element
* @return {HTMLElement/Ext.Element} The new node
* @hide (repeat)
*/
insertAfter : function(el, o, returnElement){
return doInsert(el, o, returnElement, afterend, 'nextSibling');
},
/**
* Creates new DOM element(s) and inserts them as the first child of el.
* @param {Mixed} el The context element
* @param {Object/String} o The DOM object spec (and children) or raw HTML blob
* @param {Boolean} returnElement (optional) true to return a Ext.Element
* @return {HTMLElement/Ext.Element} The new node
* @hide (repeat)
*/
insertFirst : function(el, o, returnElement){
return doInsert(el, o, returnElement, afterbegin, 'firstChild');
},
/**
* Creates new DOM element(s) and appends them to el.
* @param {Mixed} el The context element
* @param {Object/String} o The DOM object spec (and children) or raw HTML blob
* @param {Boolean} returnElement (optional) true to return a Ext.Element
* @return {HTMLElement/Ext.Element} The new node
* @hide (repeat)
*/
append: function(el, o, returnElement){
return doInsert(el, o, returnElement, beforeend, '', true);
},
/**
* Creates new DOM element(s) without inserting them to the document.
* @param {Object/String} o The DOM object spec (and children) or raw HTML blob
* @return {HTMLElement} The new uninserted node
*/
createDom: createDom
};
return pub;
}());
//틀렸습니다. 패키지를 닫았기 때문에 외부에 useDom=true를 설정할 수 없습니다.if(pub.useDom) {//는 Ext.DomHelper.useDom이어야 합니다.
Ext.DomHelper를 설정해야 하는 경우도 있습니다.useDom =true
예:
Ext.DomHelper 추가 옵션 문제
지금 Extjs 3.0 설정이 잘못되었습니다.
또한 ext-core 3.0과 extjs 3.0의 완전 버전과 같은 기능의 코드 구현이 약간 다르다는 것을 발견했다. 예를 들어 ext-core 3.0 DomHelper는 상술한 코드가 전혀 없다. 즉, core는dom방식을 사용할 수 없다. 마치 core는 완전 버전의 간소화 강등 형식인 것 같다. 너무 불쾌하다!많은 유용한 기초 함수들이 코어에서 삭제되었는데, 완전 버전도 있고, 보아하니 자신의 코어를 맞춤형으로 만들어야 할 것 같다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다른 사람의 웹사이트 편집: contenteditable 및 designMode그래도 우리가 그렇게 할 수 있다고 생각하는 것은 멋진 일입니다. 제가 강조하고 싶었던 일종의 관련 API가 실제로 몇 개 있기 때문에 오늘 그것을 가져왔습니다. contenteditable는 "true" 값이 할당...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.