Как я могу использовать класс вместо идентификатора для новых ыть.Игрок()


В приведенном здесь примере https://developers.google.com/youtube/iframe_api_reference Вы можете видеть, что вместо использования стандартного синтаксиса селектора css есть пользовательский синтаксис строки, который, кажется, ссылается только на id.

<div id="player"></div>

// note no 'var' and yet this will work in strict mode
// since 'player' is being implicitly grabbed from the dom
player = new YT.Player('player', ...);
Это, конечно, создает проблему утечки глобальной переменной для любого имени id, чего я стараюсь избегать (потому что это создает лазейку для строгого режима и просто сбивает с толку и неожиданное поведение).

A обходной путь заключается в переносе имени так, чтобы к нему нельзя было получить доступ из глобального пространства

<div id="js-player"></div>

// now window['js-player'] is guarded from accidental access
var player = new YT.Player('js-player', ...);
Но суть в том, что использование ID-это просто плохая практика, и я предпочитаю избегать их вообще, так как классы работают хорошо и не имеют странных побочных эффектов.
1 5

1 ответ:

Может быть немного поздно для ответа, но в любом случае ...

Просто передайте селектор так

var player = new YT.Player(
                 document.querySelector('.your-class'), 
                 ... API Stuff ...
             );

Конечно, вы можете использовать jQuery или любой другой метод vanilla JS для выбора элементов.

var player = new YT.Player(
                 $('.your-class')[0], 
                 ... API Stuff ...
             );

Если вы используете метод, который возвращает список узлов, обязательно выполните цикл через элементы следующим образом: девиз Тодда-циклическое перебирание списков узлов / массивов