Question

在过去的20分钟里，我被这样一个简单的问题弄糊涂了，以至于问起来几乎令人尴尬。基本上我想为已经存在的div创建一个锚标记，但我想使用DOM来创建锚。出于某种原因，我无法解决这个简单的问题。试过单引号和双引号，将脚本标签从头到脚移动等等......

这是代码

<html>
<head>  
</head>

<body>
<div id = "image_div">
        <img  src = "my_image.png" />          
</div>
<script type="text/javascript">
   var DIV = document.getElementById("image_div");
   var anchor = document.createElement("a");                        
   anchor.href = "http://www.stackoverflow.com";
   DIV.appendChild(anchor);
</script>

</body>
</html>

Answer 1

你没有在锚中添加任何文字，因此它不会有任何大小，因此即使它在那里你也不会看到它。

var DIV = document.getElementById("image_div");
var anchor = document.createElement("a");                        
anchor.href = "http://www.stackoverflow.com";
anchor.innerHTML = "Click Me";        // <==== Add this line
DIV.appendChild(anchor);

Answer 2

您的示例工作正常..并且还将您的a子级附加到DOM，但您必须插入一个文本和一些Sign，因为它显示为单击..

 var DIV = document.getElementById("image_div");
 var anchor = document.createElement("a");                        
 anchor.href = "http://www.stackoverflow.com";
 anchor.innerText = "Click Me";
 DIV.appendChild(anchor);

See Fiddle

或者如果您想要换行，a锚标记到img然后使用：

 var DIV = document.getElementById("image_div");
 var img1 = document.getElementById("img1");
 var anchor = document.createElement("a");                        
 anchor.href = "http://www.stackoverflow.com";
 anchor.appendChild(img1);
 DIV.appendChild(anchor);

WORKING DEMO

无法使用createElement为div标签创建锚点？

2 个答案: