[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"detail-sidebar-cat-1-en-105":3,"doc-seo-573294-105":53,"doc-detail-573294-en":130},{"code":4,"msg":5,"data":6},0,"success",[7,14,19,24,29,34,39,44,49],{"id":8,"doc_module":9,"doc_module_name":10,"category_name":11,"show_sort_weight":12,"slug":13},11,1,"Template","Presentations",90,"presentations",{"id":15,"doc_module":9,"doc_module_name":10,"category_name":16,"show_sort_weight":17,"slug":18},12,"Resumes",80,"resumes",{"id":20,"doc_module":9,"doc_module_name":10,"category_name":21,"show_sort_weight":22,"slug":23},14,"Invoices",70,"invoices",{"id":25,"doc_module":9,"doc_module_name":10,"category_name":26,"show_sort_weight":27,"slug":28},15,"Posters",60,"posters",{"id":30,"doc_module":9,"doc_module_name":10,"category_name":31,"show_sort_weight":32,"slug":33},16,"Social Media",50,"social-media",{"id":35,"doc_module":9,"doc_module_name":10,"category_name":36,"show_sort_weight":37,"slug":38},17,"Forms",40,"forms",{"id":40,"doc_module":9,"doc_module_name":10,"category_name":41,"show_sort_weight":42,"slug":43},18,"Letters",30,"letters",{"id":45,"doc_module":9,"doc_module_name":10,"category_name":46,"show_sort_weight":47,"slug":48},21,"Paper Templates",5,"papers-templates",{"id":50,"doc_module":9,"doc_module_name":10,"category_name":51,"show_sort_weight":4,"slug":52},158,"General","general-158",{"code":4,"msg":54,"data":55},"ok",{"site_id":56,"language":57,"slug":58,"title":59,"keywords":60,"description":61,"schema_data":62,"social_meta":123,"head_meta":125,"extra_data":127,"updated_unix":129},105,"en","xpath-and-css-selector-cheatsheet-web-element-identification-guide","XPath and CSS Selector Cheatsheet - Web Element Identification Guide","","This comprehensive cheatsheet provides a structured guide to selecting web elements using XPath and CSS selectors for automation and web scraping tasks. It covers essential techniques including node selection, attribute-based filtering, position-based locating, and advanced operator usage. By contrasting CSS and XPath syntax side-by-side for common scenarios—such as targeting specific tags, matching class attributes, or finding elements by their index—this resource serves as a practical reference for developers and quality assurance engineers to optimize their element identification strategies and enhance test script robustness. The document emphasizes clean, efficient locator strategies, including the use of contains and starts-with functions to handle dynamic web content and complex DOM structures effectively.",{"@graph":63,"@context":122},[64,80,101],{"@type":65,"itemListElement":66},"BreadcrumbList",[67,71,74,77],{"item":68,"name":69,"@type":70,"position":9},"https://docshare.wps.com","Home","ListItem",{"item":72,"name":10,"@type":70,"position":73},"https://docshare.wps.com/template/",2,{"item":75,"name":51,"@type":70,"position":76},"https://docshare.wps.com/template/general/",3,{"item":78,"name":59,"@type":70,"position":79},"https://docshare.wps.com/template/xpath-and-css-selector-cheatsheet-web-element-identification-guide/573294/",4,{"url":78,"name":59,"@type":81,"image":82,"author":87,"headline":59,"publisher":90,"fileFormat":93,"inLanguage":57,"description":61,"dateModified":94,"datePublished":95,"encodingFormat":93,"isAccessibleForFree":96,"interactionStatistic":97},"DigitalDocument",{"url":83,"@type":84,"width":85,"height":86},"https://docshare.wps.com/thumbnails/xpath-and-css-selector-cheatsheet-web-element-identification-guide/573294.png","ImageObject",442,249,{"name":88,"@type":89},"OmBimo","Person",{"url":68,"name":91,"@type":92},"DocShare","Organization","application/pdf","2026-10-16","2026-10-14",true,{"@type":98,"interactionType":99,"userInteractionCount":76},"InteractionCounter",{"@type":100},"ViewAction",{"@type":102,"mainEntity":103},"FAQPage",[104,110,114,118],{"name":105,"@type":106,"acceptedAnswer":107},"What is the difference between CSS and XPath for selecting all div elements?","Question",{"text":108,"@type":109},"To select all div elements, the CSS selector is simply 'div', while the XPath expression is '//div'.","Answer",{"name":111,"@type":106,"acceptedAnswer":112},"How do you select an element with a specific class in both CSS and XPath?",{"text":113,"@type":109},"For CSS, you use '[class=\"example\"]', and for XPath, you use '//*[ @class=\"example\"]'.",{"name":115,"@type":106,"acceptedAnswer":116},"How can you verify if a string attribute contains a specific value using XPath?",{"text":117,"@type":109},"You can use the 'contains' function with the syntax: [contains(@attribute, \"example\")].",{"name":119,"@type":106,"acceptedAnswer":120},"What is the method to select the first 'p' element using these tools?",{"text":121,"@type":109},"In CSS, you use 'p:first-of-type', and in XPath, you use the index expression '//p[1]'.","https://schema.org",{"og:url":78,"og:type":124,"og:title":59,"og:site_name":91,"og:description":61},"article",{"robots":126,"canonical":78},"index,follow",{"doc_id":128,"site_id":56},573294,1792122283,{"code":4,"msg":5,"data":131},{"doc_id":128,"user_id":132,"nickname":88,"user_avatar":133,"doc_module":9,"category_id":50,"category_name":51,"doc_title":59,"doc_description":61,"doc_content":60,"file_id":134,"file_url":135,"file_type":136,"file_size":137,"view_count":76,"is_deleted":4,"is_public":9,"is_downloadable":9,"audit_status":9,"page_count":9,"language":138,"language_code":57,"site_id":56,"html_lang":57,"table_of_contents":139,"faqs":140,"seo_title":141,"seo_description":61,"update_tm":142,"read_time":4},962090893581,"https://ap-avatar.wpscdn.com/davatar_276721f389ce27ea32af1340a28f341c","cbCailQgHgUf9qnL","https://ap.wps.com/l/cbCailQgHgUf9qnL","pdf",129790,"English","# Node and Attribute Selection\n## Position-based Selection\n## XPath Operators and Functions","[{\"question\":\"What is the difference between CSS and XPath for selecting all div elements?\",\"answer\":\"To select all div elements, the CSS selector is simply 'div', while the XPath expression is '//div'.\"},{\"question\":\"How do you select an element with a specific class in both CSS and XPath?\",\"answer\":\"For CSS, you use '[class=\\\"example\\\"]', and for XPath, you use '//*[ @class=\\\"example\\\"]'.\"},{\"question\":\"How can you verify if a string attribute contains a specific value using XPath?\",\"answer\":\"You can use the 'contains' function with the syntax: [contains(@attribute, \\\"example\\\")].\"},{\"question\":\"What is the method to select the first 'p' element using these tools?\",\"answer\":\"In CSS, you use 'p:first-of-type', and in XPath, you use the index expression '//p[1]'.\"}]","XPath and CSS Selector Cheatsheet - Web Element Identification Guide | PDF",1791936759]