Question

我正在使用angularjs处理应用。我从其他开发者处获得html个代码。我要求所有人都需要存储在一个对象中。

每次我重新加工以存储在这样的变量中：

var update = function () {
 string1 +="<div>some infor1 </div>"
 string1 +="<div>some infor2 </div>"
 string1 +="<div>some infor3 </div>"
 string1 +="<div>some infor4 </div>"
 string1 +="<div>some infor5 </div>"
 string1 +="<div>some infor6 </div>"

return string1;
}

但我正在寻找一种方法来将html复制并粘贴到变量中。我知道白空间和所有问题都有问题但是怎么想出来呢？

这是我的示例html：

<div class="projectInfo">
    <div class="column design">
        <span>Design Phase</span>
    </div>
    <div class="column projects">    
        <div class="flip-container">
            <div class="flipper">
                <div class="front">
                    <h3>
                        <span class="num">10</span>
                        <span class="numCount">Projects</span>
                    </h3>
                </div>
                <div class="back">
                    <h3>
                        <span class="num">10</span>
                        <span class="numCount">Projects</span>
                    </h3>
                </div>
            </div>
       </div>                   
   </div>
   <div class="column percent">
       <span>45%</span>
   </div>
</div>

Here you can update

Answer 1

我强烈建议您将HTML保存在HTML文件中，而不是JavaScript文件中。但是，如果你坚持在JavaScript中使用它们：

在ES6中，您将能够使用模板字符串。

同时，你可以这样做：

从var str = '
在'
使用任何体面的文本编辑器，选择粘贴的文本并执行一系列搜索和替换操作：
- 将所有\替换为\\，然后
- 将所有'替换为\'，然后
- 在HTML的每一行的末尾添加\（一个好的文本编辑器可以让你通过搜索和替换而不是手动执行）
将';添加到结尾

例如：

var str = '<div class="projectInfo">\
                    <div class="column design">\
                        <span>Design Phase</span>\
                    </div>\
                    <div class="column projects">\
    \
                    <div class="flip-container">\
                        <div class="flipper">\
                            <div class="front">\
                                <h3>\
                                    <span class="num">10</span>\
                                    <span class="numCount">Projects</span>\
                                </h3>\
                            </div>\
                            <div class="back">\
                                <h3>\
                                    <span class="num">10</span>\
                                    <span class="numCount">Projects</span>\
                                </h3>\
                            </div>\
                        </div>\
                    </div>\
    \
                    </div>\
                    <div class="column percent">\
                        <span>45%</span>\
                    </div>\
                </div>';
document.body.insertAdjacentHTML("beforeend", str);

Answer 2

我非常同意将您的HTML保存在HTML文件中（建议您更改当前的实现）

如果没有，那么您可以使用以下步骤来创建html sting 你可以使用像Notepad ++这样的编辑器

并按照以下步骤操作：

删除所有空行
将所有\r替换为' +
在每行的开头添加'（您可以通过按Alt并选择每行的开头并键入来执行此操作）
将;添加到结尾

现在你的html已准备好作为单个字符串，你可以将它复制粘贴到变量并使用它。

如何以最简单的方式修剪和传递`html`文本到变量？

2 个答案: