JavaScript JavaScript and the DOM Making Changes to the DOM Modifying Elements

Christopher Evans
Christopher Evans
9,776 Points

Can't figure out how to pull text content from one element into another

This one has me stumped. How do I reference the <a> element in this syntax?

app.js
var inputValue = document.getElementById("linkName").value(input.text);
index.html
<!DOCTYPE html>
<html>
    <head>
        <title>DOM Manipulation</title>
    </head>
    <link rel="stylesheet" href="style.css" />
    <body>
        <div id="content">
            <label>Link Name:</label>
            <input type="text" id="linkName">
            <a id="link" href="https://teamtreehouse.com"></a>
        </div>
        <script src="app.js"></script>
    </body>
</html>

2 Answers

Dimitar Dimitrov
Dimitar Dimitrov
10,298 Points

You can do this by 1st selecting the <a> anchor tag with JavaScript and use the .textContent property:

document.querySelector('a').textContent

and then you just assign it to the variable inputValue.

document.querySelector('a').textContent = inputValue;

You can use the document.getElementsByTagName('a') if you are more familiar with this method but don't forget that this method returns an array and you need to further specifies which <a> tag you want to select like this

document.getElementsByTagName('a')[0]
Sean T. Unwin
MOD
Sean T. Unwin
Treehouse Moderator 28,648 Points

Remove the brackets and what's inside for value as it is not a function, but a string.

var inputValue = document.getElementById("linkName").value;