如何通过样式获取元素：向左或向右定位答案

【问题标题】：How to get an element by its style : position left or right如何通过样式获取元素：向左或向右定位
【发布时间】：2016-08-24 21:29:05
【问题描述】：

我有这个块，它是一个滑块元素：

<div id="sliderDispo" class="slider slider-dispo" data-slider-init="" data-slider-color="#0077b5 #EC6E31 #E40B0B" data-slider-step="33" >
                <div class="slider__interval">
                         <span>Oui</span>
                         <span>-3mois</span>
                         <span>-6mois</span>
                         <span>Non</span>
               </div>
    /***** want to recuper those 2 elements 
    <div class="ui-slider-range ui-widget-header ui-corner-all ui-slider-range-min" style="width: 0%; left: 0%;"></div>
    <span class="ui-slider-handle ui-state-default ui-corner-all" tabindex="0" style="left: 0%;"></span>
    *********/
</div>

我想恢复已经预先评论的 2 个元素 DIV 和 span。

我已经开发了这个函数，我试图过滤掉具有特定样式值的元素：style="left: 0%（Div 和跨度）。我需要改变这些元素的样式

我的功能：

 function () {
            var initDsiponibilite = $("#inputDisponibilite").attr("value");
            alert(initDsiponibilite);
            $("#sliderDispo").attr("data-slider-init",initDsiponibilite);
            $.each( $("#sliderDispo").children().find().position.css('left','0%'))
            {
                $(this).attr("style","left:60%")
            }

但这不起作用，有什么建议吗？？？？

【问题讨论】：

有什么理由不给这些元素一个适当的类或id，然后用它来查找它们？
是的，我不需要提供任何 ID 或类
第一个 html cmets 是  而不是 /* */
其次这个$("#inputDisponibilite").attr("value");有什么关系？

标签： javascript jquery html css

【解决方案1】：

你可以试试这样的：

$("#sliderDispo")
  .children()
  .filter(function(){ return $(this).css("left") === "0%"; })
  .each(function(){ $(this).css("left", "60%"); });

console.log($("div.ui-slider-range")[0].style.left);

<div
  id="sliderDispo"
  class="slider slider-dispo"
  data-slider-init=""
  data-slider-color="#0077b5 #EC6E31 #E40B0B"
  data-slider-step="33">

  <div class="slider__interval">
    <span>Oui</span>
    <span>-3mois</span>
    <span>-6mois</span>
    <span>Non</span>
  </div>

  <!-- Begin: want to recuper those 2 elements -->
  <div
    class="ui-slider-range ui-widget-header ui-corner-all ui-slider-range-min"
    style="width: 0%; left: 0%;"></div>
  <span
    class="ui-slider-handle ui-state-default ui-corner-all"
    tabindex="0"
    style="left: 0%;"></span>
  <!-- End: want to recuper those 2 elements -->

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

【讨论】：