Удалить элементы управления для нескольких видео HTML5

Question

Удалить элементы управления для нескольких видео HTML5

1

Я создаю страницу с видео в макете сетки. Это будет огромный проект, поэтому мне нужно получить доступ к держателю видео из классов. Я создал новые элементы управления, но я не могу скрыть исходные элементы управления html5. Это работает:

var player = document.getElementById('vid1');
player.removeAttribute('controls');

Это не так (также пытались применить класс и получить доступ к нему, но не повезло):

var player = document.getElementsByTagName('video');
player.removeAttribute('controls');

Как я могу легко получить доступ ко всем держателям видео и скрыть элементы управления?

Спасибо!

mezzie 10 нояб. 2017, в 10:38

Источник

1

Возможный дубликат того, что возвращают querySelectorAll, getElementsByClassName и другие методы getElementsBy *?
Durga 10 нояб. 2017, в 09:30
0

Если вы действительно не хотите элементы управления в элементе видео. Затем удалите его из самого тега в HTML
Durga 10 нояб. 2017, в 09:35

Теги:

javascript

html5

video

custom-controls

1 ответ

Ещё вопросы

Возможный дубликат того, что возвращают querySelectorAll, getElementsByClassName и другие методы getElementsBy *?
Если вы действительно не хотите элементы управления в элементе видео. Затем удалите его из самого тега в HTML

doubleOrt · Accepted Answer · 2017-11-10T07-21-00.000Z

document.getElementsByTagName возвращает объект типа, похожий на массив, с указанным именем тега на странице.

Этот подобный массиву объект не имеет метода removeAttribute, это всего лишь контейнер, используемый для хранения элементов, возвращаемых вызовом document.getElementsByTagName; Объекты DOM в подобном массиве методы removeAttribute.

Вам придется выполнять итерацию по массиву и удалять атрибуты из каждого из них отдельно:

    var players = document.getElementsByTagName('video');
    
    for(var i = 0; i < players.length; i++) {
    players[i].removeAttribute('controls');
    }

    // the "video" HTML elements now have no "controls" attribute.
    console.log(players);

<video width="320" height="240" controls></video>
<video width="320" height="240" controls></video>
<video width="320" height="240" controls></video>

Если вы хотите сделать все это в 1 заявлении (я предпочитаю это, мы заимствуем Array#map):

Array.prototype.map.call(document.getElementsByTagName("video"), function(el){
el.removeAttribute("controls");
});

<video width="320" height="240" controls></video>
<video width="320" height="240" controls></video>
<video width="320" height="240" controls></video>