Need to find element in selenium by css

Question

I want to find the element of this link  us states  in  lt h5 gt   I am trying this in craigslist  Any help will be highly appreciated   Here is the url   http   auburn craigslist org      lt html class    gt   lt head gt   lt body class  homepage w1024 list  gt       lt script type  text javascript  gt       lt article id  pagecontainer  gt               lt section class  body  gt           lt table id  container  cellspacing  0  cellpadding  0        lt tbody gt              lt tr gt       lt td id  leftbar  gt       lt td id  center  gt       lt td id  rightbar  gt           lt ul class  menu collapsible  gt               lt li class  expand s  gt               lt li class  s  gt               lt li class  s  gt                   lt h5 class  ban hot  gt us states lt  h5 gt                   lt ul class  acitem  style  display  none   gt               lt  li gt           lt li class  s  gt           lt li class  s  gt

User · Accepted Answer

Only using class names is not sufficient in your case.

By.cssSelector(".ban") has 15 matching nodes
By.cssSelector(".hot") has 11 matching nodes
By.cssSelector(".ban.hot") has 5 matching nodes

Therefore you need more restrictions to narrow it down. Option 1 and 2 below are available for css selector, 1 might be the one that suits your needs best.

Option 1: Using list items' index (CssSelector or XPath)

Limitations

Not stable enough if site's structure changes

Example:

driver.FindElement(By.CssSelector("#rightbar > .menu > li:nth-of-type(3) > h5"));
driver.FindElement(By.XPath("//*[@id='rightbar']/ul/li[3]/h5"));

Option 2: Using Selenium's FindElements, then index them. (CssSelector or XPath)

Limitations

Not stable enough if site's structure changes
Not the native selector's way

Example:

// note that By.CssSelector(".ban.hot") and //*[contains(@class, 'ban hot')] are different, but doesn't matter in your case
IList<IWebElement> hotBanners = driver.FindElements(By.CssSelector(".ban.hot"));
IWebElement banUsStates = hotBanners[3];

Option 3: Using text (XPath only)

Limitations

Not for multilanguage sites
Only for XPath, not for Selenium's CssSelector

Example:

driver.FindElement(By.XPath("//h5[contains(@class, 'ban hot') and text() = 'us states']"));

Option 4: Index the grouped selector (XPath only)

Limitations

Not stable enough if site's structure changes
Only for XPath, not CssSelector

Example:

driver.FindElement(By.XPath("(//h5[contains(@class, 'ban hot')])[3]"));

Option 5: Find the hidden list items link by href, then traverse back to h5 (XPath only)

Limitations

Only for XPath, not CssSelector
Low performance
Tricky XPath

Example:

driver.FindElement(By.XPath(".//li[.//ul/li/a[contains(@href, 'geo.craigslist.org/iso/us/al')]]/h5"));

User · Answer

By cssSelector   ban   or By cssSelector   hot   or By cssSelector   ban hot   should all select it unless there is another element that has those classes   In CSS   name means find an element that has a class with name    foo bar baz means  to find an element that has all of those classes  in the same element    However  each of those selectors will select only the first element that matches it on the page   If you need something more specific  please post the HTML of the other elements that have those classes

User · Answer

You can describe your css selection like cascading style sheet dows   protected override void When        SUT Browser FindElements By CssSelector   carousel  gt  a tiny button

[selenium] Need to find element in selenium by css

Examples related to selenium

Examples related to webdriver

Examples related to css-selectors

Examples related to selenium-webdriver