CODEWITHSUNDEEP
javascriptjquery
Janith ashen
Janith ashen

Reputation: 57

Javascript plus operator not works with ternary if else

Hi this is my js code.

var a = '<span> and have </span>' + $('#module_product_review_star_1 .pdp-link')[1] ? $('#module_product_review_star_1 .pdp-link')[1].outerHTML : 'not have';
alert(a);

I'm using ternary operator to check the item exists in dom. But when the item is not in dom this code is failing.

this works,

if($('#module_product_review_star_1 .pdp-link')[1]){
         questiones = '<span> and have </span>' + $('#module_product_review_star_1 .pdp-link')[1].outerHTML;
}

But I need to use ternary operator and do it in one line. Is there a way to do it?

Upvotes: 0

Views: 192

Answers (2)

CertainPerformance
CertainPerformance

Reputation: 370689

+ has higher operator precedence (13) than the conditional operator (4), so your code is checking whether '<span> and have </span>' + $('#module_product_review_star_1 .pdp-link')[1] is truthy, which it always will be. Surround everything past the </span> in parentheses instead:

var a = '<span> and have </span>' + (
  $('#module_product_review_star_1 .pdp-link')[1]
    ? $('#module_product_review_star_1 .pdp-link')[1].outerHTML
    : 'not have'
);

That said, it would be better to write DRY code and put $('#module_product_review_star_1 .pdp-link')[1] into a variable first:

var possibleLink = $('#module_product_review_star_1 .pdp-link')[1];
var a = '<span> and have </span>' + (
  possibleLink
    ? possibleLink.outerHTML
    : 'not have'
);

Upvotes: 3

Angen
Angen

Reputation: 410

Ternary has this pattern: 

condition ? do if true : do if false;


so in your case condition is 

'<span> and have </span>' + $('#module_product_review_star_1 .pdp-link')[1]

Upvotes: 1

Related Questions