Home > Software design >  how to access contents of input tag which is inside div tag in html
how to access contents of input tag which is inside div tag in html

Time:07-11

html code:

<div id="1" > <input type="text" size=1px value=""></div>

After entering the value in input section,i want to access the contents what i have enetered.

can anyone please help me in this question.

CodePudding user response:

i didn't quite understand what you meant but i assume you meant the following ?

let input = document.getElementById('input')
let h1 = document.getElementsByTagName('h1')[0]
input.addEventListener('input', () => {
h1.textContent = input.value
})
<div id="1" > <input  type="text" size=1px  value="" id='input'> <h1></h1></div>

CodePudding user response:


Requires JavaScript or BackEnd But if you don't mind I will explain the javascript
...............
First, choose a unique identifier for your input, for example "MyInput":\

<div>
    <input type="text" id="MyInput" value="">
</div>

It doesn't matter where it is ( form , input and ... )
Now let's go to JavaScript:( I attach it to a sticker )\

<a onclick=" alert( document.getElementById('MyInput').value ) "> Show Value Input</a>

You may not understand what this command is
I'm just referring to the onclick input
With the "alert" command the browser will show you something and if you know js, you know this
The document.getElementById command takes an ID and finds that tag, which you can access by typing a dot followed by the entry name.
For example, when you write something in your input, the input is a value and the fog is filled with that value.
From now on, every time you click on the a tag, you will be shown the input value

Complete code:

<div>
    <input type="text" id="MyInput" value="">
</div>
<a onclick=" alert( document.getElementById('MyInput').value ) "> Show Value Input</a>

If you have any questions, send me an email:
[email protected]
;-)

  • Related