假设你是一名前端专家现要求你实现将网页中的所有播放器内的流打印出来至少2种方法请将步骤写下并示以相关js代码

方法一：使用JavaScript遍历DOM树并查找播放器元素，再获取流地址

1. 在HTML文件中添加一个按钮用于触发获取流地址的功能。

<button onclick="printStreams()">获取流地址</button>

2. 编写JavaScript代码，使用DOM遍历查找播放器元素，再获取其中的流地址并打印输出。

function printStreams() {
  // 遍历DOM树查找播放器元素
  const players = document.querySelectorAll('video, audio');
  players.forEach((player) => {
    // 获取流地址并打印输出
    const streamSrc = player.currentSrc;
    console.log(streamSrc);
  });
}

方法二：使用第三方库（如Videogular）获取播放器内的流地址

1. 在HTML文件中引入Videogular库。

<script src="https://cdn.jsdelivr.net/npm/videogular@2.4.0/videogular.min.js"></script>

2. 编写JavaScript代码，使用Videogular库获取播放器内的流地址并打印输出。

function printStreams() {
  // 获取所有Videogular播放器
  const players = document.querySelectorAll('vg-player');
  players.forEach((player) => {
    // 获取流地址并打印输出
    const streamSrc = player.vgPlayer.getCurrentTime();
    console.log(streamSrc);
  });
}