Объясните пожалуйста принцип работы vksaver

Нужно написать подобное по функционалу решение, не знаю в какую сторону копать. Интересует как он изменяет dom страницы с аудиозаписями, добавляя кнопку скачать. Заранее спасибо...
  • Вопрос задан
  • 2769 просмотров
Решения вопроса 1
Deerenaros
@Deerenaros
Программист, математик, задрот и даже чуть инженер
Ну банально посмотрите на source страницы.
<div class="play_btn fl_l">
    <div class="play_btn_wrap">
        <div class="play_new" id="play146007391_273404010">
        </div>
    </div>
    <input type="hidden" id="audio_info146007391_273404010" value="https://psv4.vk.me/c4708/u74422639/audios/4bd0302416df.mp3?extra=TQIL4DCU93rkBcrzcfMC59gN7O8z737SUAvxmev_aJQ2RdWknkiOd_SD7g1s8QIr-qJYlsfkDOt9CCdz3cebwMNe4EpVL95C7yE,231" />
</div>


То есть проходим по всем елементам с классом play_btn, смотрим на input внутри него (на аттрибут value), и добавляем ссылку с target=blank и содержимым - ссылкой на аудио вырванное из value.
То есть, примерно так:
var nodes = document.getElementsByClassName("play_btn");
for(var i = 0; i < nodes.length; i++){
    var audio = nodes[i].getElementsByTagName("input")[0];
    audio = audio.getAttribute("value").spit("?")[0];
    //something else with UI here
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Fesor
@Fesor
Full-stack developer (Symfony, Angular)
php тут не причем. тут причем js.

На самом деле все просто, ссылки на аудиозаписи хранятся рядом с кнопкой play у трека. Добавить же в dom еще одну кнопку-ссылку, добавить оформление и т.п. труда особо не составляет.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
18 апр. 2024, в 21:56
2000 руб./за проект
18 апр. 2024, в 21:00
150 руб./за проект