javascript - object.src 和 object.getAttribute ('src' 的区别)

标签 javascript html dom

所以,这是一个示例 HTML 代码:

<img src="test.png" id="test">

这是一段 Javascript 代码:

element = document.getElementById('test');
alert(element.getAttribute('src')); --> test.png
alert(element.src); --> domain.com/test.png

为什么 getAttribute 不显示域,而 .src 是的,它添加了域?在哪里可以找到访问 DOM 对象中属性的不同方式之间的区别?

最佳答案

getAttribute() 准确返回 HTML 中的内容。它可能是一个相对 URL。

.src 返回完全限定的绝对 URL,即使 HTML 中的内容是相对 URL。

例如:

<img id="myImage" src="foo.jpg">

var img = document.getElementById("myImage");
var src1 = link.getAttribute("src")  ;    // "foo.jpg"
var src2 = link.src;                      // "http://mydomain.com/path/foo.jpg"

或者,使用链接标签:

<a id="myLink" href="foo.html">

var link = document.getElementById("myLink");
var src1 = link.getAttribute("href");    // "foo.html"
var src2 = link.href;                     // "http://mydomain.com/path/foo.html"

链接标签的工作演示:http://jsfiddle.net/jfriend00/EXYjb/

关于javascript - object.src 和 object.getAttribute ('src' 的区别),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19737143/

相关文章:

javascript - 使用 Cheerio 从 <ul> 获取 <li> 下的 href

javascript - 动画 CC : Creating/accessing global function from external . js 文件

html - CSS 下拉菜单在我单击之前关闭

javascript - 如何从 HTML 中选定项目的服务器检索数据

Javascript : get HTML of remote web page

javascript - 停止一个 div 的背景颜色覆盖另一个 div 的内容,旋转并因此重叠,div

JavaScript 错误 : "The resource was realized on the wrong render target"

javascript - 网站如何让您保持登录状态

javascript - 修改网页的DOM

javascript - 验证 var 是否存在并更新它