Selenium

Menggunakan XPath dan Selenium untuk Menemukan Elemen di Halaman HTML

Menggunakan XPath dan Selenium untuk Menemukan Elemen di Halaman HTML
XPath, juga dikenal sebagai XML Path Language, adalah bahasa untuk memilih elemen dari dokumen XML. Karena HTML dan XML mengikuti struktur dokumen yang sama, XPath juga dapat digunakan untuk memilih elemen dari halaman web.

Menemukan dan memilih elemen dari halaman web adalah kunci untuk web scraping dengan Selenium. Untuk mencari dan memilih elemen dari halaman web, Anda dapat menggunakan pemilih XPath di Selenium.

Pada artikel ini, saya akan menunjukkan cara mencari dan memilih elemen dari halaman web menggunakan penyeleksi XPath di Selenium dengan perpustakaan Selenium python. Jadi, mari kita mulai.

Prasyarat:

Untuk mencoba perintah dan contoh artikel ini, Anda harus memiliki,

  1. Distribusi Linux (sebaiknya Ubuntu) diinstal pada komputer Anda.
  2. Python 3 diinstal di komputer Anda.
  3. PIP 3 diinstal di komputer Anda.
  4. Python virtualenv paket terinstal di komputer Anda.
  5. Peramban web Mozilla Firefox atau Google Chrome terpasang di komputer Anda.
  6. Harus tahu cara menginstal Firefox Gecko Driver atau Chrome Web Driver.

Untuk memenuhi persyaratan 4, 5, dan 6, baca artikel saya Pengantar Selenium dengan Python 3. Anda dapat menemukan banyak artikel tentang topik lain di LinuxHint.com. Pastikan untuk memeriksanya jika Anda memerlukan bantuan.

Menyiapkan Direktori Proyek:

Untuk menjaga semuanya tetap teratur, buat direktori proyek baru selenium-xpath/ sebagai berikut:

$ mkdir -pv Selenium-xpath/drivers

Navigasikan ke selenium-xpath/ direktori proyek sebagai berikut:

$cd Selenium-xpath/

Buat lingkungan virtual Python di direktori proyek sebagai berikut:

$ virtualenv .venv

Aktifkan lingkungan virtual sebagai berikut:

$ sumber .venv/bin/aktifkan

Instal pustaka Selenium Python menggunakan PIP3 sebagai berikut:

$pip3 instal selenium

Unduh dan instal semua driver web yang diperlukan di pengemudi/ direktori proyek. Saya telah menjelaskan proses mengunduh dan menginstal driver web di artikel saya Pengantar Selenium dengan Python 3.

Dapatkan Pemilih XPath menggunakan Alat Pengembang Chrome:

Di bagian ini, saya akan menunjukkan kepada Anda bagaimana menemukan pemilih XPath dari elemen halaman web yang ingin Anda pilih dengan Selenium menggunakan Alat Pengembang bawaan dari browser web Google Chrome.

Untuk mendapatkan pemilih XPath menggunakan browser web Google Chrome, buka Google Chrome, dan kunjungi situs web tempat Anda ingin mengekstrak data. Kemudian, tekan tombol kanan mouse (RMB) di area kosong halaman dan klik Memeriksa untuk membuka Alat Pengembang Chrome.

Anda juga dapat menekan + Bergeser + saya untuk membuka Alat Pengembang Chrome.

Alat Pengembang Chrome harus dibuka.

Untuk menemukan representasi HTML dari elemen halaman web yang Anda inginkan, klik pada Memeriksa(

) ikon, seperti yang ditandai pada tangkapan layar di bawah ini.

Kemudian, arahkan kursor ke elemen halaman web yang Anda inginkan dan tekan tombol kiri mouse (LMB) untuk memilihnya.

Representasi HTML dari elemen web yang Anda pilih akan disorot di in Elemen tab dari Alat Pengembang Chrome, seperti yang Anda lihat pada tangkapan layar di bawah ini.

Untuk mendapatkan pemilih XPath dari elemen yang Anda inginkan, pilih elemen dari Elemen tab dari Alat Pengembang Chrome dan klik kanan (RMB) di atasnya. Kemudian, pilih Salinan > Salin XPath, seperti yang ditandai pada tangkapan layar di bawah ini.

Saya telah menempelkan pemilih XPath di editor teks. Pemilih XPath terlihat seperti yang ditunjukkan pada gambar di bawah.

Dapatkan Pemilih XPath menggunakan Alat Pengembang Firefox:

Di bagian ini, saya akan menunjukkan kepada Anda bagaimana menemukan pemilih XPath dari elemen halaman web yang ingin Anda pilih dengan Selenium menggunakan Alat Pengembang bawaan dari browser web Mozilla Firefox.

