js根据文件后缀判断文件类型显示

body

<iframe id="resource-pdf" width="800px" height="600px" style="display: none" data="22"></iframe>
    <img class="resource-img" width="200px" height="200px" style="display: none" data="33">
    <input class="input" type="button" onclick="Resize()" value="点击查看">

js

<script>
        //判断文件是图片
        function imgType(result) {
            return ['png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff'].
            indexOf(result.toLowerCase()) !== -1;
        }
        // let fileName = "slider-2.jpg";
        var fileName = "flexbox.pdf";
        let index = fileName.lastIndexOf(".");
        let result = fileName.substr(index + 1);

        var img = document.getElementsByClassName('resource-img')[0];
        // var pdf = document.getElementsByClassName('resource-pdf')[0];
        var pdf = document.getElementById("resource-pdf");
        var input = document.getElementsByClassName("input")[0];
        //判断文件是pdf
        function pdfType(result2) {
            return ['pdf'].indexOf(result2.toLowerCase()) !== -1;
        }
        // console.log(imgType(result));
        if (imgType(result) == 1){
            console.log("我是图片");
            img.src = fileName;
            img.style.display = "block";
            input.style.display = "none"
        } else if (pdfType(result) == 1){
            console.log("我是pdf");
            pdf.src = fileName;
            pdf.style.display = "block";
            input.style.display = "block";
        } else {
            console.log("不支持替他格式");
        }

        var reset = false;
        function Resize(){
            if (reset == false){
                pdf.style.height = "600px";
                pdf.style.width = "800px";
                reset = true;
            } else {
                pdf.style.height = "200px";
                pdf.style.width = "200px";
                reset = false;
            }
        }

        window.onload = function () {
            var img = document.getElementsByClassName('resource-img')[0];
            var pdf = document.getElementById("resource-pdf");
            var valu = img.getAttribute("data");
            var valuu = pdf.getAttribute("data");
            console.log(img);
            console.log(valuu);
        }
    </script>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。