XPATH: Finding the following-sibling from the parent of an xpath

Question

I'm trying to determine the correct xpath for this HTML layout. I can only be sure of the name of the first element (input id="urn..."). I need to get to the parent of input (div), and then to the following sibling (ul), and then to the first child (li).

My xpath looks like this:

    "//input[contains(@id, "city~HOME_CITY")]/parent::div/following-sibling::ul/li[1]"

I'd be much obliged if someone could look over this. It seems like finding the (/parent) or (/following-sibling) has been consistently difficult for me to make work in any context. I'm new to this, so if anyone would like to critique other aspects of my approach I'd be very grateful!

HTML tree pictured here

Answer 1

Looks fine! A very slightly shorter equivalent would be:

//div[input[contains(@id, 'city~HOME_CITY')]]/following-sibling::ul/li[1]

Essentially replacing the parent:: step from the input to the div with a predicate on the div that tests if it has an input child.

You might want to put a [1] predicate after the ul step, too, if there might be more ul siblings.

Answer 2

Alright haha, welp as I said, beginner mistake XD. Given the picture I sent, I didn't realize I'm looking for the parent of the parent (2 divs up). Whoops. Simple fix by adding another /parent::div and bam all fixed up. Thanks to everyone for the suggestions, will definitely streamline it later!

Answer 3

{div id="ember505"} 是孩子 1 (div-> grand child [input]) 和孩子 2 (ul-> li[1]) 的父母，目前您正在从 Grand child [input] 遍历到孩子 (div ) 不应该是这样的情况得到父 {div id="ember505"} 然后遍历到第二个孩子 (ul->li[1])