Untuk mendapatkan pemilih XPath menggunakan browser web Firefox, buka Firefox dan kunjungi situs web tempat Anda ingin mengekstrak data. Kemudian, tekan tombol kanan mouse (RMB) di area kosong halaman dan klik Elemen Inspeksi (Q) untuk membuka Alat Pengembang Firefox.

Alat Pengembang Firefox harus dibuka.

Untuk menemukan representasi HTML dari elemen halaman web yang Anda inginkan, klik pada Memeriksa(

) ikon, seperti yang ditandai pada tangkapan layar di bawah.

Kemudian, arahkan kursor ke elemen halaman web yang Anda inginkan dan tekan tombol kiri mouse (LMB) untuk memilihnya.

Representasi HTML dari elemen web yang Anda pilih akan disorot di in Inspektur tab dari Alat Pengembang Firefox, seperti yang Anda lihat pada tangkapan layar di bawah ini.

Untuk mendapatkan pemilih XPath dari elemen yang Anda inginkan, pilih elemen dari Inspektur tab dari Alat Pengembang Firefox dan klik kanan (RMB) di atasnya. Kemudian, pilih Salinan > XPath seperti yang ditandai pada tangkapan layar di bawah ini.

Pemilih XPath dari elemen yang Anda inginkan akan terlihat seperti ini.

Mengekstrak Data dari Halaman Web menggunakan XPath Selector:

Di bagian ini, saya akan menunjukkan cara memilih elemen halaman web dan mengekstrak data darinya menggunakan pemilih XPath dengan pustaka Selenium Python.

Pertama, buat skrip Python baru ex01.py dan ketikkan baris kode berikut.

