使用javascript获取内部HTML元素

get inner HTML element using javascript

本文关键字:HTML 元素 内部 获取 javascript 使用      更新时间:2023-09-26

我有以下html层次结构:

...
<div class="custom-img-wrapper">
<a target="_blank" class="link-d" href="#"><img class="custom-below-img" src="some source"></a>
<h3><a target="_blank" class="link-d" href="#">some text</a></h3>
</div>
<div class="custom-img-wrapper">
<a target="_blank" class="link-d" href="#"><img class="custom-below-img" src="some source"></a>
<h3><a target="_blank" class="link-d" href="#">some text</a></h3>
</div>
...

我正在检查这个循环的链接:

var x = document.getElementsByClassName("link-d");
for (i = 0; i < x.length; i++) {
    x[i].href = link;
}

现在我的问题是如何保存链接中图像的src,所以我会得到这样的提示:

var x = document.getElementsByClassName("link-d");
for (i = 0; i < x.length; i++) {
    var link_of_image_inside_node = x[i].????
    x[i].href = link;
}

我知道我可以在custom-below-image上循环,但这不是我需要的,我正在寻找一个纯JavaScript的无jQuery解决方案,知道吗?thx

如果a标记第一个子元素是图像,则

var link_of_image_inside_node = x[i].firstChild.src;

var link_of_image_inside_node = x[i].children[0].src; //ignores all the text before img tag

其中x[i]是锚元素