отредактируйте данные ajax перед добавлением их в html

Question

Привет, возможно ли редактировать содержимое запроса GET ajax перед добавлением его к содержимому страницы?

Я получаю содержимое тела новой html-страницы и хотел бы добавить несколько классов:).

Это, вероятно, невозможно,

спасибо за помощь!

Answer 1

Это точно не невозможно. Вам просто нужен способ разобрать это. Самый простой способ сделать это - добавить его на страницу в скрытом контейнере, а затем выполнить любые необходимые вам манипуляции с DOM. Тогда вы можете просто переместить HTML или показать его, если он находится в нужном месте.

Если вы используете jQuery, вы можете фактически выполнить любую из операций jQuery над возвращаемой строкой html. Однако в некоторых старых браузерах это немного менее эффективно.

Answer 2

Способ сделать это без jquery - использовать document.createDocumentFragment

ajax({ //Your preferred method
    done: function(response){
        var myDom = document.createDocumentFragment();
        myDom.innerHTML = response.responseText;
        // your manipulations same as you would with "document"
        document.appendChild(myDom);
    }
});

Ресурсы:

• MDN - createDocumentFragmant
• W3C Spec

Answer 3

Если вы используете jQuery, вы можете попробовать следующее (обратите внимание, что это может быть очень ресурсоемким, в зависимости от размера загруженной страницы):

$.ajax({
    /*parameters here*/
    success: function(data,textStatus){
        processData(data);
    }
});

function processData(data){
    //this line creates jQuery object that contains DOM model for loaded page
    var page = jQuery(data); 

    page.find('#id-of-element-to-add-some-class').addClass('*your class*');
    page.find('#table').addClass('myTable'); //adds class myTable to all tables in the document
    //placeholder for loaded page content. Could be something like $('#placeholder')
    var target_element = document; 

    $(target_element ).append(page);
}

Подробнее см. jQuery.ajax