JqueryまたはjavaScriptで文字列の最初の文字を取得するには？

Question

私はスパンが内側スパンであり、内側スパン（t）の最初の文字を取得してその色を変更しようとしています。私には、JavaScriptとjQueryの両方で多くの方法で、それはあなたがHTMLを交換する必要が

// with javascript  
 

 
var index = document.getElementById('spa'); 
 
var indexsl = index.slice(0, 1); 
 
indexsl.style.color = "f00"; //doesn't work 
 

 
var index = document.getElementById('spa'); 
 
var indexsl = index.substring(0, 1); 
 
indexsl.style.color = "f00"; //doesn't work 
 

 
var index = document.getElementById('spa'); 
 
var indexsl = index.charAt(0, 1); 
 
indexsl.style.color = "f00"; //doesn't work 
 

 

 
// with jQuery 
 

 
var index = $('.design span').charAt(0); 
 
index.css('color', '#f00') // doesn't work 
 

 
var index = $('.design span').substring(0, 1); 
 
index.css('color', '#f00') // doesn't work 
 

 
var index = $('.design span').slice(0, 1); 
 
index.css('color', '#f00') // doesn't work

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="design">DESIGNED BY <span id="spa">Teodor Victor</span></span>

Answer 1

動作しないことを実行しようとしました：

ind=index.innerHTML.split(""); 
ret="<span class='red'>"+ind.first()+"</span>"+ind.join(""); 
index.innerHTML=ret; 

Answer 2

それとも、スキップすることができますJavaScriptを使用してCSSを使用します。

span.design > span::first-letter { 
 
    color:red; 
 
} 
 

 
span { 
 
    display:inline-block; 
 
}

<span class="design">DESIGNED BY <span>Teodor Victor</span></span>

Answer 3

あなたは、最初の文字を取得する別のフォントの色でそれを挿入し、残りのコンテンツを追加することができます。

var span = $('.design span'); 
 
var html = span.html(); 
 

 
span.html("<span style='color:red;'>"+ html.charAt(0) +"</span>" + html.substring(1,html.length));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<span class="design">DESIGNED BY <span>Teodor Victor</span></span>

Answer 4

あなたはこのようにしてみてくださいましたか？何をしたい

var header = $('.design span').text().charAt(0); 
index.css('color','#f00'); 

それとも

var header = $('.design span').text().substring(0,1); 
index.css('color','#f00'); 

Answer 5

はcharAtです。

var str = 'some string'; 
console.log(str.charAt(0)); // return 's'