将元素放在其他元素的innerHTML中

时间:2013-09-15 12:33:28

标签: javascript jquery html

我正在用JavaScript编写一个小编辑器。我要问的是,当我点击“Bold”按钮时,我会这样添加:

function addBold() {
    var el = selection().anchorNode.parentNode; 
    var str = el.innerHTML; 
    var offset = selection().getRangeAt(0).endOffset;
    var start = str.substr(0,offset);
    var end = str.substr(offset, str.length);
    el.innerHTML = start + '<b>&#32;</b>' + end;
    placeCaretAtNode(el.children[0]);
}

我需要使用appendChild追加Bold元素,以便保存元素而不是:

el.innerHTML = start + 'HERE I NEED TO GET THIS ELEMENT' + end;

感谢。

2 个答案:

答案 0 :(得分:1)

下载代码。告诉我这是否有效

     <!DOCTYPE html>
<html>
<head>
    <script>

function  bgchange() {
try{
var child = document.createElement("b");
child.innerHTML = "Test";
document.getElementById("dvPercentage").innerHTML = document.getElementById("dvPercentage").innerHTML + "Test"
 document.getElementById("dvPercentage").appendChild(child);
 document.getElementById("dvPercentage").innerHTML = document.getElementById("dvPercentage").innerHTML + "Test"
 }catch(e){
 alert(e);
 }
};
    </script>
<head>
<body onload="bgchange()" style="background-color:red">
      <div id="dvPercentage" style="height: 80%">
</body>
</html>

所以不做el.innerHTML = start + '<b>&#32;</b>' + end;

你可以去el.appendChild(child)

如果有效,请告诉我

答案 1 :(得分:0)

如果要切换粗体功能,可以执行以下代码:

document.execCommand('bold');

但如果您喜欢自己的方法,请尝试以下方法:

var bold;

while(el.firstChild) {  // empty the el element
    el.removeChild(el.firstChild);
}

el.appendChild(document.createTextNode(start));

bold = document.createElement('b');
bold.appendchild(document.createTextNode('bold string'));
el.appendChild(bold);

el.appendChild(document.createTextNode(end));