Question

我正在尝试创建一个非常简单的html文本编辑器。我已经利用上下文菜单功能，一旦用户选择屏幕上突出显示的文本，就会有不同的格式选项。

这就是我所拥有的。

function StyleChange(property) {
    var span = document.createElement("span");
    span.style.color = property;

    if (window.getSelection) {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var range = sel.getRangeAt(0).cloneRange();
            range.surroundContents(span);
            sel.removeAllRanges();
            sel.addRange(range);
        }
    }
}

这适用于更改突出显示文本的颜色。我想要做的是能够使用此函数通过在调用函数时传递一个额外的参数来更改文本的任何格式。因此，当它被称为它会说类似的东西。 StyleChange（＆＃39; color＆＃39;，red）或StyleChange（＆＃39; background＆＃39;，＆＃39; yellow＆＃39;）。

类似

function StyleChange(style,property) {
    var span = document.createElement("span");
    **span.style. + style = property;**

    if (window.getSelection) {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var range = sel.getRangeAt(0).cloneRange();
            range.surroundContents(span);
            sel.removeAllRanges();
            sel.addRange(range);
        }
    }
}

我收到任何想法的错误消息？

Answer 1

方括号用于传递属性，例如：

function StyleChange(property, value){
  var span = document.createElement('span');
  span.style[property] = value;
  if(window.getSelection){
    var sel = window.getSelection();
    if(sel.rangeCount){
      var range = sel.getRangeAt(0).cloneRange();
      range.surroundContents(span);
      sel.removeAllRanges();
      sel.addRange(range);
    }
  }
}

Answer 2

你可能想要

span.style += property;

代替。

另一个考虑因素：您不希望将名称property用于您的变量，因为这是一个保留关键字（正如您所看到的那样，因为它以蓝色突出显示），如果您使用一个，则会发生Bad Things™

HTML JS文本编辑器

2 个答案: