質問編集履歴
2
.dailyにdisplay:none;が記入される経緯を追加しました。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
### 実現したいこと
|
|
2
2
|
.dailyがすべてdisplay:none;になっているとき親要素の.month1を非表示にしたいです。
|
|
3
3
|
また、.month1は複数あり、すべての.dailyがdisplay:none;になっている場合、それの親要素のみを非表示にしたいです。
|
|
4
|
+
inputで検索機能を付けており、当てはまらない.dailyにdisplay:none;が付くようになっています。
|
|
4
5
|
|
|
5
6
|
### 発生している問題・分からないこと
|
|
6
7
|
すべての子要素がdisplay:none;のときだけ、親要素を非表示にする方法がわかりません。
|
|
@@ -10,6 +11,7 @@
|
|
|
10
11
|
### 該当のソースコード
|
|
11
12
|
|
|
12
13
|
```
|
|
14
|
+
<input type="search" id="input" onkeyup="javaSearch()" placeholder="Search">
|
|
13
15
|
<details class="month1" open><summary class="month">10</summary>
|
|
14
16
|
<div class="daily">
|
|
15
17
|
<h2>14</h2>
|
|
@@ -20,6 +22,11 @@
|
|
|
20
22
|
<p>おおおおa</p>
|
|
21
23
|
</div>
|
|
22
24
|
</details>
|
|
25
|
+
<script>
|
|
26
|
+
function javaSearch() {
|
|
27
|
+
document.querySelectorAll('.daily').forEach(item => item.querySelectorAll('p')[0].innerText.toLowerCase().indexOf(document.querySelector('#input').value.toLowerCase()) > -1 ? item.style.display = 'block' : item.style.display = 'none');
|
|
28
|
+
}
|
|
29
|
+
</script>
|
|
23
30
|
```
|
|
24
31
|
|
|
25
32
|
### 試したこと・調べたこと
|
1
detailsにclass名を付けました
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
### 実現したいこと
|
|
2
|
-
.dailyがすべてdisplay:none;になっているとき親要素の.monthを非表示にしたいです。
|
|
2
|
+
.dailyがすべてdisplay:none;になっているとき親要素の.month1を非表示にしたいです。
|
|
3
|
-
また、.monthは複数あり、すべての.dailyがdisplay:none;になっている場合、それの親要素のみを非表示にしたいです。
|
|
3
|
+
また、.month1は複数あり、すべての.dailyがdisplay:none;になっている場合、それの親要素のみを非表示にしたいです。
|
|
4
4
|
|
|
5
5
|
### 発生している問題・分からないこと
|
|
6
6
|
すべての子要素がdisplay:none;のときだけ、親要素を非表示にする方法がわかりません。
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
### 該当のソースコード
|
|
11
11
|
|
|
12
12
|
```
|
|
13
|
-
<details open><summary class="month">10</summary>
|
|
13
|
+
<details class="month1" open><summary class="month">10</summary>
|
|
14
14
|
<div class="daily">
|
|
15
15
|
<h2>14</h2>
|
|
16
16
|
<p>スタート</p>
|