dari selenium impor webdriver
dari selenium.webdriver.umum.kunci impor Kunci
dari selenium.webdriver.umum.dengan mengimpor Oleh
pilihan = webdriver.Opsi Chrome()
pilihan.tanpa kepala = Benar
browser = webdriver.Chrome(executable_path="./driver/chromedriver",
pilihan = pilihan)
peramban.dapatkan("https://www.unixtimestamp.com/")
stempel waktu = browser.find_element_by_xpath('/html/body/div[1]/div[1]
/div[2]/div[1]/div/div/h3[2]')
print('Stempel waktu saat ini: %s' % (stempel waktu.teks.membagi (")[0]))
peramban.Menutup()

Setelah selesai, simpan ex01.py skrip python.

Baris 1-3 mengimpor semua komponen Selenium yang diperlukan.

Baris 5 membuat objek Opsi Chrome, dan baris 6 mengaktifkan mode tanpa kepala untuk browser web Chrome.

Baris 8 membuat Chrome peramban objek menggunakan chromedriver biner dari pengemudi/ direktori proyek.

Baris 10 memberitahu browser untuk memuat situs web unixtimestamp.com.

Baris 12 menemukan elemen yang memiliki data stempel waktu dari halaman menggunakan pemilih XPath dan menyimpannya di stempel waktu variabel.

Baris 13 mem-parsing data stempel waktu dari elemen dan mencetaknya di konsol.

Saya telah menyalin pemilih XPath dari yang ditandai h2 elemen dari unixtimestamp.com menggunakan Alat Pengembang Chrome.

Baris 14 menutup browser.

Jalankan skrip Python ex01.py sebagai berikut:

$ python3 ex01.py

Seperti yang Anda lihat, data stempel waktu dicetak di layar.

Di sini, saya telah menggunakan peramban.find_element_by_xpath(pemilih) metode. Satu-satunya parameter dari metode ini adalah pemilih, yang merupakan pemilih elemen XPath.

Dari pada peramban.temukan_elemen_oleh_xpath() metode, Anda juga dapat menggunakan peramban.find_element(Oleh, pemilih) metode. Metode ini membutuhkan dua parameter. Parameter pertama Oleh akan Oleh.XPATH karena kita akan menggunakan pemilih XPath, dan parameter kedua pemilih akan menjadi pemilih XPath itu sendiri. Hasilnya akan sama.

Untuk melihat caranya peramban.temukan_elemen() metode berfungsi untuk pemilih XPath, buat skrip Python baru ex02.py, salin dan tempel semua baris dari ex01.py untuk ex02.py dan ubah baris 12 seperti yang ditandai pada tangkapan layar di bawah ini.

Seperti yang Anda lihat, skrip Python ex02.py memberikan hasil yang sama dengan ex01.py.

$ python3 ex02.py

Itu peramban.temukan_elemen_oleh_xpath() dan peramban.temukan_elemen() metode yang digunakan untuk menemukan dan memilih satu elemen dari halaman web. Jika Anda ingin menemukan dan memilih beberapa elemen menggunakan pemilih XPath, maka Anda harus menggunakan peramban.temukan_elemen_oleh_xpath() atau peramban.temukan_elemen() metode.

Itu peramban.temukan_elemen_oleh_xpath() metode mengambil argumen yang sama dengan peramban.temukan_elemen_oleh_xpath() metode.

Itu peramban.temukan_elemen() metode mengambil argumen yang sama dengan peramban.temukan_elemen() metode.

Mari kita lihat contoh mengekstrak daftar nama menggunakan pemilih XPath dari nama-acak-generator.info dengan perpustakaan Selenium Python.

Daftar tidak berurutan (ol tag) memiliki 10 li tag di dalam masing-masing berisi nama acak. XPath untuk memilih semua li tag di dalam ol tag dalam hal ini adalah //*[@id=”main”]/div[3]/div[2]/ol//li

Mari kita lihat contoh memilih beberapa elemen dari halaman web menggunakan pemilih XPath.

Buat skrip Python baru ex03.py dan ketikkan baris kode berikut di dalamnya.

dari selenium impor webdriver
dari selenium.webdriver.umum.kunci impor Kunci
dari selenium.webdriver.umum.dengan mengimpor Oleh
pilihan = webdriver.Opsi Chrome()
pilihan.tanpa kepala = Benar
browser = webdriver.Chrome(executable_path="./driver/chromedriver",
pilihan = pilihan)
peramban.get("http://random-name-generator.info/")
nama = browser.temukan_elemen_oleh_xpath('
//*[@id="main"]/div[3]/div[2]/ol//li')
untuk nama dalam nama:
cetak(nama.teks)
peramban.Menutup()

Setelah selesai, simpan ex03.py skrip python.

Baris 1-8 sama dengan di ex01.py skrip python. Jadi, saya tidak akan menjelaskannya di sini lagi.

Baris 10 memberi tahu browser untuk memuat generator nama-acak situs web.info.

Baris 12 memilih daftar nama menggunakan peramban.temukan_elemen_oleh_xpath() metode. Metode ini menggunakan pemilih XPath //*[@id=”main”]/div[3]/div[2]/ol//li untuk menemukan daftar nama. Kemudian, daftar nama disimpan di nama variabel.

Pada baris 13 dan 14, a untuk loop digunakan untuk iterasi melalui nama daftar dan cetak nama di konsol.

Baris 16 menutup browser.

Jalankan skrip Python ex03.py sebagai berikut:

$ python3 ex03.py

Seperti yang Anda lihat, nama-nama diekstraksi dari halaman web dan dicetak di konsol.

Alih-alih menggunakan peramban.temukan_elemen_oleh_xpath() metode, Anda juga dapat menggunakan peramban.temukan_elemen() metode seperti sebelumnya. Argumen pertama dari metode ini adalah Oleh.XPATH, dan argumen kedua adalah pemilih XPath.

Untuk bereksperimen dengan peramban.temukan_elemen() metode, buat skrip Python baru ex04.py, salin semua kode dari ex03.py untuk ex04.py, dan ubah baris 12 seperti yang ditandai pada tangkapan layar di bawah.

Anda harus mendapatkan hasil yang sama seperti sebelumnya.

$ python3 ex04.py

Dasar-dasar Pemilih XPath:

Alat Pengembang Firefox atau browser web Google Chrome menghasilkan pemilih XPath secara otomatis. Tetapi pemilih XPath ini terkadang tidak cukup untuk proyek Anda your. Dalam hal ini, Anda harus tahu apa yang dilakukan pemilih XPath tertentu untuk membangun pemilih XPath Anda. Di bagian ini, saya akan menunjukkan kepada Anda dasar-dasar pemilih XPath. Kemudian, Anda harus dapat membuat pemilih XPath Anda sendiri.

Buat direktori baru www/ di direktori proyek Anda sebagai berikut:

$ mkdir -v www

Buat file baru web01.html dalam www/ direktori dan ketik baris berikut di file itu.






Dokumen HTML Dasar


Halo Dunia



Setelah selesai, simpan web01.html mengajukan.

Jalankan server HTTP sederhana pada port 8080 menggunakan perintah berikut:

$ python3 -m http.server --direktori www/ 8080

Server HTTP harus dimulai.

Anda harus dapat mengakses web01.html file menggunakan URL http://localhost:8080/web01.html, seperti yang Anda lihat pada tangkapan layar di bawah ini.

Saat Firefox atau Alat Pengembang Chrome dibuka, tekan + F untuk membuka kotak pencarian. Anda dapat mengetikkan pemilih XPath Anda di sini dan melihat apa yang dipilihnya dengan sangat mudah. Saya akan menggunakan alat ini di seluruh bagian ini.

Selektor XPath dimulai dengan a garis miring (/) sebagian besar waktu. Ini seperti pohon direktori Linux. Itu / adalah akar dari semua elemen di halaman web.

Elemen pertama adalah html. Jadi, pemilih XPath /html memilih seluruh html menandai.

Di dalam html tag, kami memiliki tubuh menandai. Itu tubuh tag dapat dipilih dengan pemilih XPath /html/tubuh

Itu h1 header ada di dalam tubuh menandai. Itu h1 header dapat dipilih dengan pemilih XPath /html/body/h1

Jenis pemilih XPath ini disebut pemilih jalur absolut. Di pemilih jalur absolut, Anda harus melintasi halaman web dari akar (/) halaman. Kerugian dari pemilih jalur absolut adalah bahwa bahkan sedikit perubahan pada struktur halaman web dapat membuat pemilih XPath Anda tidak valid. Solusi untuk masalah ini adalah pemilih XPath relatif atau parsial.

Untuk melihat cara kerja jalur relatif atau jalur parsial, buat file baru web02.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.






Dokumen HTML Dasar


Halo Dunia



ini pesan




Halo Dunia


Setelah selesai, simpan web02.html file dan muat di browser web Anda.

Seperti yang Anda lihat, pemilih XPath //div/p memilih p tandai di dalam div menandai. Ini adalah contoh pemilih XPath relatif.

Selektor XPath relatif dimulai dengan //. Kemudian Anda menentukan struktur elemen yang ingin Anda pilih. Pada kasus ini, div/p.

Begitu, //div/p berarti pilih p elemen di dalam a div elemen, tidak peduli apa yang datang sebelumnya.

Anda juga dapat memilih elemen dengan atribut yang berbeda seperti Indo, kelas, Tipe, dll. menggunakan pemilih XPath. Mari kita lihat bagaimana melakukannya.

Buat file baru web03.html dalam www/ direktori dan ketik baris kode berikut di dalamnya.






Dokumen HTML Dasar


Halo Dunia



ini pesan


ini pesan lain


pos 2


Lorem ipsum dolor sit amet consectetur, adipisicing elit. Quibusdam
eligendi doloribus sapiente, molestias quos quae non nam incidunt quis delectus
facilis magni officis alias neque atque fuga? Unde, aut natus?




ini footernya


Setelah selesai, simpan web03.html file dan muat di browser web Anda.

Katakanlah Anda ingin memilih semua div elemen yang memiliki kelas nama wadah1. Untuk melakukan itu, Anda dapat menggunakan pemilih XPath //div[@class='container1']

Seperti yang Anda lihat, saya memiliki 2 elemen yang cocok dengan pemilih XPath //div[@class='container1']

Untuk memilih yang pertama div elemen dengan kelas nama wadah1, Menambahkan [1] di akhir XPath pilih, seperti yang ditunjukkan pada gambar di bawah.

Dengan cara yang sama, Anda dapat memilih yang kedua div elemen dengan kelas nama wadah1 menggunakan pemilih XPath //div[@class='container1'][2]

Anda dapat memilih elemen dengan Indo demikian juga.

Misalnya, untuk memilih elemen yang memiliki Indo dari footer-msg, anda dapat menggunakan pemilih XPath //*[@id='footer-msg']

Di sini, * sebelum [@id='footer-msg'] digunakan untuk memilih elemen apa pun terlepas dari tagnya.

Itulah dasar-dasar pemilih XPath. Sekarang, Anda harus dapat membuat pemilih XPath Anda sendiri untuk proyek Selenium Anda.

Kesimpulan:

Dalam artikel ini, saya telah menunjukkan kepada Anda cara menemukan dan memilih elemen dari halaman web menggunakan pemilih XPath dengan pustaka Selenium Python. Saya juga telah membahas pemilih XPath yang paling umum common. Setelah membaca artikel ini, Anda akan merasa cukup percaya diri memilih elemen dari halaman web menggunakan pemilih XPath dengan perpustakaan Selenium Python.

Game Remaster HD untuk Linux yang Belum Pernah Rilis Linux Sebelumnya
Banyak pengembang dan penerbit game datang dengan remaster HD dari game lama untuk memperpanjang umur waralaba, harap penggemar meminta kompatibilitas...
Cara Menggunakan AutoKey untuk Mengotomatiskan Game Linux
AutoKey adalah utilitas otomatisasi desktop untuk Linux dan X11, diprogram dengan Python 3, GTK dan Qt. Dengan menggunakan skrip dan fungsionalitas MA...
Cara Menampilkan Penghitung FPS di Game Linux
Game Linux mendapat dorongan besar ketika Valve mengumumkan dukungan Linux untuk klien Steam dan game mereka pada tahun 2012. Sejak itu, banyak game A...