Leapcell: بهترین میزبانی وب بدون سرور
I. مقدمه
به عنوان زبان اساسی برای صفحات وب ، HTML (زبان نشانه گذاری HyperText) به طور گسترده در زمینه هایی مانند پردازش داده های وب و توسعه وب استفاده می شود. این که آیا توسعه دهندگان ساختار وب را بهینه می کنند یا تحلیلگران داده اطلاعات را از صفحات وب استخراج می کنند ، پردازش HTML ضروری است. این آموزش بر روی عملیات اصلی مانند تجزیه و تحلیل HTML ، اصلاح و استخراج داده ها متمرکز است و به خوانندگان کمک می کند تا روش ها و تکنیک های جامع برای دستیابی به HTML را تسلط دهند.
ii. بررسی اصول HTML
2.1 ساختار اساسی HTML
یک سند HTML استاندارد با شروع می شود declaration and includes the root element, which nests two main sections: and . The section typically contains meta-information about the page, such as titles, character encodings, and links to CSS stylesheets. The section holds the visible content of the page, including text, images, links, forms, and other elements.
lang="en">
charset="UTF-8">
2.2 عناصر و ویژگی های HTML
HTML از عناصر مختلفی تشکیل شده است که توسط برچسب ها نشان داده شده است ، مانند for paragraphs and برای پیوندها عناصر می توانند شامل ویژگی هایی باشند که اطلاعات اضافی را تعریف می کنند. به عنوان مثال ، href ویژگی در آدرس هدف پیوند را مشخص می کند. ویژگی ها به طور معمول در جفت “ارزش نام” هستند و مقادیر ویژگی باید در نقل قول ها محصور شوند.
iii تجزیه HTML
3.1 ابزار و کتابخانه تجزیه
در محیط های مختلف توسعه ، چندین ابزار و کتابخانه می توانند HTML را تجزیه کنند:
- مرورگرها: مرورگرها دارای موتورهای قدرتمند تجزیه و تحلیل HTML هستند که کد HTML را به صفحات بصری منتقل می کنند. از طریق ابزارهای توسعه دهنده مرورگر (به عنوان مثال ، Chrome Devtools) ، می توانید ساختار تجزیه شده DOM (مدل شیء سند) را مشاهده کرده و سبک ها و ویژگی های عنصر را تجزیه و تحلیل کنید.
-
کتابخانه های پایتون:
- گروه زیبا: یکی از متداول ترین کتابخانه های تجزیه کننده HTML در پایتون ، به راحتی اسناد HTML و XML را تجزیه می کند و یک API ساده را برای پیمایش ، جستجو و اصلاح درخت پارس فراهم می کند.
- LXML: یک کتابخانه پایتون که بر روی کتابخانه های libxml2 و libxslt ساخته شده است ، به سرعت تجزیه می شود ، از تجزیه HTML و XML پشتیبانی می کند و می تواند با بیان XPath برای استخراج داده های کارآمد استفاده شود.
- html5lib: این کتابخانه HTML را به روشی بسیار شبیه به مرورگرهای مدرن تجزیه می کند ، و آن را برای رسیدگی به کد HTML نامنظم مناسب می کند.
-
جاذب: در یک محیط مرورگر ، JavaScript می تواند DOM را با استفاده از روش های ارائه شده توسط
documentشیء ، مانندgetElementByIdوتgetElementsByTagName، برای تجزیه و کار در HTML. در یک محیط node.js ، کتابخانه ها مانندjsdomمی تواند یک محیط مرورگر را برای تجزیه HTML شبیه سازی کند.
3.2 تجزیه HTML با پایتون
3.2.1 نمونه تجزیه و تحلیل زیبا
ابتدا کتابخانه زیبا را نصب کنید:
pip install beautifulsoup4
در اینجا کد اساسی برای تجزیه HTML با زیبا وجود دارد:
from bs4 import BeautifulSoup
html_doc = """
Sample Page
"intro">This is an introductory paragraph.
"content">Here is some content.
"""
soup = BeautifulSoup(html_doc, 'html.parser') # Use Python's built-in parser
# Can also use other parsers, e.g., lxml: soup = BeautifulSoup(html_doc, 'lxml')
print(soup.title.string) # Output: Sample Page
3.2.2 LXML مثال تجزیه
کتابخانه LXML را نصب کنید:
pip install lxml
از LXML برای تجزیه HTML و استخراج داده ها از طریق XPath استفاده کنید:
from lxml import etree
html = """
"box">
First paragraph
Second paragraph
"""
tree = etree.HTML(html)
paragraphs = tree.xpath('//div[@class="box"]/p/text()')
print(paragraphs) # Output: ['First paragraph', 'Second paragraph']
IV پیمایش و جستجو در درخت اسناد HTML
4.1 پیمایش درخت اسناد HTML
به عنوان نمونه از گروه زیبا استفاده کنید: پس از تجزیه ، سند HTML یک درخت اسناد را تشکیل می دهد ، که می تواند به روش های مختلفی حرکت کند:
-
دسترسی به عناصر کودک: شما می توانید با نام برچسب ، به طور مستقیم به عناصر کودک دسترسی پیدا کنید ، به عنوان مثال
soup.body.pبه اولین دسترسی پیدا می کندelement under theelement. You can also use thecontentsویژگی برای دریافت لیستی از عناصر کودک یاchildrenویژگی های تکرار عناصر کودک به عنوان ژنراتور. -
دسترسی به عناصر والدین: از
parentویژگی برای به دست آوردن والدین مستقیم عنصر فعلی ، وparentsویژگی برای بازگشت مجدد به همه عناصر اجداد. -
دسترسی به عناصر خواهر و برادر:
next_siblingوتprevious_siblingویژگی ها به ترتیب عناصر خواهر و برادر بعدی و قبلی را به دست می آورند. درnext_siblingsوتprevious_siblingsویژگی های تکرار بیش از همه خواهر و برادرهای بعدی.
4.2 جستجوی درخت سند HTML
-
find_all()روش: زیباfind_all()روش جستجو برای همه عناصری که با معیارهای مشخص شده مطابقت دارند ، که می توانند با نام برچسب ، ویژگی ها و غیره فیلتر شوند ، به عنوان مثال ، برای یافتن همهtags:soup.find_all('p)؛ برای یافتن همه عناصر با کلاسcontent:soup.find_all(class_='content')بشر -
find()روش:find()روش اولین عنصری را که مطابق با معیارها است ، برمی گرداند ، به عنوان مثالsoup.find('a')اول را برمی گرداندعنصر در سند. -
انتخاب کنندگان CSS: از
select()روش با نحو انتخاب کننده CSS برای جستجوی عنصر انعطاف پذیر تر. به عنوان مثال ، برای انتخاب همهelements with the classbox:soup.select('div.box)؛ برای انتخاب همهmain:soup.select('#main li)بشر
V. اصلاح HTML
5.1 تغییر ویژگی های عنصر
هر دو کتابخانه پایتون و JavaScript می توانند به راحتی ویژگی های عنصر HTML را تغییر دهند.
from bs4 import BeautifulSoup html = """ "https://old-url.com">Old Link """ soup = BeautifulSoup(html, 'html.parser') link = soup.find('a') link['href'] = 'https://new-url.com' # Modify the href attribute print(soup.prettify())lang="en"> charset="UTF-8">id="myImage" src="old-image.jpg" alt="Old Image"> const image = document.getElementById('myImage'); image.src = 'new-image.jpg'; // Modify the src attribute
5.2 اضافه کردن و حذف عناصر
-
پایتون (زیبا):
from bs4 import BeautifulSoup html = """ """ soup = BeautifulSoup(html, 'html.parser') ul = soup.find('ul') new_li = soup.new_tag('li') new_li.string = 'New Item' ul.append(new_li) # Add a new elementfrom bs4 import BeautifulSoup html = """"removeMe">This paragraph will be removed.
""" soup = BeautifulSoup(html, 'html.parser') p = soup.find('p', id='removeMe') p.decompose() # Remove the element -
جاذب:
lang="en"> charset="UTF-8">id="parentDiv">
const parentDiv = document.getElementById('parentDiv'); const newParagraph = document.createElement('p'); newParagraph.textContent = 'This is a new paragraph.'; parentDiv.appendChild(newParagraph); // Add a new elementlang="en"> charset="UTF-8">id="removeParagraph">This paragraph will be removed.
const paragraph = document.getElementById('removeParagraph'); paragraph.remove(); // Remove the element
vi استخراج داده HTML
6.1 استخراج محتوای متن
-
پایتون (زیبا): از
stringویژگی یاget_text()روش برای به دست آوردن محتوای متن در یک عنصر. به عنوان مثال:
from bs4 import BeautifulSoup html = """"text">Extract this text.
""" soup = BeautifulSoup(html, 'html.parser') text = soup.find('p', class_='text').string print(text) # Output: Extract this text.-
جاذب: از
textContentیاinnerTextویژگی هایی برای دریافت محتوای متن ، به عنوان مثالconst element = document.getElementById('myElement'); const text = element.textContent;بشر
6.2 استخراج مقادیر ویژگی
هر دو پایتون و جاوا اسکریپت به راحتی می توانند مقادیر ویژگی عنصر HTML را استخراج کنند. به عنوان مثال ، برای استخراج
hrefمقدار ویژگی یکبرچسب:-
پایتون (زیبا):
href = soup.find('a')['href'] -
جاذب:
const link = document.querySelector('a'); const href = link.getAttribute('href');
6.3 استخراج داده های پیچیده
در برنامه های دنیای واقعی ، داده ها اغلب باید از ساختارهای پیچیده HTML استخراج شوند-برای مثال ، استخراج نام محصولات ، قیمت ها و پیوندها از صفحه وب با لیست محصول. در چنین مواردی ، حلقه ها و شرط ها را با روش های ناوبری و جستجو در بالا ترکیب کنید تا داده های مورد نیاز را طی کنید و استخراج کنید:
from bs4 import BeautifulSoup import requests url = "https://example.com/products" response = requests.get(url) soup = BeautifulSoup(response.text, 'html.parser') products = [] for product_div in soup.find_all('div', class_='product'): name = product_div.find('h2', class_='product-name').string price = product_div.find('span', class_='product-price').string link = product_div.find('a')['href'] products.append({'name': name, 'price': price, 'link': link}) print(products)vii دست زدن به HTML نامنظم
در عمل ، کد HTML اغلب دارای قالبهای نامنظم مانند برچسب های بدون قفل یا نقل قول های ویژگی های گمشده است. تجزیه کنندگان مختلف HTML نامنظم را به طور متفاوتی اداره می کنند:
- html5lib: این تجزیه کننده به طور مشابه با مرورگرها رفتار می کند و با تلاش برای اصلاح ساختارهای نادرست می تواند HTML نامنظم را بهتر انجام دهد.
-
LXML: تجزیه کننده LXML نسبتاً سختگیرانه است اما تحمل گسل دارد. هنگام پردازش HTML به شدت نامنظم ، ممکن است ابتدا آن را از پیش پردازش کنید یا از آن استفاده کنید
lxml.etree.HTMLParserباrecover=Trueپارامتر برای فعال کردن حالت بازیابی. - گروه زیبا: این HTML نامنظم را بر اساس ویژگی های تجزیه کننده انتخاب شده انجام می دهد. برای اسناد پیچیده نامنظم ، توصیه می شود در اولویت بندی تجزیه کننده HTML5LIB قرار بگیرید.
viii بهینه سازی عملکرد و بهترین شیوه ها
8.1 انتخاب تجزیه کننده راست
بر اساس نیازهای خاص ، یک تجزیهر را انتخاب کنید:
- LXML: ایده آل برای سرعت وقتی HTML نسبتاً استاندارد است.
- html5lib: مناسب تر برای رسیدگی به HTML نامنظم.
- html.parser (داخلی پایتون): نیازهای اساسی را با سادگی و نیازهای عملکرد متوسط برآورده می کند.
8.2 کاهش تجزیه زایمان
هنگام پردازش چندین اسناد HTML یا چندین بار روی همان سند کار کنید ، از تجزیه زائد خودداری کنید. نتایج جدا شده حافظه نهان یا تمام عملیات مرتبط را در یک پاس تجزیه و تحلیل انجام دهید.
8.3 با استفاده از روش های جستجو مناسب
هنگام جستجوی عناصر ، از شرایط فیلتر دقیق تر برای کاهش گذرگاه غیر ضروری استفاده کنید. به عنوان مثال ، انتخاب کنندگان CSS یا عبارات XPATH می توانند با کارآمدتر عناصر هدف را پیدا کنند.
ix پایان
از طریق این آموزش ، شما به طور جامع تمام جنبه های پردازش HTML ، از جمله ساختارهای اساسی ، روش های تجزیه ، ناوبری درخت اسناد ، عملیات اصلاح ، استخراج داده ها و تکنیک های دستیابی به HTML نامنظم را آموخته اید. در عمل ، انتخاب ابزارها و روشهای مناسب بر اساس سناریوهای خاص ، ضمن تمرکز بر بهینه سازی عملکرد و بهترین شیوه ها ، به شما در انجام کارآمدتر کارهای پردازش HTML کمک می کند. چه در توسعه وب و چه در جمع آوری داده ها ، تسلط بر مهارت های پردازش HTML ، کار شما را تا حد زیادی تسهیل می کند.
این آموزش جنبه های اصلی پردازش HTML را در بر می گیرد. اگر در طول یادگیری موارد استفاده خاصی دارید یا می خواهید در یک بخش خاص عمیق تر شیرجه بزنید ، در هر زمان با ما ارتباط برقرار کنید.
سرانجام ، ما بهترین بستر را برای استقرار خدمات پایتون توصیه می کنیم: جهش
🚀 با زبان مورد علاقه خود بسازید
با زحمت در JavaScript ، Python ، Go یا Rust.
🌍 پروژه های نامحدود را به صورت رایگان مستقر کنید
فقط آنچه را که استفاده می کنید بپردازید - بدون درخواست ، بدون هزینه.
⚡ پرداخت به عنوان شما ، بدون هزینه های پنهان
بدون هزینه بیکار ، فقط مقیاس پذیری بدون درز.
📖 اسناد ما را کاوش کنید
🔹 ما را در توییتر دنبال کنید: leapcellhq
-
