减少优化代码

时间:2017-02-04 04:41:47

标签: css less

我有以下结构:

<div class ="shops">
  <div class = "shops__item_left">
  <div class = "shops__item_right">
  <div class = "shops__descr">
</div>

让我们说我需要以&#39; shops_item&#39;开头的所有街区。有一个常见的CSS属性,如background: black

我该怎么做? 我当然可以这样做:

   .shops {
     font-size: 15px;
     &__item_left { 
       background: black;
     }
     &__item_right { 
       background: black;
     }

但是我如何摆脱这种重复。

1 个答案:

答案 0 :(得分:0)

一些选择。你可能想要重构一下(注意多个类名):

var p1 = "house.wall.paint.color";
var p2 = "blue";
var arr = [];
var obj = [];

buildObj(p1, p2);

console.log(obj);

function buildObj(p1, p2) {
  var keys = p1.split('.');
  var val = p2;
  var arr = $.merge(keys, [val]);
  var prop = {};
  var prop2 = {};
  var prop3 = {};
  var prop4 = {};
  var last = arr.length - 1;
  prop[arr[last - 1]] = arr[last];
  obj = prop;
  prop2[arr[last - 2]] = obj;
  obj = prop2;
  prop3[arr[last - 3]] = obj;
  obj = prop3;
  prop4[arr[last - 4]] = obj;
  obj = prop4;
  return obj;
}
def sending_sms(number,otp):
    url = 'http://api.textlocal.in/send/'
    msg = 'Thank you for registering with RTM. Please enter the verification code %%|OTP^{"inputtype" : "text", "maxlength" : "6"}%% to complete the registration.'
    post_fields = ({"username":"admin@example.in","password":"P@ssword","numbers":number,"message":msg})

    request = Request(url, urlencode(post_fields).encode())
    print request
    json = urlopen(request).read().decode()
    print json
    return json

或者,您可以将标记保持不变,并选择其中包含 <div class="shops"> <div class="shops__item shops__item--left"> <div class="shops__item shops__item--right"> <div class="shops__descr"> </div> 的类名的所有元素。

.shops {
  font-size: 15px;

  &__item { 
     background: black;

     &--left { ... }
     &--right { ... }
  }

}