首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >包含链接的div的Javascript dom子级

包含链接的div的Javascript dom子级
EN

Stack Overflow用户
提问于 2018-08-08 06:56:39
回答 1查看 40关注 0票数 0

我对下面的代码和通过在www.w3schools.com上更改示例而生成的结果感到困惑。具体地说,当一个链接是某个父元素的子元素时,我不明白为什么当元素是一个<a>标记时,parent.children返回href的值?

代码语言:javascript
复制
​<!DOCTYPE html>
<html>
<body>
<a href="http://www.example.com/my.jpg"></a>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

<script>
function myFunction() {
var c = document.body.children;
var txt = "";
var i;
for (i = 0; i < c.length; i++) {
txt = txt + c[i] + "<br>";
}

document.getElementById("demo").innerHTML = txt;
}
</script>

上面的代码提供了以下结果,第一个结果是我没有预料到的。

代码语言:javascript
复制
http://www.example.com/my.jpg           
[object HTMLButtonElement]
[object HTMLParagraphElement]
[object HTMLScriptElement]

因此,没有将<a>标记作为对象列出,而是给出了href属性的值。

我正在开发blueimp图库https://github.com/blueimp/Gallery的一个实现。用户选择缩略图,并弹出初始化为对应的高分辨率照片的旋转木马灯箱。我正在处理一个iphone特定的问题,并学习代码,因为我一直在前进。

EN

回答 1

Stack Overflow用户

发布于 2018-08-08 07:04:44

你可能想要这个,打印所有孩子的html标签。

代码语言:javascript
复制
<!DOCTYPE html>
<html>
<body>
<a href="http://www.example.com/my.jpg"></a>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>
<script>
    function myFunction() {
        var c = document.body.children;
        var txt = "";
        var i;
        for (i = 0; i < c.length; i++) {
            txt = txt + c[i].outerHTML + "<br>";
        }

        document.getElementById("demo").innerText = txt;
    }
</script>
</body>
</html>

运行txt = txt + c[i] + "<br>";时,c[i](<a>,< button/>, ...)节点将转换为其字符串表示形式并显示

<a>标签的字符串表示是"http://www.example.com/my.jpg< button/>标签的字符串表示是object HTMLButtonElement ...

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51736514

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档