Как получить ТОЛЬКО структуру DOM страницы, используя jQuery $ .get ()

Question

Использование jQuery 1.7.3

Я недавно заменил $.load(); вызов на $.get(); в одном из моих сценариев, чтобы воспользоваться возможностью прерывания запроса и другими интересными функциями - поэтому я скорее запрашиваю обычную (в данном случае php) страницу HTML чем файл, который возвращает JSON или XML.

Но я заметил, что ошибка скрипта на странице, которую вы загружаете - например, onError='myFunction(this);' встроенные скрипты, которые вызывают функцию, не определенную на странице 1, но присутствующую на странице 2, могут вызвать ошибку (в данном случае undefined function myFunction) на стр. 1. Также я вижу, что изображения также запрашиваются.

Мой пример использования: мне нужно количество данных с новой страницы, а не вся информация и, конечно, не изображения - есть ли способ заставить jQuery запрашивать только разметку, а не «переходить» по ссылкам на изображения и не пытаетесь запустить какие-либо встроенные сценарии?

Пример:

Page1:
$.get('page2', {someData:123}, function(data){
    var myDiv = $('#myDiv', data); //get the div I want from the response

    //but at this point the browser has run the inline 
    //scripts and requested the images :(
    //do something with the (very expensive) data

    $('body').append(myDiv);
});

Page2:
<div id='myDiv'>
  <!-- some dynamic data that changes over time -->
</div>

Есть некоторые опасения относительно того, должен ли я просто написать (еще один) файл, который я могу запросить с помощью JSON, чтобы получить необходимые мне данные, затем проанализировать их в сценарии и сгенерировать разметку и т. Д., Но этого достаточно, чтобы сказать в этом случай использования, который принесет гораздо больше хлопот, чем стоит, особенно если учесть, что я тоже буду копировать код.

Что касается встроенных сценариев, я могу (и имею в качестве обходного пути) просто определить функцию на странице1, чтобы избежать ошибки.

Любая помощь приветствуется

Answer 1

Вы пытались выполнить запрос ajax с $.ajax() и установить dataType на text?http://api.jquery.com/jQuery.ajax/

Answer 2

Вы можете исключить узлы из селектора:

var myDiv = $(data).find('#myDiv').find('*').not('img, script');

http://api.jquery.com/not/

Answer 3

Лучший способ сделать это, который я в итоге нашел, довольно прост - когда вы отправляете AJAX-запрос на страницу, отправьте дополнительный параметр, который не дает вашей странице выводить ненужные вам данные.

Page1:
$.get('page2', {someData:123, ajax:true}, function(data){
    var myDiv = $('#myDiv', data); //get the div I want from the response
    $('body').append(myDiv);
});

Page2:
<?php if (isset($_GET['ajax'])) { ?>
  <div id='myDiv'>
    <!-- some dynamic data that changes over time -->
  </div>
  <?php exit(); ?>
<?php } else { ?>
  //show the page as normal
<?php } ?>

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