Question

有没有办法用变量赋值嵌套的div属性？喜欢

<div>
  <div>
    123456
  </div>
</div>

成为

<div>
  <div sectionid="123">
    123456
  </div>
</div>

BTW以上组件将由JavaScript创建。

我尝试过类似的东西，但是没有用。

var a = $('<div><div>123456</div></div>');
a.eq(":nth-child(2)").attr("sectionid", "123");

Answer 1

nth-child(2) maches元素是其父元素的第二个子元素。这不是你的div的情况，它是父div的第一个元素。

.eq在特定索引处找到元素。它不是传递选择器的地方。

子选择器>将找到一个子元素，即div>div将找到div作为div的直接子元素。

请注意，您提供的代码$('<div></div>123456<div></div>');并未像您已粘贴的那样创建DOM树。

更新，现在编辑了代码，a的值是带有子div的div。由于a.find会在a内执行搜索，因此您不必使用子选择器，但可以立即找到div：

a.find('div')

Answer 2

试试这个代码段。

//FOR DOM HTML
console.log("FOR DOM HTML");
//1st way
$('#input > div').find('div').attr("sectionid","123");
console.log($('#input').html());
//2nd way
$('#input > div > div').attr("sectionid","321");
console.log($('#input').html());


//JS HTML
console.log("FOR JS OBJECT");
var input = $('<div><div>123456</div></div>');
//1st way
input.eq(0).children().attr('sectionid', '456');
console.log(input[0].outerHTML);
var input = $('<div><div>123456</div></div>');
//2nd way
$(input[0]).children().attr('sectionid', '789');
console.log(input[0].outerHTML);

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

Answer 3

只需将属性应用于子项。没有复杂的'发现'，eq（）等。

var a = $('<div><div>123456</div></div>');

a.children().attr('sectionid', '123');
$('body').append(a);

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

Answer 4

为什么不首先添加它？不清楚你以后再添加它！

$(document).ready(function() {
  var sectionid = "123";
  var a = $('<div><div sectionid="' + sectionid + '">123456</div></div>');
  $('body').append(a);
});

div[sectionid]{
  color: red;
  }

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

Answer 5

试试这个 - 我在代码中添加了注释来解释发生了什么。

检查元素以查看属性是否已添加

＆＃13;

var a = $('<div><div>123456</div></div>'); // change this to match the structure you want

a.children() // .children gets the direct descendant (which should be the nested div
  .eq(0) // gets the first in the array that is returned (if there are multiple direct descendents) - it is a 0 based index selector
  .attr('sectionid', '123');

$('body').append(a)

＆＃13;

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

＆＃13;

More information about .children()

More information about .eq()

Answer 6

试一试：

$(document).ready(function(){

    $("div").eq(1).attr("sectionid","123");

})

Jquery分配第二个子属性

6 个答案: