Question

当我通过正确的方法insertHtml在Word文档中插入HTML时，p标记中包含的所有html内容都是“Times New Roman”;其余的是'Calibri'，这是文档的默认字体。例如，<div>Hello</div>在Calibri中为Hello; <p>Hello</p>将出现在Times New Roman的Hello中。除了插入的html的最后一段，它始终位于Calibri。

我尝试context.document.getSelection().insertHtml(myHtml, "replace")，尝试将其插入内容控件并设置myContentControl.styleBuiltIn = 'Normal'或myContentControl.font.name = 'Calibri'，但它不会改变任何内容！

有没有人有想法？

谢谢！

编辑Cindy Html走时代新罗马;没有涉及CSS，只是简单的HTML

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed faucibus varius erat, at vulputate elit lacinia et. Nullam mattis vitae nunc eget ultrices. Cras massa lacus, vulputate id tristique quis, iaculis a leo. Ut iaculis est nunc, vitae venenatis turpis lacinia nec. Donec auctor elementum augue id accumsan. Etiam vehicula orci orci, in sollicitudin nunc lobortis in. Etiam id mauris rhoncus, varius ligula quis, faucibus dolor. Vestibulum gravida metus sit amet imperdiet consequat. Integer vehicula malesuada nisi sit amet imperdiet. In tristique vulputate massa, eu mattis massa dictum ac. Suspendisse non sem at mi fermentum pretium. Etiam tincidunt augue ut justo pretium, eu auctor velit blandit. Etiam massa leo, lacinia vel facilisis nec, mattis quis enim.</p>

<p>Donec elementum nulla et neque maximus volutpat. Pellentesque scelerisque aliquam velit, et tincidunt neque feugiat nec. Etiam euismod arcu sit amet turpis eleifend commodo. Donec consectetur erat at rhoncus semper. Suspendisse vel dui sollicitudin, condimentum eros sed, malesuada augue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Proin finibus, orci feugiat ullamcorper aliquam, magna enim molestie libero, vel maximus diam elit non sem. Donec et molestie arcu, non commodo nisl.</p>

<p>Nunc placerat a metus mattis fringilla. Pellentesque ac mattis nisl. Aliquam sit amet maximus nulla. Ut leo erat, efficitur eget dapibus a, maximus sed nisi. Proin lacinia efficitur ex vel congue. Fusce quis ullamcorper mauris. Duis eu nunc pellentesque, egestas tellus eu, auctor lacus. Suspendisse pellentesque nunc nisi, id condimentum felis pretium a. Integer eu nulla pharetra, ullamcorper nulla in, faucibus turpis.</p>

编辑和NB ：为了完全透明，我设法通过执行以下操作将内容控件的样式设置为“正常”。但我仍然想明白为什么这个时代新罗马的事情正在发生，如果有一个比这更清洁的方式：

var thisDocument = context.document,
            range = thisDocument.getSelection(),
            contentControl = range.insertContentControl();
        contentControl.insertHtml(element, Word.InsertLocation.start);
        return context.sync().then(function () {
            contentControl.styleBuiltIn = 'Normal';
            return context.sync();
        });

Answer 1

这是设计的。所有<p>都应该获得浏览器的默认样式，除非它们具有覆盖它的style属性。尝试将style="font-family:calibri"添加到您想要成为Calibri的段落中。错误是最后一段忽略了style属性（以及浏览器的默认样式）。解决方法是在最后一段之后添加<br>或<p></p>。

Answer 2

好的，对于那些碰巧在这里结束的人来说，这是我测试的结果。

添加内容控件并将其styleBuiltIn设置为正常设置正确设置我的内部html。我的意思是这样的：

var thisDocument = context.document,
        range = thisDocument.getSelection(),
        contentControl = range.insertContentControl();
    contentControl.insertHtml(element, Word.InsertLocation.start);
    return context.sync().then(function () {
        contentControl.styleBuiltIn = 'Normal';
        return context.sync();
    });

设置段落的字体不起作用。我去查看XML表示文件，我发现了Rick正在谈论的内容。我的所有<p>代码都会自动嵌套在<w:p>代码中，例如：

<w:p w:rsidR="00FC6339" w:rsidRDefault="00FC6339">
  <w:pPr>
    <w:pStyle w:val="NormalWeb"/>
    <w:divId w:val="342317998"/>
  </w:pPr>
  <w:r>
    <w:t xml:space="preserve">My awesome text</w:t>
  </w:r>
</w:p>

这里的关键是<w:pStyle>标签，它设置了内置样式，定义如下：

<w:style w:type="paragraph" w:styleId="NormalWeb">
<w:name w:val="Normal (Web)"/>
<w:basedOn w:val="Normal"/>
<w:uiPriority w:val="99"/>
<w:semiHidden/>
<w:unhideWhenUsed/>
<w:rsid w:val="006D08D1"/>
<w:pPr>
  <w:spacing w:before="100" w:beforeAutospacing="1" w:after="100" w:afterAutospacing="1" w:line="240" w:lineRule="auto"/>
</w:pPr>
<w:rPr>
  <w:rFonts w:ascii="Times New Roman" w:eastAsiaTheme="minorEastAsia" w:hAnsi="Times New Roman" w:cs="Times New Roman"/>
  <w:sz w:val="24"/>
  <w:szCs w:val="24"/>
  <w:lang w:eastAsia="fr-FR"/>
</w:rPr>

您可以在此处看到字体为Times New Roman，大小为24（即12pt）。

我不打算进入“在文档加载时修改内置样式”字段，所以我最终得到了Rick解决方案，即：

 Word.run(function (context) {
        var thisDocument = context.document,
            range = thisDocument.getSelection(),
            paragraph = range.insertParagraph("", Word.InsertLocation.after),
            //Getting range "start" because, if user selection contains different fonts, font will be null
            _range = range.getRange("start"),
            rangeFontName,
            rangeFontSizePx,
            rangeFontColor;
        _range.load('font');
        return context.sync().then(function () {
            rangeFontName = _range.font.name;
            //Font size returned by the doc is in pt -> convert to px
            rangeFontSizePx = (96 / 72 * _range.font.size) + "px";
            rangeFontColor = _range.font.color;

            //Setting style inline
            element.find('p').css({
               'font-family': rangeFontName,
               'font-size': rangeFontSizePx,
               'color': rangeFontColor
            });
            paragraph.insertHtml(element.html(), Word.InsertLocation.replace);
            });
            return context.sync()
        });
    });

而且......得到了！现在插入的html中的<p>标签与插入/选择在Word文档中的标签具有相同的基本字体参数。

Word Office.js中

2 个答案: