Как изменить значение атрибута данных элемента объекта HTML в javascript

Как вы изменяете значение атрибута данных объекта объекта HTML в JavaScript?

Вот что я пытаюсь

<object type="text/html" id="htmlFrame" style="border: none;" standby="loading" width="100%"></object>

 var element = document.getElementById("htmlFrame");
 element.setAttribute("data", "http://www.google.com");

Ответы

Ответ 1

и в jquery:

$('element').attr('some attribute','some attributes value')

то есть

$('a').attr('href','http://www.stackoverflow.com/')

Ответ 2

Это работает:

<html>
<head></head>
<body>

<object type="text/html" id="htmlFrame" style="border: none;" standby="loading" width="100%"></object> 

<script type="text/javascript">
  var element = document.getElementById("htmlFrame"); 
  element.setAttribute("data", "attributeValue"); 
</script>

</body>
</html>

Если вы поместите это в файл, откройте в нем веб-браузер, javascript выполнит, а атрибут + data добавит к элементу объекта.

Примечание. Если вы просто посмотрите на источник HTML, вы НЕ увидите этот атрибут. Это связано с тем, что браузер показывает вам статический источник, отправленный веб-сервером, а не динамически отображаемый DOM. Чтобы проверить DOM, используйте инструмент, например Firebug. Это покажет вам, что DOM броузер отобразил, и вы сможете увидеть добавленный атрибут.

Используя Firefox + Firebug или Google Chrome, вы можете щелкнуть правой кнопкой мыши на части страницы и сделать "Осмотреть элемент". Это вызовет представление предоставленного DOM.

Ответ 3

В JavaScript вы можете назначать значения атрибутам данных через Element.dataset.

Например:

avatar.dataset.id = 12345;

Ссылка: https://developer.mozilla.org/en/docs/Web/API/HTMLElement/dataset

Ответ 4

Поведение объектов хоста <object> происходит из-за зависимостей реализации ECMA262, а атрибут set setAttribute() может не работать.

Я вижу два решения:

soft: element.data = "http://www.google.com";
hard: удалите объект из дерева DOM и создайте новый с измененным атрибутом данных.

Ответ 5

Следующий код работает, если вы используете jquery

$( "object" ).replaceWith('<object data="http://www.google.com"></object>');

Ответ 6

document.getElementById("PdfContentArea").setAttribute('data', path);

ИЛИ

var objectEl = document.getElementById("PdfContentArea")

objectEl.outerHTML = objectEl.outerHTML.replace(/data="(.+?)"/, 'data="' + path + '"');