Hướng dẫn what is the difference between xpath and css selectors? - sự khác biệt giữa bộ chọn xpath và css là gì?
Cả XPath và CSS đều là một trong những người định vị được sử dụng thường xuyên nhất trong selen. Mặc dù có các trình định vị khác như ID, tên, ClassName, TagName và văn bản liên kết, v.v., XPath và CSS được sử dụng khi không có thuộc tính duy nhất nào có sẵn để xác định các yếu tố. Show Có một số khác biệt giữa XPath và CSS được liệt kê dưới đây -
Thí dụThực hiện mã với CSS. from selenium import webdriver #browser exposes an executable file #Through Selenium test we will invoke the executable file which will then #invoke actual browser driver = webdriver.Chrome(executable_path="C:\chromedriver.exe") # to maximize the browser window driver.maximize_window() #get method to launch the URL driver.get("https://www.tutorialspoint.com/index.htm") #to refresh the browser driver.refresh() # identifying the edit box with the help of css driver. find_element_by_css_selector("input[class='gsc-input']"). send_keys("Selenium") #to close the browser driver.close() Thực hiện mã với XPath from selenium import webdriver #browser exposes an executable file #Through Selenium test we will invoke the executable file which will then #invoke actual browser driver = webdriver.Chrome(executable_path="C:\chromedriver.exe") # to maximize the browser window driver.maximize_window() #get method to launch the URL driver.get("https://www.tutorialspoint.com/index.htm") #to refresh the browser driver.refresh() # identifying the edit box with the help of xpath driver. find_element_by_xpath("//input[@class='gsc-input']"). send_keys("Selenium") #to close the browser driver.close()
Cập nhật vào ngày 29 tháng 1-2020 07:38:10
Có một số khác biệt giữa bộ chọn XPath và CSS. Định dạng của XPath là // TagName [@Aperty = 'value'] trong khi định dạng của bộ chọn CSS là TagName [thuộc tính = 'value']. Chúng ta có thể đi qua cả về phía trước và lùi trong DOM, tức là chúng ta có thể chuyển từ cha mẹ sang phần tử con và từ con cái sang phần tử cha với XPath. Tuy nhiên, đối với CSS, chúng ta chỉ có thể đi qua từ cha mẹ sang con chứ không phải ngược lại. Về hiệu suất, CSS tốt hơn và nhanh hơn, trong khi XPath ở phía chậm hơn. Một XPath có thể có hai loại - tuyệt đối bắt đầu từ nút gốc và tương đối không cần phải bắt đầu từ gốc. Để đi qua phần tử thứ n, chúng ta phải đề cập đến [n] trong XPath, trong đó n là số chỉ mục. Đối với CSS, chúng ta phải đề cập đến loại thứ hai (N). Ví dụ, để có được đứa con Li thứ hai của cha mẹ UL, biểu thức CSS sẽ là ul li: nth-of-type (2). Trong khi XPath sẽ là ul/li [2]. Chúng ta có thể tạo một XPath với sự trợ giúp của văn bản có thể nhìn thấy trên phần tử bằng cách sử dụng hàm văn bản () trang. Tính năng này không có sẵn trong CSS. Chúng ta có hàm khởi động với () trong XPath được sử dụng để xác định một phần tử có giá trị thuộc tính bắt đầu bằng một văn bản cụ thể. Để đối phó với một kịch bản tương tự trong CSS, chúng ta phải sử dụng ký hiệu ^=. Ví dụ trong CSS, in css, input[title^='qa'] Ví dụ trong XPath, in xpath, //input[starts-with(@title, 'qa')]. [Ở đây đầu vào là tên thẻ và giá trị của thuộc tính tiêu đề bắt đầu bằng QA]. Chúng ta có hàm chứa () trong XPath được sử dụng để xác định một phần tử có giá trị thuộc tính chứa một văn bản một phần. Để đối phó với một kịch bản tương tự trong CSS, chúng tôi sử dụng biểu tượng *= ký hiệu Ví dụ trong CSS, in css, input[title*='nam'] Ví dụ trong XPath, in xpath, //input[contains(@title, 'nam')].
//input[starts-with(@title, 'qa')]. [Ở đây đầu vào là tên thẻ và giá trị của thuộc tính tiêu đề bắt đầu bằng QA]. Chúng ta có hàm chứa () trong XPath được sử dụng để xác định một phần tử có giá trị thuộc tính chứa một văn bản một phần. Để đối phó với một kịch bản tương tự trong CSS, chúng tôi sử dụng biểu tượng *= ký hiệu Cú phápWebElement m = driver.findElement(By.xpath("//div[@class = 'loc']")); WebElement n = driver.findElement(By.cssSelector("div[class = 'loc']")); Thí dụimport org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import java.util.concurrent.TimeUnit; public class LocatorXpathvsCss{ public static void main(String[] args) { System.setProperty("webdriver.gecko.driver", "C:\Users\ghs6kor\Desktop\Java\geckodriver.exe"); WebDriver driver = new FirefoxDriver(); //implicit wait driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS); //URL launch driver.get("https://www.tutorialspoint.com/online_dev_tools.htm"); // identify element with xpath WebElement m=driver.findElement(By.xpath("//span[@class = 'cat-title']")); String str = m.getText(); // identify element with css WebElement n=driver. findElement(By.cssSelector("div.cat-punch-line span")); String s = n.getText(); System.out.println("Text obtained from xpath : " + str); System.out.println("Text obtained from css : " + s); driver.quit(); } } Đầu ra
Cập nhật vào ngày 06 tháng 4 năm 2021 10:57:45
Sự khác biệt giữa bộ chọn XPath và CSS trong selenium là gì?Chúng ta có thể đi qua cả về phía trước và lùi trong DOM, tức là chúng ta có thể chuyển từ cha mẹ sang phần tử con và từ con cái sang phần tử cha với XPath. Tuy nhiên, đối với CSS, chúng ta chỉ có thể đi qua từ cha mẹ sang con chứ không phải ngược lại. Về hiệu suất, CSS tốt hơn và nhanh hơn, trong khi XPath ở phía chậm hơn.css is better and faster, while xpath is on a slower side.
Bộ chọn XPath hoặc CSS tốt hơn là gì?Ưu điểm và nhược điểm của hiệu suất của bộ chọn CSS là giống nhau hoặc nhanh hơn so với XPath. Dễ học hơn XPath, dễ sử dụng hơn. Bộ chọn CSS chỉ cho phép lưu lượng đơn hướng. Sử dụng bộ chọn CSS, chúng ta chỉ có thể đi từ cha mẹ sang con nhưng không phải từ trẻ đến cha mẹ, điều này có thể xảy ra với XPath.Performance is the same or faster compared to XPath. Easier to learn than XPath, easier to use. CSS Selector only allows unidirectional flow. Using a CSS Selector, we can only traverse from parent to child but not from the child to parent, which is possible with XPath.
Tại sao chúng ta thích XPath hơn bộ chọn CSS?Ưu điểm của việc sử dụng XPath XPath cho phép bạn điều hướng DOM khi tìm kiếm các phần tử để kiểm tra hoặc cạo.Nó tương thích với các trình duyệt cũ (hoặc tại thời điểm xuất bản, bao gồm các phiên bản cũ hơn của Internet Explorer, mà một số tập đoàn vẫn sử dụng).Tạo trong XPath linh hoạt hơn trong bộ chọn CSS.XPath allows you to navigate up the DOM when looking for elements to test or scrape. It's compatible with old browsers (or it was at time of publishing—including older versions of Internet Explorer, which some corporations still use). Creating in XPath is more flexible than in CSS Selector.
Điều gì phân biệt XPath với các bộ chọn CSS về khả năng?Xin chào Ushma, sự khác biệt chính giữa các bộ chọn XPath và CSS là, với XPath, chúng ta có thể đi qua cả về phía trước và lùi trong khi bộ chọn CSS chỉ di chuyển về phía trước.Mặc dù các bộ chọn CSS hoạt động tốt hơn nhiều so với XPath và nó được ghi nhận rõ ràng trong cộng đồng Selenium.with the XPath we can traverse both forward and backward whereas CSS selector only moves forward. Although CSS selectors perform far better than Xpath and it is well documented in Selenium community. |