How to access elements from another HTML page?

Question

I'm trying to access the elements on my profile page in a web code of mine. I'm currently using an iframe to try and achieve this by linking my profile url to the iframe and trying to access the elements with "contentWindow".

I don't want to modify my profile page, I just want to get data from my profile and store it in variables for use on my code. Below you can find a link to my code and see what I've attempted so far. I get a permissions error when I run the code.

'Error: Permission denied to access property "document"'

I would like to know how I can work around this. https://code.sololearn.com/W8J1a6ckeD2W/#html

Answer 1

like this?

https://code.sololearn.com/W6f4L3q0CFKI/?ref=app

Answer 2

can i see your app code?

Answer 3

sure thing

figured you meant on the SL app.

care to elaborate on the error tho?

Answer 4

and it works on the SL website?

take into consideration that its a callback
so pass a callback function which handles the fata received from the response

Answer 5

sure

imagine this scenario:
you search for a product in a website
you input the keyword to search and hit Search

at this point the client makes a request to an API which receives the keyword, makes some query to a database, and sends the results back to you (the client)

the results are then displayed on the screen
but what happened in the time right after hitting Search?

well, nothing much
the request is what called a Promise

it waits for the reply from the server, and once the reply is received, some actions are taken (a function is called for example)

Answer 6

i'll right a small code to illustrate it better

Answer 7

this is very simplified
haven't use an actual Promise object here

just a demo of what is a callback function

https://code.sololearn.com/WLDsH1CGkpB7/?ref=app

Answer 8

sure thing 👌

updated the code a bit if you'd like to check it again

Answer 9

lol just did, it's funny 😂

Answer 10

Thank you for those (Burey) who helped me here, this is the code I've been working on.
https://code.sololearn.com/W8yx1kn73QDI/?ref=app

Answer 11

That's perfect Burey 😆😆 it doesn't work on my app however but it's exactly what I want to do.

I'll just have to compromise and make my code to be viewed from browsers instead.

Thanks a lot.

Answer 12

I'm still working on it but will definitely let you know as soon as it's completed. ☺ You won't be disappointed.

Answer 13

By app, I meant the Sololearn app Burey

Answer 14

Thank you Burey, I think I get the idea now. A code would be appreciated too. ☺

Answer 15

Thanks again Burey for all the help. ☺ Will study your first code and apply this idea as well to overcome any errors.

Answer 16

The domain for my code is:
-code.sololearn.com

The domain in my iframe is:
-sololearn.com

I can use this code to make the domain of my code the same as the domain in iframe:
-document.domain="sololearn.com"

It executes correctly but I still get the permission error even when the domains are the same.

Answer 17

The error I get when I run your code via the Sololearn app is:

Uncaught TypeError: Cannot call method 'querySelector' of null
Line: 8

Answer 18

I believe it's because of my phone, it uses Android KitKat. Samsung S4 mini

Answer 19

Yes it works fine through the Chrome browser app on my phone

Answer 20

A callback function, could you give an example Burey.