javascript in html

Question

i am using javascript to change the text of div tag on run time.

how can this be done..

my div tag is as:

<div id="topdiv" style="color:Blue" onmouseover="button1();">
    <input type="button" id="btndiv"  onclick="edit1();"/>
     Div Tag
    </div>

i wnt the user to input text on runtime in div and that should be displayed in div. can someone help me..

Answer 1

It should be innerHTML. innerHTM is not a javascript function.

Answer 2

1. You don't get a magic variable just by having an element with an id. var something = document.getElementById('some-id')
2. The property is called innerHTML not innerHTM
3. innerHTML is a string variable not an function. Assign a value to it with =, don't try to call it with ()

Answer 3

function edit1() {
    alert('you are in edit1');
    document.getElementById('topdiv').innerHTML = 'hello';
}

and with proper error handling:

function edit1() {
    alert('you are in edit1');
    var topDiv = document.getElementById('topdiv');
    if (topDiv != null) {
        topDiv.innerHTML = 'hello';
    } else {
        alert('topdiv is nowhere to be found in this DOM');
    }
}

Answer 4

Try document.getElementById('topdiv').innerHTML = "Hello"

Answer 5

To get the div you should use document.getElementById('topdiv'). There is indeed a WebKit feature, that elements with an ID are automatically expanded as global variables, but it's highly questionable, that this becomes mainstream.

Then, innerHTM should read innerHTML, and you assign directly:

foo.innerHTML = "hi there"

Answer 6

you should use

document.getElementById('topdiv').innerHTML = 'hello';

Answer 7

You should use references instead of ID's, using this.
In that case this means the node that triggers the event.

<div style="color:Blue" onmouseover="button1(this);">
    <input type="button" onclick="edit1(this);"/>
    Div Tag
</div>

function button1(divRef){
  //divRef is the reference to the DIV
}
function edit1(inputRef){
  //inputRef is the reference of the INPUT
  //inputRef.parentNode is the reference to the DIV
}

Answer 8

function edit1() {
        alert('you are in edit1');
        document.getElementById('topdiv').innerHTML = 'hello';
    }

This should work by specifying the id

Answer 9

In standard JavaScript usage you'd do as per @DarinDimitrov 's answer.

document.getElementById("topdiv").innerHTML = ('hello');

Once you're happy with JavaScript I would suggest you look at the JQuery libraries - the powerful syntax will let you write short, neat code like this:

$("#topdiv").html('hello');

Answer 10

Your file

<div id="topdiv" style="color:Blue" onmouseover="button1();"> Div Tag</div>
<form><input type="button" id="btndiv" value="Edit" onClick="window.open('t2.html','popuppage','width=850,toolbar=1,resizable=1,scrollbars=yes,height=700,top=100,left=100');" value="Open popup"/></form>

t2.html file

function sendValue (s){var selvalue = s.value;window.opener.document.getElementById('topdiv').innerHTML = selvalue;window.close();}

<form name="selectform"><input name="details" value=""><input type=button  value="Copy input to parent opener" onClick="sendValue(this.form.details);"></form>

Got Idea from this source enter link description here