Work with AJAX response using DOM methods

I am extracting the entire HTML document through AJAX - and this works fine. But I need to extract certain parts of this document and do something with them.

Using a framework (jquery, mootools, etc.) is not an option.

The only solution I can think of is to capture the body of the HTML document using regex (yes, I know, awful), i.e. <body>(.*)</body>put this in the current DOM page in a hidden element and work with it from there.

Is there an easier / better way?

Update

I did some testing, and pasting the entire HTML document into the created element behaves differently in the browsers I tested. For instance:

  • FF3.5: Saves the contents of the HEAD and BODY tags
  • IE7 / Safari4: includes only what is between ...
  • Opera 10.10: stores HEAD and everything inside, stores the contents of BODY

The behavior of IE7 and Safari is perfect, but different browsers do it differently. Since I am loading a predefined HTML document, I think I'm going to use regEx to capture what I want and paste it into the DOM element - unless anyone has other suggestions.

+3
source share
1 answer

Elements may exist without being on the page itself. Just upload the HTML into a dummy div.

var wrapper = document.createElement('div');
wrapper.innerHTML = "<ul><li>foo</li><li>bar</li></ul>";
wrapper.getElementsByTagName('li').length; // 2

Given your changes, we are faced with a sticky situation, as you want getElementById. The case would probably be easy if you could just create a new virtual document through document.implementation.createDocument, but IE does not support this at all.

- , , - <body><input value="</body>" /></body>? , , </body>, , . , , , - Sizzle, ​​, jQuery, . , , - , - ?

var response_el = document.createElement('html'), foo;
response_el.innerHTML = the_html_elements_content;
foo = Sizzle('#foo', response_el);
+5

Source: https://habr.com/ru/post/1748406/


All Articles