Чтобы получить все метатеги (с их содержимым) из 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)

Вывод:
console.table output
(Чисто и структурированно, без VM....)

Почему появляется VM...?

  • Это внутренний механизм Chrome/Edge для отладки.
  • Он показывает, что код выполнен в виртуальном окружении (например, в консоли).
  • Если запускать код внутри <script> на реальной странице, этого префикса не будет.

Итог

Если хотите чистый вывод:

  1. Используйте outerHTML (console.log(tag.outerHTML)).
  2. Либо собирайте всё в одну строку и выводите за раз.
  3. Либо используйте console.table() для удобного просмотра.

От admin

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *