Javascript Owl转盘不在屏幕上显示动态内容

我正在使用owl-carousel为网站推荐动态内容显示。但我无法在屏幕上显示owl滑块。我的意思是，在设备上构建应用程序后，滑块没有显示，有人能建议我需要做什么，以及我下面的代码有什么错误吗。请帮帮我……谢谢

#家庭鉴定科{
背景色：#FFFFFF！重要；
}
格雷巴布尔先生{
光标：col resize；
/*不支持抓取光标时的回退*/
光标：抓取；
光标：-moz抓取；
光标：-webkit抓取；
}
/*（可选）在拖动操作期间应用“闭合的手”光标*/
.grabbable：活动{
光标：抓取；
光标：-moz抓取；
光标：-webkit抓取；
}
.证明{
背景：#0000000 A；
填充：20px；
位置：相对位置；
}
.推荐书.头衔{
字体大小：20px；
字号：500；
颜色：#333；
文本转换：大写；
边际上限：0；
}
.推荐性描述{
字体大小：16px；
颜色：#000；
线高：30px；
填充：10px；
最小高度：250px；
}
.推荐内容{
位置：相对位置；
填充：20px 34px；
}
.推荐图片{
显示：内联块；
溢出：隐藏；
左侧填充：20px；
}
.推荐性图片{
高度：50px；
宽度：自动；
职位：继承；
底部：0；
}
.推荐信.姓名{
字体大小：16px；
字号：600；
右边距：45像素；
浮动：对；
文本转换：大写；
}
.推荐信{
字体大小：12px；
颜色：rgb（175170170）；
线高：24px；
}
.推荐等级{
字体大小：14px；
线高：24px；
}
.推荐等级{
填充：0；
保证金：0；
列表样式：无；
浮动：对；
}
.推荐性评价{
显示：内联块；
颜色：#ffc207；
}
.owl主题.owl控件{
边缘顶部：20px；
}
.owl主题.owl控件.owl页面跨度{
背景：#000000；
}
@仅介质屏幕和（最大宽度：760像素）{
.推荐内容{
左侧填充：20px；
}
}
@仅介质屏幕和（最大宽度：480px）{
.推荐等级{
填充：0；
}
.推荐性评价{
显示：内联；
}
}
函数owlsiderfaction（）{
$（“#证明滑块”）.owlCarousel({
项目：3，
循环：对，
差额：10，
自动播放：对，
自动播放超时：1000，
自动播放暂停：对，
响应：{
0: {
项目：1，
},
600: {
项目：2，
},
1000: {
项目：3，
}
}
});
}
函数alhtestimationalfunction（）{
var xhr=new XMLHttpRequest（）；
xhr.withCredentials=true；
addEventListener（“readystatechange”，function（））{
if（this.readyState==4）{
//console.log（this.responseText）；
var reviewdatatext=this.responseText；
console.log（reviewdatatext）；
//将JSON对象转换为JS对象
var obj=JSON.parse（reviewdatatext）；
//将JSON对象转换为JS对象
控制台日志（obj）；
var reviewarray=对象内容；
控制台日志（查看阵列）；
var arrlength=reviewarray.length；
如果（arrlength>=1）{
var-bolck1=“”+
“我们的客户怎么说”+
“
”+
“
”+
'' +
'' +
'' +
'';
var-Bolckvr=''；
对于（i=0；i”；
var评级=审查阵列[i]。评级；
如果（额定值===5）{
var CertificationalBolckib='
'+
“
”+
“
”+
“
”+
“
”；
}否则如果（评级===4.75 | |评级===4.5 | |评级===4.25）{
var CertificationalBolckib='
'+
<style>
    #home-testimonial-section {
        background-color: #FFFFFF !important;
    }
    
    .grabbable {
        cursor: col-resize;
        /* fallback if grab cursor is unsupported */
        cursor: grab;
        cursor: -moz-grab;
        cursor: -webkit-grab;
    }
    /* (Optional) Apply a "closed-hand" cursor during drag operation. */
    
    .grabbable:active {
        cursor: grabbing;
        cursor: -moz-grabbing;
        cursor: -webkit-grabbing;
    }
    
    .testimonial {
        background: #0000000a;
        padding: 20px;
        position: relative;
    }
    
    .testimonial .title {
        font-size: 20px;
        font-weight: 500;
        color: #333;
        text-transform: uppercase;
        margin-top: 0;
    }
    
    .testimonial .description {
        font-size: 16px;
        color: #000;
        line-height: 30px;
        padding: 10px;
        min-height: 250px;
    }
    
    .testimonial_content {
        position: relative;
        padding: 20px 34px;
    }
    
    .testimonial .pic {
        display: inline-block;
        overflow: hidden;
        padding-left: 20px;
    }
    
    .testimonial .pic img {
        height: 50px;
        width: auto;
        position: inherit;
        bottom: 0;
    }
    
    .testimonial .name {
        font-size: 16px;
        font-weight: 600;
        margin-right: 45px;
        float: right;
        text-transform: capitalize;
    }
    
    .testimonial .post {
        font-size: 12px;
        color: rgb(175, 170, 170);
        line-height: 24px;
    }
    
    .testimonial .ratingspn {
        font-size: 14px;
        line-height: 24px;
    }
    
    .testimonial .rating {
        padding: 0;
        margin: 0;
        list-style: none;
        float: right;
    }
    
    .testimonial .rating li {
        display: inline-block;
        color: #ffc207;
    }
    
    .owl-theme .owl-controls {
        margin-top: 20px;
    }
    
    .owl-theme .owl-controls .owl-page span {
        background: #000000;
    }
    
    @media only screen and (max-width: 760px) {
        .testimonial_content {
            padding-left: 20px;
        }
    }
    
    @media only screen and (max-width: 480px) {
        .testimonial .rating {
            padding: 0;
        }
        .testimonial .rating li {
            display: inline;
        }
    }
</style>

<script type="text/javascript">
    function owlsliderfuction() {
        $("#testimonial-slider").owlCarousel({
            items: 3,
            loop: true,
            margin: 10,
            autoplay: true,
            autoplayTimeout: 1000,
            autoplayHoverPause: true,
            responsive: {
                0: {
                    items: 1,
                },
                600: {
                    items: 2,

                },
                1000: {
                    items: 3,
                }
            }
        });
    }

    function AlhtestimonialFunction() {
        var xhr = new XMLHttpRequest();
        xhr.withCredentials = true;

        xhr.addEventListener("readystatechange", function() {
            if (this.readyState === 4) {
                //console.log(this.responseText);
                var reviewdatatext = this.responseText;
                console.log(reviewdatatext);
                // Converting JSON object to JS object
                var obj = JSON.parse(reviewdatatext);
                // Converting JSON object to JS object
                console.log(obj);
                var reviewarray = obj.content;
                console.log(reviewarray);
                var arrlength = reviewarray.length;
                if (arrlength >= 1) {
                    var testimonialBolck1 = '<div class="demo">' +
                        '<div class="sqs-block-content"> <h1 style="text-align:center;white-space:pre-wrap;"> What Our Customers Say</h1></div>' +
                        '<br>' +
                        '<br>' +
                        '<div class="grabbable">' +
                        '<div class="row">' +
                        '<div class="col-md-12">' +
                        '<div id="testimonial-slider" class="owl-carousel owl-theme">';
                    var testimonialBolckvrr = '';
                    for (i = 0; i < arrlength; i++) {
                        // convert unix timestamp to milliseconds
                        var timestampi = reviewarray[i].dateCollected
                        var ts_msi = timestampi * 1000

                        // initialize new Date object
                        var date_obi = new Date(ts_msi)

                        // year as 4 digits (YYYY)
                        var yeari = date_obi.getFullYear()
                            // month as 2 digits (MM)
                        var monthi = ("0" + (date_obi.getMonth() + 1)).slice(-2)

                        // date as 2 digits (DD)
                        var datei = ("0" + date_obi.getDate()).slice(-2)
                        var original_datei = datei + "/" + monthi + "/" + yeari;

                        var testimonialBolckia = '<div id="testimonial" class="testimonial">' +
                            '<div class="testimonial_content">' +
                            '<span class="post">' + original_datei + '</span>' +
                            '<span class="ratingspn"></span>' +
                            '<ul class="rating">';
                        var rating = reviewarray[i].rating;
                        if (rating === 5) {
                            var testimonialBolckib = '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>';
                        } else if (rating === 4.75 || rating === 4.5 || rating === 4.25) {
                            var testimonialBolckib = '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star-half"></li>';
                        } else {
                            var testimonialBolckib = '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>' +
                                '<li class="fa fa-star"></li>';
                        }

                        var testimonialBolckic = '</ul>' +
                            '</div>' +
                            '<p class="description">' + reviewarray[i].body + '</p>' +
                            '<h3 class="name">' + reviewarray[i].author + '</h3>' +
                            '<div class="testimonial-content">' +
                            '<div class="pic">' +
                            '<img src="https://alh-res.cloudinary.com/image/upload/v1583886927/Development%20demo/Logo-TheFork-vertical-green-background.png" alt="">' +
                            '</div>' +
                            '</div>' +
                            '</div>';
                        var testimonialBolcki = testimonialBolckia + testimonialBolckib + testimonialBolckic;
                        testimonialBolckvrr = testimonialBolckvrr + testimonialBolcki;
                        console.log(testimonialBolckvrr);

                    }
                    var testimonialBolck3 = '</div>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '</div>';
                    var testimonialBolck = testimonialBolck1 + testimonialBolckvrr;

                    document.getElementById("reviews").innerHTML = testimonialBolck;
                } else {
                    document.getElementById("reviews").style.display = "none";
                }

            }
        });

        xhr.open("GET", "https://revinate-endpoint-url.herokuapp.com/reviews/136522/");

        xhr.send();
    }
    $(document).ready(function() {
        owlsliderfuction();
        AlhtestimonialFunction();
    });
</script>

<!-- div to display the owl slider -->
<div id="reviews"></div>

$(document).ready(function () {
    AlhtestimonialFunction();
    
    function checkOwlcarousel() {
        setTimeout(function () {
            if ($('.owl-carousel .active').is(':visible')) {
                owlsliderfuction();
            } else {
                checkOwlcarousel();
            }
        }, 250);
    }
    checkOwlcarousel();
});