Web context & Java Script

OL Connect Professional Designer
1

Hi, (I’m newbie in js and web context)

I try to make document.getElementById(‘dzis’).innerHTML = ‘example’; (this is in JavaScripts\file.js)

In source tab I have

<div id='dzis'>abc</div>

On Live tab I don’t see “example” :frowning:
Event Details i get: TypeError: document.getElementById(…) is null

It is Web context (Designer 2019.2) What do I do wrong?

2

Hi @wowersla,

I suppose that you would like to change the content of a certain HTML element which does have “dzis” as ID, isn’t it? If so, please use a Standard Script which does have the following settings for example instead:

Name: Example
Selector: #example
JavaScript code:

// results.text("example");
results.html("<span>Example</span>");

Result (Source mode):

<!-- result of 'results.text("example");' -->
<!-- <p id="example">
    Example
</p> -->

<!-- result of 'results.html("<span>Example</span>");' -->
<p id="example">
    <span>Example</span>
</p>
3

Thank you for advice, but I particularly want to set sth via js script from JavaScripts. I can make it as you suggest, but can’t from js :frowning:

Any help?

4

The best option to avoid errors is to execute the JavaScript code when the document is ready. For this you can make use of the jQuery method:

$(document).ready(function () {
    // Place here your JavaScript code...
});

Or the pure JavaScript method:

(function () {
    // Place here your JavaScript code...
})();
5

I found resolution:
Properties of file.js → Defer - check this box!
“Defer postpones the execution of the script until the page has finished parsing.”