DOM Navigation
Once you have an element, you can navigate to other elements relative to this element. Navigation methods include:
Getting the elements parent.
Getting the elements sibling, either the next or the previous sibling in the DOM.
Getting the elements child or children nodes. NOTE: There is a subtle difference between the two:
Child nodes - nodes directly underneath this node including any text nodes.
Children nodes - nodes directly underneath this node excluding any text nodes.
Suppose we have some HTML that looks like this:
DIV1 TEXT DIV2 TEXT SPAN1 TEXT SPAN2 TEXT SPAN3 TEXT Here is how we can navigate around the DOM once we have a starting element:
// Let's start with the span1 element. Element span1 = Find.ById("span1"); Element span2 = span1.GetNextSibling(); Element span3 = span2.GetNextSibling(); // Let's verify we got the right elements Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), string.Format("Actual ID: {0}", span1.IdAttributeValue)); Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), string.Format("Actual ID: {0}", span2.IdAttributeValue)); Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), string.Format("Actual ID: {0}", span3.IdAttributeValue)); // Now let's navigate backwards span2 = span3.GetPreviousSibling(); span1 = span2.GetPreviousSibling(); Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), string.Format("Actual ID: {0}", span1.IdAttributeValue)); Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), string.Format("Actual ID: {0}", span2.IdAttributeValue)); Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), string.Format("Actual ID: {0}", span3.IdAttributeValue)); // Now let's look at parent and children Element parentDiv = span1.Parent; // ChildNodes includes all nodes including text and comments. Children is a subset of ChildNodes. Assert.AreEqual(parentDiv.ChildNodes.Count, 4, string.Format("ChildNodes = {0}", parentDiv.ChildNodes)); // Children are basically only markup children. (Does not include text or comments); Assert.AreEqual(parentDiv.Children.Count, 3, string.Format("Children = {0}", parentDiv.ChildNodes)); span1 = parentDiv.Children[0]; span2 = parentDiv.Children[1]; span3 = parentDiv.Children[2]; Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), string.Format("Actual ID: {0}", span1.IdAttributeValue)); Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), string.Format("Actual ID: {0}", span2.IdAttributeValue)); Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), string.Format("Actual ID: {0}", span3.IdAttributeValue));“先span1元素。昏暗的span1作为Element = Find.ById("span1") Dim span2 As Element = span1.GetNextSibling() Dim span3 As Element = span2.GetNextSibling() ' Let's verify we got the right elements Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), String.Format("Actual ID: {0}", span1.IdAttributeValue)) Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), String.Format("Actual ID: {0}", span2.IdAttributeValue)) Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), String.Format("Actual ID: {0}", span3.IdAttributeValue)) ' Now let's navigate backwards span2 = span3.GetPreviousSibling() span1 = span2.GetPreviousSibling() Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), String.Format("Actual ID: {0}", span1.IdAttributeValue)) Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), String.Format("Actual ID: {0}", span2.IdAttributeValue)) Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), String.Format("Actual ID: {0}", span3.IdAttributeValue)) ' Now let's look at parent and children Dim parentDiv As Element = span1.Parent ' ChildNodes includes all nodes including text and comments. Children is a subset of ChildNodes. Assert.AreEqual(parentDiv.ChildNodes.Count, 4, String.Format("ChildNodes = {0}", parentDiv.ChildNodes)) ' Children are basically only markup children. (Does not include text or comments); Assert.AreEqual(parentDiv.Children.Count, 3, String.Format("Children = {0}", parentDiv.ChildNodes)) span1 = parentDiv.Children(0) span2 = parentDiv.Children(1) span3 = parentDiv.Children(2) Assert.IsTrue(span1.IdAttributeValue.Equals("span1"), String.Format("Actual ID: {0}", span1.IdAttributeValue)) Assert.IsTrue(span2.IdAttributeValue.Equals("span2"), String.Format("Actual ID: {0}", span2.IdAttributeValue)) Assert.IsTrue(span3.IdAttributeValue.Equals("span3"), String.Format("Actual ID: {0}", span3.IdAttributeValue))