Question

尝试在元素中创建元素。这是一个锚标记中的img。我使用了附加子，但是＆＃34; userLogoElement＆＃34;注销时只是img标签，锚是空锚标签。为什么没有发生任何事情？

         var anchor  = document.createElement('a');
         anchor.href = var0;

         //---- Create image element ----
         var img   = document.createElement('img');
         img.src   = var1;
         img.title = var2;

         //---- Combine elements ----
         var userLogoElement = anchor.appendChild(img);

         console.log(userLogoElement, anchor, img);
         //console says img === userLogoElement, anchor is empty

Answer 1

代码工作正常http://jsfiddle.net/gcamP/

请注意Node.appendChild()返回对附加节点的引用，而不是您追加的节点。这就是userLogoElement图像不是锚点的原因。

另请注意：在Firebug中，日志仅显示父锚，它不会在控制台日志中包含其子项。另一方面，Chrome确实显示了它。一种简单的测试方法是将其附加到文档中并亲自查看（就像在小提琴中一样）。

Answer 2

我运行了以下代码：

<script type="text/javascript">
var0="www.google.com";
var1="bee.jpg";
var2="Don Bee";
    var anchor  = document.createElement('a');
     anchor.href = var0;

     //---- Create image element ----
     var img   = document.createElement('img');
     img.src   = var1;
     img.title = var2;

     //---- Combine elements ----
     var userLogoElement = anchor.appendChild(img);

     console.log(userLogoElement);
     console.log ("next");
     console.log(anchor);
     console.log("next");
     console.log(img);

     </script>

我有以下输出

userLogoElement： img src =＆＃34; bee.jpg＆＃34; title =＆＃34; Don Bee＆＃34;

锚：
a href =＆＃34; www.google.com＆＃34; img src =＆＃34; bee.jpg＆＃34; title =＆＃34; Don Bee＆＃34; / A

这似乎工作得很好。 userLogoElement的返回值不是您的锚

Answer 3

in jquery short coding style

$("<a>")
.attr('href','www.pranaysonisoft.blogspot.com')
.append($('<img>').attr('src','sdf.jpg'));

嵌套元素创建不起作用？

3 个答案: