Чтобы получить все метатеги (с их содержимым) из HTML-страницы, можно использовать несколько подходов в зависимости от среды выполнения:
1. JavaScript в браузере
Если вам нужно извлечь метатеги на клиентской стороне (в браузере), можно использовать document.querySelectorAll():
const metaTags = document.querySelectorAll('meta');
metaTags.forEach((tag) => {
const attributes = Array.from(tag.attributes)
.map(attr => `${attr.name}="${attr.value}"`)
.join(' ');
console.log(`<meta ${attributes}>`);
});Code language: JavaScript (javascript)
Вывод:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Пример страницы">
...Code language: HTML, XML (xml)
2. Python (с BeautifulSoup или lxml)
Если нужно распарсить HTML-файл или страницу на сервере:
С использованием BeautifulSoup
from bs4 import BeautifulSoup
import requests
url = "https://example.com"
response = requests.get(url)
soup = BeautifulSoup(response.text, 'html.parser')
meta_tags = soup.find_all('meta')
for tag in meta_tags:
print(tag)Code language: JavaScript (javascript)
Вывод:
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Пример сайта" />
...Code language: HTML, XML (xml)
С использованием lxml
from lxml.html import fromstring
import requests
url = "https://example.com"
response = requests.get(url)
tree = fromstring(response.content)
meta_tags = tree.xpath('//meta')
for tag in meta_tags:
print(f"<meta {' '.join([f'{k}=\"{v}\"' for k, v in tag.items()])}>")Code language: JavaScript (javascript)
3. PHP
Если нужно получить метатеги на сервере (PHP):
$html = file_get_contents('https://example.com');
$dom = new DOMDocument();
@$dom->loadHTML($html); // @ подавляет предупреждения
$metaTags = $dom->getElementsByTagName('meta');
foreach ($metaTags as $tag) {
echo '<meta';
foreach ($tag->attributes as $attr) {
echo " {$attr->name}=\"{$attr->value}\"";
}
echo '>' . PHP_EOL;
}Code language: PHP (php)
Вывод:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...Code language: HTML, XML (xml)
4. Bash (с использованием curl и grep)
Если нужно быстро извлечь метатеги из HTML через командную строку:
curl -s https://example.com | grep -o '<meta [^>]*>' Code language: HTML, XML (xml)
Вывод:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...Code language: HTML, XML (xml)
Вывод
- В браузере → используйте
document.querySelectorAll('meta'). - На Python →
BeautifulSoupилиlxml. - На PHP →
DOMDocument. - В командной строке →
curl + grep.
При выводе в консоль браузеры (особенно Chrome и Edge) добавляют префикс вида VM<номер>:<строка>, чтобы указать, откуда пришло сообщение. Это служебная информация, которая помогает в отладке, но её можно убрать.
Как вывести метатеги без VM...?
Есть несколько способов:
1. Использовать console.log без форматирования
const metaTags = document.querySelectorAll('meta');
metaTags.forEach((tag) => {
const attributes = Array.from(tag.attributes)
.map(attr => `${attr.name}="${attr.value}"`)
.join(' ');
console.log(tag.outerHTML); // или просто вывести outerHTML
});Code language: JavaScript (javascript)
Почему это работает?
tag.outerHTMLвозвращает строку в исходном виде, и Chrome не добавляетVM...при таком выводе.
2. Собирать всё в одну строку и выводить за раз
const metaTags = document.querySelectorAll('meta');
let output = '';
metaTags.forEach((tag) => {
const attributes = Array.from(tag.attributes)
.map(attr => `${attr.name}="${attr.value}"`)
.join(' ');
output += `<meta ${attributes}>\n`;
});
console.log(output); // выводим всё сразуCode language: JavaScript (javascript)
Результат:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...Code language: HTML, XML (xml)
(Без VM..., так как один console.log вместо нескольких.)
3. Использовать console.table() для красивого вывода
const metaTags = document.querySelectorAll('meta');
const metaData = Array.from(metaTags).map(tag =>
Object.fromEntries(Array.from(tag.attributes, attr => [attr.name, attr.value])
);
console.table(metaData);Code language: JavaScript (javascript)
Вывод:
(Чисто и структурированно, без VM....)
Почему появляется VM...?
- Это внутренний механизм Chrome/Edge для отладки.
- Он показывает, что код выполнен в виртуальном окружении (например, в консоли).
- Если запускать код внутри
<script>на реальной странице, этого префикса не будет.
Итог
Если хотите чистый вывод:
- Используйте
outerHTML(console.log(tag.outerHTML)). - Либо собирайте всё в одну строку и выводите за раз.
- Либо используйте
console.table()для удобного просмотра.
