Selecting elements from an HTML string


#1

Hello,

First of all, thanks for your great work with Framework7. You make possible that I can develop an App with a short knowledge of programming.

I am trying to make an App for having a movie collection on your phone. And I want to get the movie information from IMDB. This web doesn’t have and API (or at least it is now available for everyone) and have TSV files that I don’t know how to use.

So I decided to scrap the web getting the HTML and selecting elements from the webpage.

Now I am trying to write the code for the SEARCH function:

function SearchResults() {
  //--- Get the string to search and the searchby option.
  var formData = app.form.convertToData('#Search-form');
  console.log(JSON.stringify(formData));
  //--- the search string has to replace the spaces with '+'.
  var search = formData.search.replace(/\s/g, '+');
  var URL = 'http://www.imdb.com/find?ref_=nv_sr_fn&q=' + search + '&s=' + formData.searchby;
  console.log(URL);
  app.request.get(URL, function (data) {
    //--- Convert the string into an HTML string.
    var dataHTML = document.createElement('div');
    dataHTML.innerHTML = data;
    console.log(dataHTML);
  });
  //--- And now get the information you want and append it to search.html page.
}

However, I can not manage to find elements inside the html string to append them to my app. And I don’t know if it is better to search html elements or to search text strings.

May be you can help me with that.

thanks


#2

Check the console if there is any error with access-control-allow-origin


#3

There is no problem.

The object “data” and “dataHTML” are ok, but I don’t know how to search and append elements to my app.


#4

It is hard to search for elements in string. Do it using Dom7:

var someHtmlString = '<div class="one"></div><div id="foo"></div>'
var tempDom = $$(someHtmlString);
var one = tempDom.find('.one');
var foo = tempDom.find('#foo');

#5

Thank you very much.

I did that way and it worked perfectly.

Thanks.


#6

I don’t know why but I get this to work:

var resultImages = dataHTML.getElementsByClassName('primary_photo');
console.log('Resultado de las imágenes de la búsqueda:');
console.log(resultImages);

But I get an error when trying this:

var resultImages = dataHTML.find('.primary_photo');
console.log('Resultado de las imágenes de la búsqueda:');
console.log(resultImages);

And the JavaScript file has in the beginning:
$$=Dom7
var app = new Framework7({…

Don’t know why it doesn’t work.