風格在javascript中的子串

Question

嗨，我想用JavaScript來設計一個子串。這裏是我的代碼：「未定義」

function runtest(){ 
    document.getElementById("test1").innerHTML.substring(0,2).style.fontStyle="italic"; 
} 

的子功能的工作原理，但是當我添加樣式的錯誤控制檯給我的錯誤我怎樣才能用JavaScript來設計這個子字符串？

Answer 1

兩個選項：

1. 的innerHTML解決方案。 警告：這將刪除您正在執行的元素內的任何元素的任何事件處理程序。我提到這主要是在這裏，所以我可以指出這一點：

   var elm = document.getElementById("test1"); 
   var html = elm.innerHTML; 
   elm.innerHTML = '<span style="font-style: italic">' + html.substring(0, 2) + '</span>' + html.substring(2); 
   

2. 使用splitText。在這裏，我假設您要在一個範圍內打包的文本是元素中的第一個文本節點。這不會亂了事件處理程序上的元素：

   var elm = document.getElementById("test1"); 
   var node = elm.firstChild; 
   var span = document.createElement('span'); 
   node.splitText(2); 
   span.style.fontStyle = "italic"; 
   elm.insertBefore(span, node); 
   span.appendChild(node); 
   

   splitText創造那裏曾經是一個兩個相鄰的文本節點，與分割點是在偏移指定。然後我們拿第一個包裹在span。

   Live Example | Live Source