Необязательный baseURI (местоположение) в DOMParser?

// html data loaded from [http://example.org/some/path]
let htmlSource = `<!DOCTYPE html><html><head></head><body>
 ... <a href = "relative"></a> ... 
</body></html>`;

const dom = new DOMParser().parseFromString(htmlSource, 'text/html');

// this returns the value of the attribute as is
dom.links[0].getAttribute('href'); // -> "relative" / nothing new here

// this should resolve urls
dom.links[0].href // -> wait, relative to WHAT??

// if you run this code while being on [http://google.com] you'll get
dom.links[0].href // -> "https://www.google.com/relative"

// Also,

dom.location // -> null / you can't change it

dom.baseURI // -> "https://www.google.com/" / read-only

Таким образом, похоже, что DOMParser неявно заставляет использовать текущую страницу location как baseURI для новых HTMLDocument.

Почему бы не дать разработчику возможность (третий аргумент?) явно указать местоположение документа?

Есть ли способ заставить DOMParser учитывать необязательный базовый URL? Обходные пути?

url dom uri relative-path domparser

19.03.2019 01:58

Стоит ли изучать PHP в 2026-2027 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Пользовательский скаляр GraphQL

Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...

412

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы должны использовать тег base внутри html-кода, вы даже можете добавить его динамически. Вот ваш пример:

const htmlSource = `
<!DOCTYPE html>
<html>
 <head>
  <base href = "https://www.example.com/">
 </head>
 <body>
  <a href = "relative"></a>
 </body>
</html>`;

const dom = new DOMParser().parseFromString(htmlSource, 'text/html');
console.info('DOM link ->', dom.links[0].href);

Выведет:

DOM link -> https://www.example.com/relative

Добавьте его динамически:

let baseEl = dom.createElement('base');
baseEl.setAttribute('href', 'https://www.example.com');
dom.head.append(baseEl);

Хороший. Я бы добавил проверку наличия базового элемента if (dom.head.getElementsByTagName('base').length == 0)

— 20.04.2019 06:56

10.04.2019 08:28

Другие вопросы по теме

Эффективно ли хранить ссылку на всех дочерних элементов в списке?

Создание флажков MDL с помощью JavaScript

Как собрать текст внутри HTML-ссылок через регулярное выражение?

Как получить html-данные из «этого» объекта — ванильный JavaScript

Как я могу заставить KeyboardEvents изменить значение HTMLInputElement?

Угловая проверка переполнения для элемента в контроллере

Как я могу выбрать вариант из этого выпадающего меню на этом веб-сайте

Хорошо ли получить доступ к DOM в vue js?

Что происходит при вызове Node.appendChild() для добавления тега скрипта?

Преобразуйте объект Java с помощью org.w3c.dom.Element в строку и получите ошибку при обратном преобразовании

Необязательный baseURI (местоположение) в DOMParser?

Ответы 1

Другие вопросы по теме

Похожие вопросы