Trying to Read and Write Image Elements from Javascript

I’m brand new to this feature on wix, but I’m a veteran at JS and html
1: I want to be able to change the .src of an Image
My normal code would be
document.getElementById(“image”).src = “mywebsite.com”;

2: I want to be able to read the textcontent of an HTML element
My normal code would be
var orange = document.getElementById(“page”).textContent;

Both say that “document” is undefined
Please Help, also is there a way to put custom html code on the website without the iFrame?

Hi, Matthew.

Would the following work for you:

For 1:

$w(“#image”).src = " mywebsite.com ";

For 2:

var orange = $w(“#page”).textContent;

?

(cf. Wix Editor Elements ($w) - Velo API Reference - Wix.com)

You can set the src of a $w.Image like this:
$w(“#myElement”).src = “http://placehold.it/250x250”;

To get the text of a $w.Text , you do this:
let value = $w(“#textElement”).text // “Text Value”

It’s like this…

WixCode understands all of Javascript, except for anything that accesses the DOM. This keeps the user from inadvertently “breaking” something. I myself tried to hack things from the code, from an iFrame and in my dreams, but WixCode wasn’t having any of it.

Accessing document elements such as div, span, button, etc is off-limits. The way to access elements on the page is only through $w.

One small exception is the $w.HtmlComponent (which is based on an iFrame). This element was designed to contain vanilla HTML and it works just fine. You just can’t try to trick it by using parent, window, top, etc. Same goes with the Javascript evaluate() function. It is sandboxed and does not allow access to the DOM.