javascript - 引号内的 If...Else 语句

Question

我想在下面的字符串中合并 if else 语句。当我尝试时，我在浏览器控制台中收到 Uncaught SyntaxError: Unexpected token if 。我该怎么办...

        for(var i=0; i<articles.length; i++) {

            var $article = "<div class='col-xs-12 col-sm-6 col-md-3 col-lg-3 fix-box-height'>" +
                "<a class='shadow-hovering' href="+"'"+articles[i].full_url+"'"+">" +
                "<div class='thumbnail color-after-hover'> " +
                "<img class='thumbnail-img' src="+"'"+ articles[i].thumbnail_url +"'"+" data-src='3' alt=''>" +
                "<div class='caption box-read-more'>"+
                    if(articles[i].title.length > 28){
                        "<h4>"+"'"+ articles[i].title.substr(0, 28) +"'..."+"</h4>"
                    } else if (articles[i].title.length > 16) {
                        "<h4>"+"'"+ articles[i].title +"'"+"</h4>"
                    } else {
                        "<h4>"+"'"+ articles[i].title +"'"+"</h4> <br>"
                    }
                    if(articles[i].subtitle.length > 37){
                        "<h4>"+"'"+ articles[i].subtitle.substr(0, 37) +"'..."+"</h4>"
                    } else if (articles[i].subtitle.length > 15) {
                        "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4>"
                    } else {
                        "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4> <br><br>"
                    }
                    +"<p> <span class='btn btn-primary more-box-button'>More</span> </p> " +
                    "</div>" +
                    "</div>" +
                    "</a>" +
                    "</div>";
        }

Answer 1

尝试:

    for(var i=0; i<articles.length; i++) {

        var $article = "<div class='col-xs-12 col-sm-6 col-md-3 col-lg-3 fix-box-height'>" +
            "<a class='shadow-hovering' href="+"'"+articles[i].full_url+"'"+">" +
            "<div class='thumbnail color-after-hover'> " +
            "<img class='thumbnail-img' src="+"'"+ articles[i].thumbnail_url +"'"+" data-src='3' alt=''>" +
            "<div class='caption box-read-more'>";
                if(articles[i].title.length > 28){
                    $article += "<h4>"+"'"+ articles[i].title.substr(0, 28) +"'..."+"</h4>"
                } else if (articles[i].title.length > 16) {
                    $article += "<h4>"+"'"+ articles[i].title +"'"+"</h4>"
                } else {
                    $article += "<h4>"+"'"+ articles[i].title +"'"+"</h4> <br>"
                }
                if(articles[i].subtitle.length > 37){
                    $article += "<h4>"+"'"+ articles[i].subtitle.substr(0, 37) +"'..."+"</h4>"
                } else if (articles[i].subtitle.length > 15) {
                    $article += "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4>"
                } else {
                    $article += "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4> <br><br>"
                }
                $article += "<p> <span class='btn btn-primary more-box-button'>More</span> </p> " +
                "</div>" +
                "</div>" +
                "</a>" +
                "</div>";
    }