DOM - 选择 HTML 元素的特定属性

6 浏览
0 Comments

DOM - 选择 HTML 元素的特定属性

我正在使用DOM事件委托进行实验，并试图弄清楚为什么除了ID属性之外，我无法选择特定的HTML元素。\n

var html = ' 
%description%
%value%'
document.querySelector('.item__clearfix').addEventListener('click', function(event){
      console.log(event.target.parentNode.parentNode.parentNode.parentNode);
});

\n我应该得到的parentNode是：div class=\"item__clearfix\" id=\"770\"。\n当我选择它的ID属性时，我可以得到\"770\"，但如果我尝试选择其他属性，我会得到未定义。为什么会这样？\n

event.target.parentNode.parentNode.parentNode.parentNode.id >> 770
event.target.parentNode.parentNode.parentNode.parentNode.prop2 >> 未定义

\n如果我没有解释清楚，对不起。

0

2 答案

0 Comments

DOM - 选择HTML元素的特定属性

在使用DOM对象时，element.id可以获得元素的计算出的id。对于其他不是对象属性的属性，您需要使用.getAttribute()，因为DOM对象中没有名为prop2的计算属性。

解决方法：

如果您需要选择HTML元素的特定属性，但该属性不是对象的属性，您可以使用.getAttribute()方法。例如，下面的代码选择了一个元素的父节点的父节点的父节点的父节点的prop2属性：

event.target.parentNode.parentNode.parentNode.parentNode.getAttribute("prop2")

0
0 Comments

DOM（文档对象模型）是用于访问和操作HTML文档的一种编程接口。在DOM中，可以通过选择特定的HTML元素来操作其属性。然而，有时候我们只想选择元素的某个特定属性，而不是整个元素本身。下面我们将讨论这个问题的原因和解决方法。

问题的原因在于，DOM提供了一种公开访问元素id的方法，即通过直接访问元素的id属性。但是对于其他属性，我们需要使用getAttribute('property_name')方法来获取它们的值。

解决方法非常简单，只需要使用getAttribute方法，并将要获取的属性名称作为参数传递给它即可。例如，如果我们想获取元素的class属性，可以使用getAttribute('class')方法。这样就可以获取到class属性的值了。

总结起来，问题的原因是DOM只提供了一种公开访问元素id的方法，而对于其他属性，我们需要使用getAttribute方法来获取它们的值。解决方法是使用getAttribute方法，并将要获取的属性名称作为参数传递给它。

希望这篇文章对你理解DOM中选择特定HTML元素属性的问题有所帮助。

0