Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Убрать повторяющиеся элементы (https://javascript.ru/forum/misc/69998-ubrat-povtoryayushhiesya-ehlementy.html)

AlexTrader 02.08.2017 15:50

Убрать повторяющиеся элементы
 
Доброго времени суток, форумчане, подскажите пожалуйста, как изменить функцию, убрав повторяющийся элемент?
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>";
        }
    };

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

Nexus 02.08.2017 15:57

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

AlexTrader 02.08.2017 15:58

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

AlexTrader 02.08.2017 15:59

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

Nexus 02.08.2017 16:00

AlexTrader, поправил.

Nexus 02.08.2017 16:02

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

j0hnik 02.08.2017 16:03

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

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

рони 02.08.2017 16:04

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

AlexTrader 02.08.2017 16:21

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

Nexus 02.08.2017 16:56

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


Часовой пояс GMT +3, время: 11:05.