Question

我创建了一个如下所示的元素：

  var imageElement =  new Element('img', {
                    'src': item.Url,
                    'alt': item.Id,
                    'height': height + 'px',
                    'width': width + 'px', 
                    'styles': {
                        'padding-left': paddingLeft + 'px',
                        'padding-top': paddingTop + 'px'
                    }
                });

当我设置一个断点来启动调试器并查看imageElement.get('html')返回的内容时，它是一个空字符串。

为什么会这样？是不是你想要获得innerHTML？

编辑：哦，我怎么得到它的HTML呢？

Answer 1

我不确定为什么在你可以通过它的对象访问它时你想要IMG的HTML，但是你在这里：

HTML：

<div id="image-wrap"></div>

MooTools的：

var imageElement =  new Element('img', {
   'src': item.Url,
   'alt': item.Id,
   'height': height,
   'width': width, 
   'styles': {
       'padding-left': paddingLeft + 'px',
       'padding-top': paddingTop + 'px'
   }
}).inject($('image-wrap'));

console.log(imageElement.getParent().get('html'));

您还可以即时创建包装元素，然后获取其内容。

Answer 2

图像元素是单例标记;他们没有拥有内部HTML。

Answer 3

顾名思义，

innerHTML是里面的元素，即。它的内容。 <img>中没有内容，因为根据定义它是一个空元素。

在IE中，您还可以获得outerHTML。没有好的跨浏览器，但可以用于调试。否则你将被限制在例如。将图像附加到空div并获取div的innerHTML。

'height': height + 'px', 'width': width + 'px',

与CSS不同，HTML宽度/高度没有单位，这些属性是普通整数。

Answer 4

我知道这是一个已被回答的旧问题，但我想我可能会添加任何从搜索结果中看到这一点的人，在实际附加到文档树之前没有元素具有innerHTML，并且在MooTools'注入'的情况下编辑。真正的答案显然是图像标签没有如上所述的innerHTML。

MooTools：如何获得元素的innerHTML？

4 个答案: