当属性src为null或为空时，.prp('src'）为什么返回错误的值

Why does .prop('src') return wrong value when property src is null or empty?

本文关键字：src 为什么 错误 返回 prp null 属性      更新时间：2023-09-26

jsfiddle

$('img').click(function () {
  alert($(this).prop('src'))
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<img src="http://www.w3schools.com/tags/smiley.gif" />
<img src="" style="width: 10px; height: 10px; border: 1px solid;">

当我单击第二个图像时，它会提醒http://stacksnippets.net/js。

为什么？

根据官方文档：

HTMLImageElement.src是一个DOMString，它反映srcHTML属性，包含图像的完整URL，包括基本URI。

这显然意味着，如果不给src任何路径，src属性将仅等于base URI

链接：https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement

如果src的值为空，则一个快速的javascript解决方法是将其设置为null

var src = $(this).prop('src') || null;

jsfiddle：http://jsfiddle.net/g9d8e4wh/1/

关于你对.attr() vs .prop()的担忧，我建议你去那里.pr（）与.attr（）

当SRC为空时，$（this）重新运行IMG对象，SRC返回对象上下文和baseURI。您可以通过在控制台中查看对象属性来查看它：

$('img').click(function () {
    alert($(this).prop('src'))
    console.log($(this));
})

这是因为src被反射：

alt、src IDL属性必须反映相同名称的相应内容属性。

当获得一个具有URL值的反映IDL属性时，您将获得绝对值：

如果反映IDL属性是DOMString属性，其内容属性被定义为包含URL，然后在获取IDL时属性必须解析内容属性相对于的值元素，并返回结果的绝对URL（如果是成功，否则为空字符串

如果您不想要这种行为，可以使用getAttribute来获取content属性，而不是IDL属性。

属性和属性之间存在同步，但并非适用于所有情况。例如，"href"answers"src"不同步。在您的情况下，您需要使用

$('img').click(function () {
  alert($(this).attr('src'))
})

或CCD_ 13。您可以在此处了解更多信息->http://javascript.info/tutorial/attributes-and-custom-properties

相关文章：