設計某個數組的某些值

我有一個名稱數組，其中一些重複。這些名字後來分成一半，然後輸出到li。我想要什麼也弄不清是讓我說名字Joeyc有造型text-decoration: line-through;出現在所有.book其中joeyc打印在其中。我的代碼是下面還有一個小提琴：基於內容設計某個數組的某些值

<div id="book1" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
    <div id="book2" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
    <div id="book3" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
    <div id="book4" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
    <div id="book5" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
    <div id="book6" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
     <div id="book7" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
     <div id="book8" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
     <div id="book9" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 
     <div id="book10" class="book"> 
     <ul class="hardcover_front"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="hardcover_back"> 
     <li></li> 
     <li></li> 
     </ul> 
     <ul class="book_spine"> 
     </ul> 
    </div> 


<script> 
var votenames = ["Joeyc", "JakeP97", "Joeyc", "TheKid", "Joeyc", "TheKid", "Joeyc", "JakeP97", "ExploreMeDora", "Alvaro"]; 
var ballots = ["#book1", "#book2", "#book3", "#book4", "#book5", "#book6", "#book7", "#book8", "#book9", "#book10"]; 

function splitName(plName,ballotNum) { 
    var halfplName = Math.round(plName.length/2); 
    var firstplName = plName.substr(0, halfplName); 
    var lastplName = plName.substr(halfplName, plName.length); 
    $(ballotNum + ' ul.hardcover_front').find('li:nth-child(2)').html(firstplName); 
    $(ballotNum + ' ul.hardcover_back').find('li:nth-child(1)').html(lastplName); 
} 

for (i=0; i<ballots.length; i++) { 
    splitName(votenames[i],ballots[i]); 
} 
</script>

https://jsfiddle.net/5m0qscch/

來源

2017-09-06 EGxo

CSS選擇器無法選擇的元素，但與jQuery選擇，你可以這樣做：

$('li:contains("two")').css("text-decoration", "line-through");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<li>one</li> 
 
<li>two</li>

但是在你的情況下，使用scr可以更簡單地生成HTML代碼本身IPT。然後，您可以基於當前數組項目，輕鬆地將CSS樣式/類添加到當前元素。

來源

2017-09-06 12:21:43 juzraai

您可以放置if條件並搜索包含所需字符串的任何<li>。

之後，你就可以使用：

document.getElementById("myelement").classList.add("myclass");

添加您選擇的CSS類。

來源

2017-09-06 12:30:59 Storm

設計某個數組的某些值

回答

相關問題