如何使用 jQuery 将 HTML 添加到 div 元素答案

【问题标题】：How to add HTML to div element using jQuery如何使用 jQuery 将 HTML 添加到 div 元素
【发布时间】：2017-03-23 05:56:13
【问题描述】：

<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

<script type="text/javascript">
  jQuery(document).ready(function () {
    jQuery('<i class="fa fa-arrow-up"></i>').insertAfter('.section-inner');
 });
</script>

上面的代码我试过了，但它不起作用谁能帮我解决这个问题。

谢谢

【问题讨论】：

你能解释一下it not working是什么意思吗？另外，您缺少> i
正如许多人正确指出的那样，它应该是></i> 或/>。

标签： javascript jquery html wordpress wordpress-theming

【解决方案1】：

.insertAfter 可以正常使用文本确保您已添加

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> 到您的文件中。

jQuery('&lt;i class="fa fa-arrow-up" aria-hidden="true"&gt;&lt;/i&gt;').insertAfter('.section-inner');

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

【讨论】：

问题出在 HTMLString 中。它是一个拼写错误，而不是缺少资源。请不要回答此类问题

【解决方案2】：

you can use this simple method to add a div inside target area
$('.target-area').append('<div></div>');

if you want to wrap a pre existing elemnt to a tag you should use this one

$(document).ready(function(){
   $("button").click(function(){
        $("p").wrap("<div></div>");
    });
});

【讨论】：

问题在 html 字符串中，而不是在 OP 的代码中。这只是一个打字错误，我们不应该回答这样的问题

【解决方案3】：

替换 <i class="fa fa-arrow-up" 到 <i class="fa fa-arrow-up"> </i>

jQuery(document).ready(function(){
   
     jQuery('<i class="fa fa-arrow-up"> </i>').insertAfter(".section-inner");
   
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/>


<div class="section">
    <div class="section-inner">
        <p>Something Here...</p>
    </div>
</div>

【讨论】：

您的代表的用户应该知道这是一个印刷错误，回答这样的问题是不好的
我再重复一遍回答这样的问题不好。评论应该绰绰有余。
我在回答中解释了用户错误以及如何通过示例解决，然后用户可以轻松理解...
我并不怀疑你的意图。他们是正确的。你的观点也是如此。但这是一个简单的错误，不会为门户增加太多价值，因为很少有人会犯同样的拼写错误。回答错字问题也是一种不好的做法。我们在这里帮助不调试。
我真的为我在此类问题中的拼写错误道歉拼写错误仅在我的代码中存在问题我输入了完全正确的代码实际上我正在尝试在 wordpress 主题中的
元素之后添加 HTML但它没有用

【解决方案4】：

.insertAfter 工作正常，你使用它的方式，但它不适合你，然后尝试如下

jQuery('.section').append('&lt;i class="fa fa-arrow-up"&gt;Appended&lt;/i&gt;');

JSFiddle 你可以在这里查看 - https://jsfiddle.net/181j7656/

【讨论】：