Question

所以我有以下HTML ...

HTML：

<div id="col1">
    <img src="1.jpg">
</div>

我正在实现一个HTML5拖放功能，其中col1的内部html被更改为已拖动元素的内部html - 所以基本上列会更改其内容。

我有另一个div（让我们调用swap-text），我想根据col1内的图片更改其文字内容。

这就是为什么我想知道如何通过JavaScript获取col1 img元素的src属性值，以便我可以编写一个if语句，用于更改swap-text的内容，具体取决于col1中的图片。

我可以在img元素中添加ID，但之后我仍然不知道如何编写条件来检查是否说img-id1 parent是{{1 }}

尝试（S）：

col1

Answer 1

var doc = document.getElementById("col1");
var img = document.getElementsByTagName('img')[0];
var imgParent = img.parentElement;

这是确定元素parent /

的方法

Answer 2

这个工作很好的纯javascript：

document.getElementById("col1").getElementsByTagName("img")[0].getAttribute("src");

Answer 3

我建议您使用JQuery，这样您就可以使用：

$("img").attr("id"); //Return the id of the img element

Answer 4

检查一下：

var column = document.getElementById("col1");
var imgSrc = column.getElementsByTagName("img")[0].getAttribute("src");

或者只使用jQuery - 它更简单：

$('#col1 img').attr('src');

Answer 5

因为你在col1（img）中只有一个子节点，所以改变for循环。

var doc = document.getElementById("col1");
var children = null;
var imgEle;

//gets img node, but also got 1/2 text object(s)?
//for (var i = 0; i < doc.childNodes.length; i++) {
//    children = doc.childNodes[i];
//    console.log(children);
//}

childen = doc.childNodes[0];
// or children = doc.firstChild;

console.log(children);

//document.getElementById("img")
console.log(children.getAttribute('src')); - children is single object


//imgEle = doc.childNodes[0].getElementById('img'); - Object #<Text> has no method 'getElementById'

console.log(imgEle);
console.log(children);

如何使用JavaScript从父元素的父元素ID中获取元素的属性？

5 个答案: