javascript를 사용하여 요소의 하위 문자열 확인

Question

H1 태그를보고 H1의 내용을 기반으로 빈 div를 이미지로 채우는 데 문제가 있습니다.

// DECLARE MEASURMENT STEP IMAGES 
var CornerRight = "../product_images/uploaded_images/onecutcornerrightstep2.gif"; 
var CornerLeft = "../product_images/uploaded_images/onecutcornerleftstep2.gif"; 
var CutCorners = "../product_images/uploaded_images/cutcornerssquareorrectanglestep2.gif"; 
var Rounded = "../product_images/uploaded_images/roundedsquareorrectanglestep2.gif"; 
var TwoCut = "../product_images/uploaded_images/2cutcornersstep2.gif"; 
var Round = "../product_images/uploaded_images/roundstep2.gif"; 
var Octagon = "../product_images/uploaded_images/octogonstep2.gif"; 
var SquareOrRectangle = "../product_images/uploaded_images/squareorrectanglestep2.gif"; 

// PLACE IMAGES 
if ($(".product h1:contains('Corner Right')")) { 
    $(".measurement-image").append("<img src=\"" + CornerRight + "\" />"); 
} else if ($(".product h1:contains('Corner Left')")) { 
    $(".measurement-image").append("<img src=\"" + CornerLeft + "\" />"); 
} else if ($(".product h1:contains('Cut Corners')")) { 
    $(".measurement-image").append("<img src=\"" + CutCorners + "\" />"); 
} else if ($(".product h1:contains('Rounded')")) { 
    $(".measurement-image").append("<img src=\"" + Rounded + "\" />"); 
} else if ($(".product h1:contains('Two Cut')")) { 
    $(".measurement-image").append("<img src=\"" + TwoCut + "\" />"); 
} else if ($(".product h1:contains('Octagon')")) { 
    $(".measurement-image").append("<img src=\"" + Octagon + "\" />"); 
} else if ($(".product h1:contains('Square or Rectangle')")) { 
    $(".measurement-image").append("<img src=\"" + SquareOrRectangle + "\" />"); 
} else { 
    $(".measurement-image").append("<img src=\"" + Round + "\" />"); 
} 

나는 그것을 실행할 때마다, 첫 번째 조건 (코너 오른쪽) 다시 참으로 온다 상관없이 H1의 실제 내용을 다음과 같이 내 코드입니다.

Answer 1

및 모든 수표를 포함하는 단일 개체를 만드시겠습니까? 여기 제안 된 재 작업이 있습니다 :

var measureSteps = [ 
    cornerRight: { 
     name: "Corner Right", 
     src: "../product_images/uploaded_images/onecutcornerrightstep2.gif"; 
    }, 
    cornerLeft: { 
     name: "Corner Left", 
     src: "../product_images/uploaded_images/onecutcornerleftstep2.gif"; 
    }, 
    cornerRight: { 
     name: "Cut Corners", 
     src: "../product_images/uploaded_images/cutcornerssquareorrectanglestep2.gif"; 
    }, 
    /* ETC, ETC */ 
]; 

//Iterate through each value in the "measureSteps" object, checking if it is contained in h1 
var headerText = $('.product h1').text(); //Only do a jQuery matching search once 
$.each(measureSteps, function(i, v) { 
    if (headerText.indexOf(v.name) > -1) { 
     $(".measurement-image").append("<img src='" + v.src + "' />"); 
     return false; //Stop iterating - we've successfully found the right text! 
    } 
}); 

Answer 2

결과 (배열)의 길이가 인 을 확인해야합니다. 모든 객체는 JavaScript에서 사실입니다.

예를 들어

: @linstantnoodles 말했듯이 배열이있는 경우, 당신은 단지 그 배열 또한 그것은

내부 요소를 가지고 있다면, 왜 변수의 수는 감소하지하지, 확인하는

if ([]) { 
    console.log("Hello"); 
} 
// Prints "Hello"