Убрать повторяющиеся элементы
 

Доброго времени суток, форумчане, подскажите пожалуйста, как изменить функцию, убрав повторяющийся элемент?

app.getRatingButton = function (item) {
        if (item.sourcePlaceId !== 3) {
            if(item.rating === 0)
                return "<span class='action-tooltip  rating-empty'" +
                           "data-role='tooltip'" +
                           "data-width='200'" +
                           "data-show-on='click'" +
                           "data-auto-hide='false'" +
                           "data-position='left'" +
                           "data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'></span>";
            else
                return "<span class='action-tooltip  rating-setted'" +
                            "data-role='tooltip'"+
                            "data-width='200'"+
                            "data-show-on='click'"+
                            "data-auto-hide='false'"+
                            "data-position='left'" +
                            "data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'>" + item.rating +
                        "</span>";
        } else {
            return "<span class=\"rating-disabled\"></span>";
        }
    };

В первых двух случаях функция возвращает практически одинаковый элемент, отличается только класс, возможно ли объявить общий элемент, а в условии добавлять нужный класс?

AlexTrader,

app.getRatingButton = function (item) {
	if (item.sourcePlaceId === 3) 
		return "<span class=\"rating-disabled\"></span>";
	
	return 
		"<span class='action-tooltip  rating-"+(item.rating===0?'empty':'setted')+"'" +
		   "data-role='tooltip'" +
		   "data-width='200'" +
		   "data-show-on='click'" +
		   "data-auto-hide='false'" +
		   "data-position='left'" +
		   "data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'"+
		">"+(item.rating!==0?item.rating:'')+"</span>";
};

Nexus,
А как быть с классом?

В первом случае "rating-empty", во втором "rating-setted"

AlexTrader, поправил.

AlexTrader, можно переписать без тернарных выражений, будет понятней, но кода будет больше.

app.getRatingButton = function (item) {
        if (item.sourcePlaceId !== 3) {
            if(item.rating === 0)
                return "<span class='action-tooltip  rating-empty'" +
                           "data-role='tooltip'" +
                           "data-width='200'" +
                           "data-show-on='click'" +
                           "data-auto-hide='false'" +
                           "data-position='left'" +
                           *!*"data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'></span>";*/!*
            else
                return "<span class='action-tooltip  rating-setted'" +
                            "data-role='tooltip'"+
                            "data-width='200'"+
                            "data-show-on='click'"+
                            "data-auto-hide='false'"+
                            "data-position='left'" +
*!*"data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'>" + item.rating +
                        "</span>";*/!*
        } else {
            return "<span class=\"rating-disabled\"></span>";
        }
    };

Не только класс ведь

AlexTrader,

app.getRatingButton = function (item) {
        if (item.sourcePlaceId !== 3) {
                return "<span class='action-tooltip  rating-"+(item.rating? "setted" : "empty")+"'" +
                            "data-role='tooltip'"+
                            "data-width='200'"+
                            "data-show-on='click'"+
                            "data-auto-hide='false'"+
                            "data-position='left'" +
                            "data-bind='value: rating.content, events: { show: rating.onShow, hide: rating.onHide }'>" + (item.rating || "") +
                        "</span>";
        } else {
            return "<span class=\"rating-disabled\"></span>";
        }
    };

Возможно ли создать элемент спан с аттрубутами, в return добавлять нужный класс к нему?

AlexTrader, не понял, что Вы имеете ввиду.
Можно переписать так, тогда манипулировать тегом будет проще.

app.getRatingButton = function(item) {
	if (item.sourcePlaceId === 3) 
		return "<span class=\"rating-disabled\"></span>";
	
	var span=document.createElement('span'),
		attrs={
			'data-role':'tooltip',
			'data-width':'200',
			'data-show-on':'click',
			'data-auto-hide':'false',
			'data-position':'left',
			'data-bind':'value: rating.content,events:{ show: rating.onShow,hide:rating.onHide }',
			'class':'action-tooltip  rating-empty'
		};
			
	if(item.rating!==0){
		span.innerHTML=item.rating;
		attrs['class']=attrs['class'].replace('empty','setted');
	};
	for(var name in attrs){
		if(attrs.hasOwnProperty(name))
			span.setAttribute(name,attrs[name]);
	};
	
	return span;
};

Nexus,
Только

return span.outerHTML;

, это template, мне нужно вернуть строку, спасибо огромное, всё работает!!!

Nexus,

for(var name in attrs){
 if(attrs.hasOwnProperty(name))
span.setAttribute(name,attrs[name]);
};

Если использовать цикл $.each(arr, function(i, item)){}, то можно обойтись без функции hasOwnProperty

AlexTrader, а если заюзать «for», то можно и без «$.each» обойтись

Я имел ввиду эту конструкцию:

for(var i=0;i<Object.keys(attrs).length;i++)

Сайт тупит, отредактировать сообщение не могу.

Чем же плох $.each, тем что это jquerry?

AlexTrader, ничем не плох, когда jQuery к странице подключен.
Вот только, если юзать jQuery, циклы вообще не нужны.

app.getRatingButton=function(item) {
	if (item.sourcePlaceId===3) 
		return '<span class="rating-disabled"></span>';
	
	var span=$('<span></span>').attr({
			'data-role':'tooltip',
			'data-width':'200',
			'data-show-on':'click',
			'data-auto-hide':'false',
			'data-position':'left',
			'data-bind':'value: rating.content,events:{ show: rating.onShow,hide:rating.onHide }',
			'class':'action-tooltip  rating-empty'
		});
	
	if(item.rating!==0)
		span.html(item.rating).addClass('rating-setted').removeClass('rating-empty');
	
	return span.get(0).outerHTML;
};

Nexus, классно, спасибо огромное!