在另一个jQuery之前插入一个HTML元素

我想知道如何在jQuery之前插入一个HTML元素。能够从输入中获取新元素的内容也很重要。类似的东西，但工作：在另一个jQuery之前插入一个HTML元素

var input = $("#theInput").val(); 

var content = document.createElement("p"); 

content.appendChild(document.createTextNode(input)); 

$("div").insertBefore(content);

来源

2013-12-14 user3023071

你混了顺序，'$（内容）.insertBefore（ “格”）;'，或者只是'$（ “格”）前（的内容）;' – adeneo

试试这个：

$("div").prepend(content);

来源

2013-12-14 16:41:20 HICURIN

见下面的例子：

HTML结构：

<div class="container"> 
    <h2>Greetings</h2> 
    <div class="inner">Hello</div> 
</div>

的Jquery：

$(".inner").before("<p>Test</p>");

结果（HTML）：

<div class="container"> 
    <h2>Greetings</h2> 
    <p>Test</p> 
    <div class="inner">Hello</div> 
</div>

编辑：

请参见下面的示例，它从文本框取值之前

HTML结构插入：

<div id="content"> 
<input type="text" value="textboxvalue" > <br/><br/> 
<span>Insert text box value befor this one</span>  
</div>

查询：

var inputval = $("#content input").val(); 
$("#content span").before("<p>" + inputval + "</p>");

来源

2013-12-14 16:45:16

它。一切都好，就像我在谷歌找到的其他例子。但是，你能帮我解释一下如何将输入变量添加到该段落中。因为在这里它被添加到HTML文件，如文本，我不知道它是否可以修改 – user3023071

我已经在我的评论中添加了上面的一个新示例，工作jsfiddle链接是http://jsfiddle.net/Np8U8/2 / –

JSFIDDLE

选择1 - 只需使用jQuery：

var input = $("#theInput").val(); 
$("<p />")      // Create a paragraph element. 
    .text(input)    // Set the text inside the paragraph to your input. 
    .insertBefore($("div")); // Insert the paragraph before the div element(s).

选项2 - 修改代码：

var input = $("#theInput").val(), 
    content = document.createElement("p"); 
content.appendChild(document.createTextNode(input)); 
$(content).insertBefore($("div"));

选项2a - 或者你可以改变最后一行：

$("div").before(content);

来源

2013-12-15 02:17:47 MT0

在另一个jQuery之前插入一个HTML元素

回答

相关问题