Question

我有2个divisoin

＆＃13;

<div id="details">
    <div id="feature">
    </div>
</div>

＆＃13;

我需要使用$("#details").html(content);（它正常工作）放置内容，就像我需要将内容放在功能div中我使用以下方式：

＆＃13;

 $("#details #feature").html(content);

＆＃13;

但它不起作用..如何解决？

Answer 1

当您使用$("#details").html(content);时，您会覆盖div的内容。因此，您的内部div将被删除，ID为feature。也许您使用$("#details").prepend(content);或者为主要内容添加另一个div并替换该内容。

看这里是一个例子：

https://jsfiddle.net/morrisjdev/s9u7rfcu/

Answer 2

ID是一个唯一属性，因此您可以直接使用如下所示的ID。

$(function() {
  var content = "Some text here";
  $('#feature').html(content);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="details">
  <div id="feature">
  </div>
</div>

或

$(function() { var content = "Some text here"; $('#details').find('#feature').html(content); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="details"> <div id="feature"> </div> </div>

Answer 3

＆＃13;

$(document).ready(function(){
    var htmldetail ="Hello! I am Here";
      var details = $("#details").html(htmldetail);
      $("#userfeature").html(details);

    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div id="details">
  <div id="userfeature">
  </div>
</div>

＆＃13;

Answer 4

第二个是#feature而不是#userfeature。并且还添加了jQuery库。您可以使用内容变量替换test。

$("#feature").html("test");

<div id="details">
 <div id="feature">
  </div>
           </div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

并且还要记住Id是唯一的，因此无需提及其父级。

运行以下代码段，您可以获得输出。

Answer 5

简单方法..通过这个

HTML

<div id="details">
   <div id="feature">
   </div>
</div>

JQUERY

    $(document).ready(function()
    {
      var content="contain sample data";
    //    $("#details").html(content); if you wrote like this,
 this will replace all content, so the inner div will be replaced
        $("#details").append(content); // outer div
        $("#feature").html(content);
    });

Answer 6

或者您可以使用类似css的选择器方法：

＆＃13;

$(document).ready(function() {
  $('#details > #feature').html('Hello <strong>World!!!</strong>');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="details">
    <div id="feature">
    </div>
</div>

＆＃13;

Answer 7

我为它创建了一个插件，它正在工作。

尝试在

中包含操作

$( document ).ready(function() {
    console.log( "ready!" );
    var content = 'Hey there';
    $("#details #feature").html(content);
});

普拉克： - http://plnkr.co/edit/63GsIoGmprnKs7oe77cF?p=preview

两个部门使用jquery将细节放在内部div中

7 个答案: