JQuery конвертировать DOM-элемент в другой тип - PullRequest
10 голосов
/ 05 февраля 2010

Мне нужно преобразовать элемент DOM в другой тип (как, например, в имени тега HTML, в данном случае от a до p), но при этом сохранить все атрибуты исходных элементов. Действительны ли они для нового типа или нет, в данном случае не имеет значения.

Есть предложения, как это сделать?

Я смотрел только на создание нового элемента и копирование атрибутов, но это не без его собственных сложностей. В Firefox DOMElement.attributes содержит только атрибуты со значением, но в IE он сообщает обо всех возможных атрибутах для этого элемента. Само свойство attributes доступно только для чтения, поэтому скопировать его невозможно.

Ответы [ 2 ]

4 голосов
/ 05 февраля 2010

Решение Sans-jQuery:

function makeNewElementFromElement( tag, elem ) {

    var newElem = document.createElement(tag),
        i, prop,
        attr = elem.attributes,
        attrLen = attr.length;

    // Copy children 
    elem = elem.cloneNode(true);
    while (elem.firstChild) {
        newElem.appendChild(elem.firstChild);
    }

    // Copy DOM properties
    for (i in elem) {
        try {
            prop = elem[i];
            if (prop && i !== 'outerHTML' && (typeof prop === 'string' || typeof prop === 'number')) {
                newElem[i] = elem[i];
            }
        } catch(e) { /* some props throw getter errors */ }
    }

    // Copy attributes
    for (i = 0; i < attrLen; i++) {
        newElem.setAttribute(attr[i].nodeName, attr[i].nodeValue);
    }

    // Copy inline CSS
    newElem.style.cssText = elem.style.cssText;

    return newElem;
}

Е.Г.

makeNewElementFromElement('a', someDivElement); // Create anchor from div
3 голосов
/ 05 февраля 2010

хотя и не является полным решением, логика в основном будет:

Сохраните существующий элемент:

var oldElement = $(your selector here);

создайте новый элемент и вставьте его непосредственно перед или после вашего oldElement

скопировать атрибуты

  oldElement.attr().each(function(){
    copy old
    });

еще лучше, вот пример плагина, который делает именно то, что вы хотите:

http://plugins.jquery.com/project/getAttributes

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...