Dynamically adding anchor to paragraph element is not working

Question

<!DOCTYPE html>
<html>

<head>
    <title></title>
</head>
<body>
<div>
    <p id="test"></p>
</div>
<script>
    var newLink = document.createElement('a'); // #1
    newLink.href = 'http://google.fr'; // #2
    document.getElementById('test').appendChild(newLink); // #3
</script>

</body>
</html>

This is not working, and I can't understand why.

I create a new element <a>
I add the href to this element ( <a href="http://google.fr"> )
I tell JS to go and find test and add this element to the <p> tag which has test as an ID.

Why it is not working?

Answer 1

Try adding some content to the element as well by setting the .innerHTML property. As it is now you are just adding an empty anchor. Try something like this:

var newLink = document.createElement('a');
newLink.href = 'http://google.fr';
newLink.innerHTML = 'My anchor';
document.getElementById('test').appendChild(newLink);

Answer 2

使用innerHTML属性将您创建的标签附加到段落标签中。

Dynamically adding anchor to paragraph element is not working

Question

2 answers

solution1
7 ACCPTED 2012-10-30 07:35:13

solution2
-2 2012-10-30 07:57:56

Dynamically adding anchor to paragraph element is not working

Question

2 answers

solution1 7 ACCPTED 2012-10-30 07:35:13

solution2 -2 2012-10-30 07:57:56

solution1
7 ACCPTED 2012-10-30 07:35:13

solution2
-2 2012-10-30 07:57:56