有没有一种方法可以只检索到一个特定点上的子 node .例如,我创建了rect and circle
,在添加path
之前,我正在执行fnTwo
,希望它只返回rect and circle
.但是它返回所有的子元素;例如rect, circle +path
;即使path被添加在后面.有没有一种方法可以让我执行fnTwo
,来得到在那个时间点上加起来的子元素.
const svg = document.querySelector('svg');
const svgns = "http://www.w3.org/2000/svg"
const element = ['rect', 'circle'];
//fn for append
const fnOne = (element) => {
const child = document.createElementNS(svgns, element);
svg.append(child);
}
//append all elements
for (const elements of element) {
const element = elements;
fnOne(element)
};
// get all the children elements **up to this point in time**
const fnTwo = (element) => {
const children = element.children;
//do something with the children
console.log(children); //brings all children added before + after
}
const children = fnTwo(svg);
//add a path to test if it is retrieved through fnTwo
const childThree = document.createElementNS(svgns, 'path');
svg.append(childThree);
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Document</title>
</head>
<script type="text/javascript" src="https://d3js.org/d3.v7.min.js"></script>
<body>
<svg>
</svg>
</body>
</html>