Cannot assign to function call

Question

I'm new in learning JavaScript. Just for some test I built this function and call it and assign a variable in it to a complete result. Is there a way use the function like this example?

Here I want to just pass #country in the dom(i) function. So it should be getElementById("maid"), and after calling it, assign = maid to put this maid variable after innerHTML =.

I'm wondering is it possible to write JavaScript function like this way?

var maid = "Made In Yiappa";
function dom(i) {
    var docs = document.getElementById(i).innerHTML;
    return docs;
}
dom("country") = maid;

<p> The result is: <span id="country"></span> </p>

Answer 1

You can’t assign a value to the result of a function call. You need to pass it as a function argument.

var maid = "Made In Yiappa";
function dom(i, text) {
    document.getElementById(i).innerHTML = text;
}
dom("country", maid);

<p> The result is: <span id="country"></span> </p>

Answer 2

1. The key issue is that you're returning the value of the innerHTML property from the function but you can't then assign a string to it because innerHTML can only be set when it's attached to an element.

2. querySelector maybe a better method choice. You can then pass in your #country selector as you mentioned in your question.

3. So, we can remove some of the functionality from the function, and just have it return the element using the selector. Then we can assign main to the innerHTML of that returned element (although innerText might be more appropriate).

var maid = 'Made In Yiappa';

function dom(selector) {
  return document.querySelector(selector);
}

dom('#country').innerText = maid;

<p> The result is: <span id="country"></span> </p>

Answer 3

I’m not entirely sure that stackDB answers here is completely correct, but I am willing to be shown otherwise. The reasons being

1. No closure is created here as no function has been returned nor called by an event listener. I know all functions close over variables within the outer scope, but this could create confusion to the OP of the general use of a closure. I.e., a returned inner function using a local variable inside the function even after the outer function has finished execution.

2. You state the OP must assign the function to a variable. This too I believe is not accurate. A function declaration will do the job here, a function expression in this case is optional. Again this may create confusion to the OP’s understanding of hoisting and differences between function declarations and expressions.

Unfortunately I am not in a position to write code for the OP.