変更HTMLテキスト＆置き換えること

Question

私は名前の完全なHTMLリストに取り組んでいますし、それぞれの名前がこの形式で書かれている：

「ファーストネーム、姓/」 （例：ジョン・スミス/ ）

だから、私はにテキストの書式を変更するためにはJavaScriptを使用できるかどうかを知るために興味があった：「名姓」

（例：ジョン・スミス）

私はJavaScriptが比較的新しいので、まだ言語を使っていないので、これを行うことができませんでした。ここで

は、HTMLリストの抜粋です。また

<ul> 
<li><a href="john-smith/"> john-smith/</a></li> 
<li><a href="joe-smith/"> joe-smith/</a></li> 
<li><a href="gina-smith/"> gina-smith/</a></li> 
<li><a href="tom-smith/"> tom-smith/</a></li> 
<li><a href="peter-smith/"> peter-smith/</a></li> 
</ul> 

、私は十分に明確ではなかった場合、私はHREF、表示されているだけで、実際のテキストを変更する必要はありません。あなたが正規表現でこれを行うことができ

Answer 1

：

var REGEX_FIND = /(.*?)-(.*?)\/$/; 
 

 
//From: http://stackoverflow.com/questions/1026069/capitalize-the-first-letter-of-string-in-javascript 
 
function capitalizeFirstLetter(string) { 
 
    return string.charAt(0).toUpperCase() + string.slice(1); 
 
} 
 

 
$('ul li a').each(function() { 
 
    var text = $(this).text().trim(); 
 
    
 
    var m; 
 
    
 
    if ((m = REGEX_FIND.exec(text)) !== null) { 
 
    $(this).text(capitalizeFirstLetter(m[1]) + ' ' + capitalizeFirstLetter(m[2])); 
 
    } 
 
}); 
 

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
<li><a href="john-smith/"> john-smith/</a></li> 
 
<li><a href="joe-smith/"> joe-smith/</a></li> 
 
<li><a href="gina-smith/"> gina-smith/</a></li> 
 
<li><a href="tom-smith/"> tom-smith/</a></li> 
 
<li><a href="peter-smith/"> peter-smith/</a></li> 
 
</ul>

Answer 2

また、あなたがこの

jsFiddle

// target the anchor tags inside the list items 
 
var namesList = document.querySelectorAll('#namesList li a'); 
 

 
// loop through 
 
for (var i = 0; i < namesList.length; ++i) { 
 

 
    // text value, use trim to get rid of spaces on right and left sides of the string 
 
    var text = namesList[i].textContent.trim(), 
 
    
 
    // number of chars in text - 1, thus we automatically eliminate the last 
 
    // char "/" in each string 
 
    textL = text.length - 1, 
 
    firstName, lastName, theIndex; 
 

 
    // we determine the number where the symbol - lies 
 
    theIndex = text.indexOf('-'); 
 
    
 
    // for firstName, turn the first char to upper case, and append 
 
    // characters from the second char to the index of "-" minus 1 
 
    firstName = text.charAt(0).toUpperCase() + text.substring(1, theIndex); 
 
    
 
    // for lastName, turn the first char AFTER the index of "-" to upper case, and append 
 
    // characters from index + 1 to the value of text length 
 
    lastName = text.charAt(theIndex + 1).toUpperCase() + text.substring(theIndex + 2, textL); 
 
    console.log(firstName + ' ' + lastName); 
 
    
 
    // join firstName and lastName with space in between 
 
    namesList[i].textContent = firstName + ' ' + lastName; 
 
}

<ul id="namesList"> 
 
    <li><a href="john-smith/"> john-smith/</a></li> 
 
    <li><a href="joe-smith/"> joe-smith/</a></li> 
 
    <li><a href="gina-smith/"> gina-smith/</a></li> 
 
    <li><a href="tom-smith/"> tom-smith/</a></li> 
 
    <li><a href="peter-smith/"> peter-smith/</a></li> 
 
</ul>

のようにそれを行うことができます