getElementById не работает в расширении Google Chrome для <embed> - PullRequest
Новая
       3

getElementById не работает в расширении Google Chrome для <embed>

0 голосов
/ 08 марта 2011

В моем скрипте содержимого расширения Google Chrome у меня есть следующее: 

jQuery(document).ready(function() {
    var player = document.getElementById('player');
    console.log(player);
    console.log(document);
});

Я запускаю его на любом видео Hulu, которое имеет следующий код для вставки с id = 'player' 

<embed id="player" type="application/x-shockwave-flash" src="/site-player/playerwrapper.swf?cb=e80c477cL" width="100%" height="428" style="z-index:10;" name="player" quality="high" allowscriptaccess="always" allowfullscreen="true" bgcolor="#000000" flashvars="bitrate=700000&amp;user_id=-1&amp;startLoadWrapperTime=1299572732904&amp;overrideBrand=&amp;referrer=http://www.hulu.com/watch/20338/saturday-night-live-steve-carell-monologue#continuous_play=on&amp;continuous_play_on=true&amp;sortBy=&amp;initMode=4&amp;modes=4&amp;content_id=7751491&amp;cb=2011-3-8-8&amp;v=3">

Например, следующая ссылка http://www.hulu.com/watch/20337/saturday-night-live-snl-digital-short-the-japanese-office

Но при запуске скрипта console.log (player) возвращает ноль.Однако console.log (document) возвращает соответствующий объект документа.Даже если я попытаюсь var player = Document.prototype.getElementById.apply(document, ['player']);, я все равно получу ноль.

Забавно, что если я попробую это из консоли Chrome JavaScript, все будет работать нормально, я получу правильное <embed>, напечатанное на консоли.

Есть идеи, почему это не работает в моем скрипте содержимого?

ОБНОВЛЕНИЕ: В соответствии с запросом, вот полное содержимое моей папки расширения chrome:

manifest.json: 

{
    "name": "gebidtest",
    "version": "1",
    "permissions": [
      "http://*/*",
      "https://*/*"
    ],
    "content_scripts": [{
      "matches": ["http://*/*"],
      "js": ["jquery-1.5.1.min.js","app.js"]
    }]
}

app.js: 

jQuery(document).ready( function() {
    var player = document.getElementById('player');
    console.log(player);
    console.log(document);
});

jquery-1.5.1.min.js: я только что скачал

Я использую Chrome version 10.0.648.127 наMac, но я также попробовал это на ПК с теми же результатами

Ответы [ 4 ]

8 голосов
/ 17 февраля 2016

Неправильное прямое выполнение операции, связанной с DOM в JS.Например:

default.html 

<!DOCTYPE HTML>
<html>
    <head>
    <script type="text/javascript" src="default.js"></script>
    </head>
    <body>
         <a id="Bar" href="#"></a>
    </body>
</html>

default.js 

const bar = document.getElementById("Bar");
alert(bar.id);

В настоящее время DOMсодержимое может быть еще не полностью загружено, и поэтому «bar» может быть «NULL».

Правильный способ сделать это:

default.js 

document.addEventListener('DOMContentLoaded', function() {
  const bar = document.getElementById("Bar");
  alert(bar.id);
  });

То есть: выполнение связанной с DOM операции, когда происходит событие DOMContentLoaded.

«setTimeout» - неправильный способ, поскольку вы не можете убедиться, что содержимое DOMполностью загружен, установив некоторую задержку!

1 голос
/ 09 марта 2011

Оказывается, проблема была со временем.Несмотря на то, что это было внутри jQuery (document) .ready (), getElementById не удалось, потому что встраивание еще не загружено.Когда я делаю setTimeout в течение нескольких секунд, getElementById работает.

0 голосов
/ 07 июля 2017

Использовать отсрочку. 

<script defer>...</script>
0 голосов
/ 08 марта 2011

отлично работает для меня в Chrome 9.

Попробуйте эту скрипку: http://jsfiddle.net/Ee7mq/

Если консоль не показывает тег плеера, значит, что-то не так с вашим браузером. Если это так, значит что-то не так с вашим кодом. Чтобы понять, что мне нужно, чтобы увидеть больше этого.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...