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>"; 
    } 

Answer 2

您可以將字符串賦值給變量，使用這樣

for(var i=0; i<articles.length; i++) { 
    var conditional_str1, conditional_str2; 
    if(articles[i].title.length > 28){ 
     conditional_str1 = "<h4>"+"'"+ articles[i].title.substr(0, 28) +"'..."+"</h4>" 
    } else if (articles[i].title.length > 16) { 
     conditional_str1 = "<h4>"+"'"+ articles[i].title +"'"+"</h4>" 
    } else { 
     conditional_str1 = "<h4>"+"'"+ articles[i].title +"'"+"</h4> <br>" 
    } 
    if(articles[i].subtitle.length > 37){ 
     conditional_str2 = "<h4>"+"'"+ articles[i].subtitle.substr(0, 37) +"'..."+"</h4>" 
    } else if (articles[i].subtitle.length > 15) { 
     conditional_str2 = "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4>" 
    } else { 
     conditional_str2 = "<h4>"+"'"+ articles[i].subtitle +"'"+"</h4> <br><br>" 
    } 

    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'>"+ 

        conditional_str1 + conditional_str2 

       +"<p> <span class='btn btn-primary more-box-button'>More</span> </p> " + 
       "</div>" + 
       "</div>" + 
       "</a>" + 
       "</div>"; 
}