如何在javascript中从段落中的数组中追加文本？_Javascript_Html_Css_Arrays

如何在javascript中从段落中的数组中追加文本？

javascript html css arrays

如何在javascript中从段落中的数组中追加文本？,javascript,html,css,arrays,Javascript,Html,Css,Arrays,如何使用数组中的文本附加段落首先，我将元素放入数组中： var iminja = []; iminja.push("Name1"); 然后我对数组“iminja”中的每个元素使用for循环，我想将新段落与数组中的文本一起放入现有的空div。类似这样的东西，这只是为了向你解释我希望如何成为函数的最终结果： $('#existingDiv').append('<p style="border: 1px solid black;">iminja[index]</p>');

如何使用数组中的文本附加段落

首先，我将元素放入数组中：

var iminja = [];
iminja.push("Name1");

然后我对数组“iminja”中的每个元素使用

for

循环，我想将新段落与数组中的文本一起放入现有的空

div

。类似这样的东西，这只是为了向你解释我希望如何成为函数的最终结果：

$('#existingDiv').append('<p style="border: 1px solid black;">iminja[index]</p>');

$（'#existingDiv'）。追加（'iminja[index]”）；

有人能帮我吗？

下面的代码应该可以做到这一点：

$.each(iminja, function () {
    $("#existingDiv").append("<p style=\"border: 1px solid black;\">" + this + '</p>');
});

或者根本不使用jQuery

var container = document.getElementById("existingDiv");
for (var item in iminja) {
    var paragraph = document.createElement("p");
    paragraph.setAttribute("style", "border: 1px solid black;");
    paragraph.innerHTML = iminja[item];
    container.appendChild(paragraph);
}

下面的代码应该可以做到这一点：

$.each(iminja, function () {
    $("#existingDiv").append("<p style=\"border: 1px solid black;\">" + this + '</p>');
});

或者根本不使用jQuery

var container = document.getElementById("existingDiv");
for (var item in iminja) {
    var paragraph = document.createElement("p");
    paragraph.setAttribute("style", "border: 1px solid black;");
    paragraph.innerHTML = iminja[item];
    container.appendChild(paragraph);
}

$（'#existingDiv'）.append（''+iminja[index]+''）；

不是

$（'#existingDiv'）。追加（'iminja[index]”）；

$（'#existingDiv'）。追加（''+iminja[index]+''）；

不是

$（'#existingDiv'）。追加（'iminja[index]”）；

要在可以使用的数组上迭代，请执行以下操作：

这将为

iminja

中的每个元素调用

addp（）。以下是实现该功能的方法：
function addp(str)
{
    var par = document.createElement('P');
    par.setAttribute('style', 'border: 1px solid black');
    par.appendChild(document.createTextNode(str));

    document.getElementById('existingDiv').appendChild(par);
}

它创建一个新的
元素，指定文本内容和所需样式，然后将其附加到现有的元素容器中。
要在可以使用的数组上进行迭代，请执行以下操作：
这将为iminja
中的每个元素调用addp（）。以下是实现该功能的方法：
function addp(str)
{
    var par = document.createElement('P');
    par.setAttribute('style', 'border: 1px solid black');
    par.appendChild(document.createTextNode(str));

    document.getElementById('existingDiv').appendChild(par);
}

它创建一个新的
元素，指定文本内容和所需样式，然后将其附加到现有的元素容器中。
测试此文件
完整HTML页面

迪马克
#existingDiv中的一些文本
var iminja=[]；
iminja.push（'Name1'）；
iminja.push（'Name2'）；
iminja.push（'Name3'）；
iminja.push（“堆栈溢出”）；
iminja.push（'Dimac'）；
伊米尼亚推（Ersin Basaran）；
iminja.push（“杰克”）；
iminja.push（'Adnan'）；
/*
//示例1由Ersin Basaran编写（由Adnan编辑）
$.each（iminja，function（）{
$（“#existingDiv”）.append（“”+this+””）；
});
*/
/*
//示例2由Ersin Basaran编写（由Adnan编辑）
（我在伊米尼亚）{
$（“#existingDiv”）.append（“”+iminja[i]+””）；
};
*/
//阿德南的例子3
对于（i=0；i测试此文件
完整HTML页面

迪马克
#existingDiv中的一些文本
var iminja=[]；
iminja.push（'Name1'）；
iminja.push（'Name2'）；
iminja.push（'Name3'）；
iminja.push（“堆栈溢出”）；
iminja.push（'Dimac'）；
伊米尼亚推（Ersin Basaran）；
iminja.push（“杰克”）；
iminja.push（'Adnan'）；
/*
//示例1由Ersin Basaran编写（由Adnan编辑）
$.each（iminja，function（）{
$（“#existingDiv”）.append（“”+this+””）；
});
*/
/*
//示例2由Ersin Basaran编写（由Adnan编辑）
（我在伊米尼亚）{
$（“#existingDiv”）.append（“”+iminja[i]+””）；
};
*/
//阿德南的例子3
对于（i=0；我考虑了一下，但我忘了写为文本添加新段落的函数必须是清晰的javascript函数，没有jquery…你的意思是没有append
函数吗？是的…只是“append”方法是jQuery方法。没有append方法怎么办？我想了想，但我忘了写为文本添加新段落的函数必须是清晰的javascript函数，没有jQuery…你是说也没有append函数？是的…只是“append”方法是jQuery方法。没有append方法怎么办？请尝试给出解释。请尝试给出解释。您已经用jQuery标记了问题：pYes我知道，但之后我意识到我不能使用jQuery，但是我们解决了问题：）您已经用jquery标记了这个问题：pYes我知道，但在那之后我意识到我不能使用jquery，但是我们解决了这个问题：）
function addp(str)
{
    var par = document.createElement('P');
    par.setAttribute('style', 'border: 1px solid black');
    par.appendChild(document.createTextNode(str));

    document.getElementById('existingDiv').appendChild(par);
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Dimac</title>
        <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    </head>
    <body>
        <div id="existingDiv">
            <p>Some texts in #existingDiv</p>
        </div>
        <script type="text/javascript">
            var iminja = [];
            iminja.push('Name1');
            iminja.push('Name2');
            iminja.push('Name3');
            iminja.push('stackoverflow');
            iminja.push('Dimac');
            iminja.push('Ersin Basaran');
            iminja.push('Jack');
            iminja.push('Adnan');
            /*
                //Example1 by Ersin Basaran ( edited by Adnan )
                $.each(iminja,function(){
                    $('#existingDiv').append('<p style="border: 1px solid #000;">'+this+'</p>');
                });
            */
            /*
                //Example2 by Ersin Basaran ( edited by Adnan )
                for(i in iminja){
                    $('#existingDiv').append('<p style="border: 1px solid #000;">'+iminja[i]+'</p>');
                };
            */
            //Example3 by Adnan
            for(i=0;i<iminja.length;i++){
                $('#existingDiv').append('<p style="border: 1px solid #000;">'+iminja[i]+'</p>');
            }
            /*
                //Example4 by Jack ( edited by Adnan )
                function addp(str){
                    $('#existingDiv').append('<p style="border:solid 1px #000;">'+str+'</p>');
                }
                for(i=0;i<iminja.length;i++){
                    addp(iminja[i]);
                }
            */
        </script>
    </body>
</html>