在2个divs中将字符串分为一半

希望编写将字符串分为一半的代码。例如，如果输入的名称为" Trishy"，则为6个字母，前3个字母进入<ul class="hardcover_front">的第二个li，而后3个字母进入<ul class="hardcover_back">的第一个li。

请注意，我需要此申请多个字符长度的多个名称。

<div id="book1" class="book">
        <ul class="hardcover_front">
            <li></li>
            <li>Tri</li>
        </ul>
        <ul class="hardcover_back">
            <li>shy</li>
            <li></li>
        </ul>
        <ul class="book_spine">
        </ul>
</div>

这是让您前进的一些步骤。使用Google了解您不了解的零件。有了半工程解决方案后，只需使用JS更新问题，然后看看会发生什么...

获取字符串的长度;
确定中间，考虑到7个字符的中间是3.5，因此您必须使用数学来解决结果；
使用substring获取您需要的字符;
使用document.querySelector或类似方法从DOM
设置您通过textContent或innerHTML检索到的元素的文本。

var s = "Trishy";
var half = Math.round(s.length / 2);
var first = s.substr(0, half);
var last = s.substr(half + 1, s.length);
$('#book1 ul.hardcover_front').find('li:nth-child(2)').html(first);
$('#book1 ul.hardcover_back').find('li:nth-child(1)').html(last);

这应该可以解决问题。

您可以将字符串的两个半部分获取，并在您想要的任何地方使用它们

<!DOCTYPE html>
<html>
<body>
<p>Click the button to extract characters from the string.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
    var str = "Helloworld!";
    var length = str.length;
   
    if(length%2 == 0){
    res = str.substring(0, length/2);
   	res1 = str.substring(length/2, length);
    
    }
    else{
    res = str.substring(0, (length/2) + 1);
   	res1 = str.substring((length/2) + 1, length);
    
    }
    alert("First Half- "+res+"n"+"Second Half- "+res1);
    console.log("First Half- "+res+"n"+"Second Half- "+res1);
}
</script>
</body>
</html>

相关内容

最新更新

热门标签：