是否有一个“多层”子选择器?

时间:2019-01-25 11:37:10

标签: html css css-selectors

我想找到位于第n个位置的元素的每个子节点,例如在:

<span class="passive match" id="1"></span>
<ul>
    <li>
      <span class="active match"></span>
      <ul>
        <li>
           <span class="active match"></span>
        </li>
      </ul>
    </li>
</ul>
<span class="passive match" id="2"></span>
<ul>
    <li>
      <span class="passive match"></span>
      <ul>
        <li>
           <span class="active"></span>
        </li>
      </ul>
    </li>
</ul>

我要在跨度“被动匹配”旁边找到ul的“主动匹配”

类似的东西:

span.passive.match + ul:'has-Child'(span.active.match) {CSS here}

但是相应的span.active.match可以是“ passive match”中第3/6/9/12等个子元素。是否有CSS-Selector可以处理此问题,还是我需要编写一个做到这一点的jQuery脚本(我会说这效率低下,因为我需要一个可以跨10k +元素运行的递归函数)?

基本上,我有一棵充满文件夹(.passive)和数据(.active)的树,我想显示与给定过滤器(.match)及其路径匹配的每个数据,但要隐藏每个没有文件夹的文件夹孩子多数民众赞成在匹配过滤器。因此,应隐藏id =“ 2”的跨度,而id =“ 1”的跨度应显示在我的dom结构中。由于树是由具有私有功能的插件生成的,并且在多种情况下使用,因此我不能仅对其进行编辑/覆盖,而必须使用CSS选择器来隐藏不必要的对象或使用javascript脚本来这样做。也许您会有更好的主意。

1 个答案:

答案 0 :(得分:2)

为此,您需要:has() pseudo-class

ul

…,但这不是标准(处于草稿状态)和no browser currently supports it


同时,更改HTML,以便$(".active.match").parents("ul").addClass("contains-active-match");上有一个类。

理想情况下,在生成HTML时执行此操作,但是可以在事后使用JavaScript对其进行修改。

span.passive.match + ul.contains-active-match {
  background: pink
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<span class="passive match" id="1">a</span>
<ul>
  <li>
    <span class="active match">b</span>
    <ul>
      <li>
        <span class="active match">c</span>
      </li>
    </ul>
  </li>
</ul>
<span class="passive match" id="2">d</span>
<ul>
  <li>
    <span class="passive match">e</span>
    <ul>
      <li>
        <span class="active">f</span>
      </li>
    </ul>
  </li>
</ul>
public class Array {
private JFrame jFrame;
private JTextArea textArea;
private JScrollPane scrollPane;
private Font font1;
static int numberCount = 1000;
static int numberRange = 1000;
static StringBuilder sb = new StringBuilder();

public Array() {

    jFrame = new JFrame("Random Prim Array Aufgabe Jannis Wedjelek");
    // jFrame.getContentPane().setLayout(new FlowLayout());
    font1 = new Font("SansSerif", Font.BOLD, 20);
    textArea = new JTextArea();
    textArea.setLineWrap(true);

    scrollPane = new JScrollPane(textArea);
    scrollPane.setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
    scrollPane.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_ALWAYS);

}

public void launchFrame() { // Create Layout

    jFrame.getContentPane().add(scrollPane);
    jFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    jFrame.pack();
    jFrame.setSize(600, 600);
    jFrame.setVisible(true);
    jFrame.setResizable(false);
    textArea.setFont(font1);
    textArea.setText(sb.toString());

    jFrame.add(scrollPane);
}

public static void main(String[] args) {

    int[] randomNumbersArray = generateRandom(numberCount);
    int primeCount = getPrimeNumberCount(randomNumbersArray);
    @SuppressWarnings("unused")
    int[] uniquePrimeArray = getPrimeArray(randomNumbersArray, primeCount);

    evenPercentage(randomNumbersArray);
    minMax(randomNumbersArray);

    Array gui = new Array();
    gui.launchFrame();

}

private static void minMax(int[] randomNumbersArray) {
    int min = numberRange;
    int max = 0;

    for (int number : randomNumbersArray) {
        if (number > max) {
            max = number;
        }
        if (number < min) {
            min = number;
        }
    }

    appendString("Das Maximum ist: " + max + ", das Minimum ist: " + min);

}

private static void evenPercentage(int[] randomNumbersArray) {
    int evenCount = 0;
    for (int number : randomNumbersArray) {
        // teilbarkeit durch 2 prüfen
        if (number % 2 == 0) {
            evenCount++;
        }

    }

    appendString(((float) evenCount * 100) / (float) randomNumbersArray.length + "% der Zahlen sind gerade");

}

private static int[] getPrimeArray(int[] randomNumbersArray, int primeCount) {
    int[] primeArray = new int[primeCount];

    int uniquePrimeCount = 0;

    // alle zahlen durchgehen
    for (int number : randomNumbersArray) {

        // nachschauen ob es eine Primzahl ist
        boolean isPrime = isPrime(number);
        if (isPrime) {

            // nachschauen ob primzahl schon in ausgabearray ist
            boolean isAlreadyInArray = false;
            for (int number2 : primeArray) {
                if (number2 == number) {
                    isAlreadyInArray = true;
                }
            }

            // wenn sie noch nicht drin ist hinzufügen
            if (!isAlreadyInArray) {
                primeArray[uniquePrimeCount] = number;
                uniquePrimeCount++;
            }
        }
    }

    // array anlegen mit größe von Primzahlanzahl
    int[] uniquePrimeArray = new int[uniquePrimeCount];
    for (int i = 0; i < uniquePrimeCount; i++) {
        uniquePrimeArray[i] = primeArray[i];
    }

    appendString(Arrays.toString(uniquePrimeArray));

    return primeArray;
}

private static int getPrimeNumberCount(int[] randomNumbersArray) {
    int primeCount = 0;

    for (int number : randomNumbersArray) {
        boolean isPrime = isPrime(number);
        if (isPrime) {
            appendString(number + " ist prim");
            primeCount++;
        }
    }

    appendString("Es gibt " + primeCount + " Primzahlen in dem Array von " + numberCount + " insgesamt");

    return primeCount;
}

private static int[] generateRandom(int numberCount) {
    int[] randomNumbers = new int[numberCount];

    for (int number = 0; number < randomNumbers.length; number++) {
        int random = (int) (Math.random() * numberRange + 1);
        randomNumbers[number] = random;

    }
    return randomNumbers;

}

private static boolean isPrime(int number) {
    for (int divisor = 2; divisor < number; divisor++) {
        if (number % divisor == 0) {
            return false;
        }
    }
    return true;
}

public static void appendString(String s) {
    sb.append(s);
    sb.append("\n");
    }
}