Jquery分配第二个子属性
Jquery assign second child attribute
是否有方法分配嵌套的div属性与变量?像
<div>
<div>
123456
</div>
</div>
成为<div>
<div sectionid="123">
123456
</div>
</div>
上面的组件将由JavaScript创建。
我试过这样做,但是没有成功。
var a = $('<div><div>123456</div></div>');
a.eq(":nth-child(2)").attr("sectionid", "123");
试试这段代码。
//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>
nth-child(2)
替换父元素的第二个子元素。div不是这种情况,它是父div的第一个元素。
.eq
在特定索引处查找元素。它不是传递选择器的地方。
子选择器>
将找到一个子元素,即div>div
将找到一个div,该div是div的直接子元素。
请注意,您提供的代码$('<div></div>123456<div></div>');
并没有创建像您粘贴的那样的DOM树。
更新,现在已经编辑了代码,a
的值是一个带子div的div。由于a.find
将在a
中执行搜索,您不必使用子选择器,但可以立即找到div:
a.find('div')
将属性应用于子元素。没有复杂的'find', 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>
你为什么不把它放在首位呢?不清楚是否稍后添加!
$(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>
试试这个-我在代码中添加了注释来解释正在发生的事情。
检查元素是否添加了属性
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)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
关于.children()的更多信息
关于.eq()的更多信息
试一试:
$(document).ready(function(){
$("div").eq(1).attr("sectionid","123");
})
相关文章:
- 下拉选择可自动更改第二个下拉选择
- 为什么不'在JQuery中找到第二个css选择器的工作
- 当单击第一个李时,它显示内容一,当单击第二个李时,它显示内容二
- CORS-重定向到第二个GET正在接收的页面
- 正则表达式与数字中的第二个点匹配
- 如何在react js中移动第二个组件
- 使用Javascript,如何显示<tr>在另一<tr>悬停时,隐藏第二个<tr>
- 关闭第二个事件源上的第一个事件源's onopen方法
- 页面上第二个表单所需的唯一 id 属性
- 对象和数组:参照第二个对象更改对象属性(chart.js示例)
- 在同一对象上添加第二个动画将删除css属性
- 从第一个和更改操作属性填充第二个选择列表
- 从变量中获取第二个数据属性值
- javascript/html:第二个onclick属性
- 如何在JavaScript中添加第二个属性?
- 如何对具有第二个属性的对象的数组进行排序
- 如何改变SVG中元素的属性,当我鼠标悬停在第二个SVG的元素使用D3
- 通过提供第二个属性来更改一个属性
- jQuery Grid错误在第二个过滤器:Uncaught TypeError:不能读取属性'value'
- 如何改变第二个CSS属性&第6个DIV使用jquery