第二周笔记.md

第二周笔记

textarea

属性：

1. cols 规定文本区内的可见宽度
2. rows 规定文本区内的可见行数
3. resize 禁止拉伸该文本框的样式（属性值为none）

// 正则表达式判断文本中的所有句号
	texts = text.replace(new RegExp('。','g'),'。<br><br>');

将时间戳转化为格林尼治时间

function formatDateT(dataTime) {
    var newDate = new Date(dataTime + 8 * 3600 * 1000);
    return newDate.toISOString();
}

多行溢出省略

display: -webkit-box;   /*对象作为弹性伸缩盒子模型显示*/
-webkit-box-orient: vertical;  /*设置或检索伸缩盒对象的子元素的排列方式 */
-webkit-line-clamp: 5;   /*溢出省略的界限 */

audio常用属性

1. currentTime 设置或返回音频中的当前播放位置（以秒计）
2. duration 返回音频的长度（以秒计）
3. paused 设置或返回音频是否暂停
4. volume 设置或返回音频的音量
5. autoplay 设置或返回是否在就绪（加载完成）后随即播放音频
6. controls 设置或返回音频是否应该显示控件（比如播放/暂停等），是不是能自己控制
7. defaultMuted 设置或返回音频默认是否静音
8. ended 返回音频的播放是否已结束

audio常用方法

1. play() 开始播放音频
2. pause() 暂停当前播放的音频
3. load() 重新加载音频元素

设置播放器样式（以下的broadcast为播放按钮，broadcast_1是audio标签）

1. 清除默认样式：

   -webkit-appearance: none;

2. 将秒转化为显示的分钟

   function transTime(time) {
       let duration = parseInt(time);
       let minute = parseInt(duration / 60);
       let sec = (duration % 60) + "";
       let isM0 = ":";
       if (minute == 0) {
           minute = "00";
       } else if (minute < 10) {
           minute = "0" + minute;
       }
       if (sec.length == 1) {
           sec = "0" + sec;
       }
       return minute + isM0 + sec;
   }

3. 获取音乐时长

   if (broadcast_1 != null) {
       broadcast_1.load();
       broadcast_1.oncanplay = function () {
           var duraTime = document.querySelector(".duraTime");
           duraTime.innerHTML = transTime(broadcast_1.duration)
       }
   }

4. 拉动进度条使其改变进度(shichang为进度条)

shichang.oninput = function (e) {
    let x = e.target.value;
    let bfb = (x / 100.0) * broadcast_1.duration;
    shichang.style.value = bfb;
    let sc = (bfb / broadcast_1.duration) * 100.0;
    shichang.style.backgroundSize = sc + "%";
    broadcast_1.currentTime = bfb;
    let currentTime = document.querySelector(".currentTime");
    currentTime.innerHTML = transTime(parseInt(broadcast_1.currentTime));
    if (broadcast_1.currentTime === broadcast_1.duration) {
        broadcast_1.currentTime = 0;
    }
};