Question

在此处给出的示例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是什么名称，这是我试图避免的事情（因为它为严格模式创造了一个漏洞，只是令人困惑和意外的行为）。

解决方法是将名称连字以便无法从全局空间访问

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

// now window['js-player'] is guarded from accidental access
var player = new YT.Player('js-player', ...);

但最重要的是，使用ID只是不好的做法，我更喜欢完全避免它们，因为类很好地工作，并且不会产生奇怪的副作用。

Answer 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 ...
             );

如果您使用返回节点列表的方法，请务必循环使用以下项目：Todd Motto - Looping Through NodeLists / Arrays

如何为新的YT.Player（）使用类而不是id

1 个答案: