使用getElementsByClassName获取父节点

Question

我正在寻找从我的对象获取parentNode的javascript解决方案。然而，不管我似乎做了什么，它总是说'未定义＆＃39;。

这是我的代码：

HTML

<div class="EmbedImageWidget" ng-if="vm.imageLink == '' || vm.imageLink == 'undefined'">
    <img ng-src="{{ vm.imageUrl }}" />
</div>

<div class="EmbedImageWidget" ng-if="vm.imageLink" >
    <a href="{{vm.imageLink}}" target="_blank">
        <img ng-src="{{ vm.imageUrl }}" />
    </a>
</div>

JS

var imageElement = document.getElementsByClassName("EmbedImageWidget");
console.log(imageElement);

OBJECT

我尝试过使用

    var imageElement = document.getElementsByClassName("EmbedImageWidget").parentNode;
    console.log(imageElement);

    var imageElement = document.getElementsByClassName("EmbedImageWidget")[0].parentNode;
    console.log(imageElement);

然而，两种选择都不起作用。任何帮助都感激不尽。干杯！

Answer 1

您需要使用document.getElementsByClassName("EmbedImageWidget")[0].parentNode代替document.getElementsByClassName("EmbedImageWidget").parentNode。此代码工作正常Here

但我认为你想访问Image元素，而不是div的父元素。那是那个div的孩子而不是

Answer 2

var imageElement = document.getElementsByClassName("EmbedImageWidget")[0].parentNode;
console.log(imageElement);

这是最好的解决方案，但是存在一些问题，运行js代码后生成img元素。当您尝试在js中获取img元素的父节点时，没有img元素与EmbedImageWidget类。

因为ng-if而

。