gpt4 book ai didi

javascript - 使用 JavaScript 为元素分配 ID

转载 作者:行者123 更新时间:2023-12-02 16:36:06 25 4
gpt4 key购买 nike

我想为 HTML 文件中的段落分配唯一的 ID。
我如何在 JavaScript 中使用循环来做到这一点?(假设我知道其中的段落数)

<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
function count() {
var num = $("p").size();
for (var i = 0; i < num; i++) {
$ "p".innerhtml();
$id = i;
I dont know
if this is right.is this how we assign ids ?
}
}
</script>
</head>

<body>
<h1>Count paragraphs</h1>
<div>
<p>This is paragraph 1.</p>
<p>This is paragraph 2.</p>
<p>This is paragraph 3.</p>
<p>This is paragraph 4.</p>
</div>
<form action="">
<input type="button" value="count" onclick="count()"></input>
</form>
</body>

最佳答案

jsBin demo

JavaScript

var elP = document.querySelectorAll("p");  
[].slice.call(elP).forEach(function(el, v) {
el.id = el.id || "p"+v; // or use `el.id = "p"+v;` to overwrite
});

jQuery

$("p").prop("id", function(idx, currID) {
return currID || "p"+idx; // or use `return "p"+idx;` to overwrite
});

上面使用idx, currID .prop() 的(索引,值)参数方法回调
它会分配一个 ID pN (N 从 0 开始)到您所有的 <p>而不覆盖现有的 ID。

之前:

<p></p>
<p></p>
<p id="foo"></p>
<p></p>

之后:

<p id="p0"></p>
<p id="p1"></p>
<p id="foo"></p>
<p id="p3"></p>

附:</input>是非法的结束标签。 ( See: Void elements )

关于javascript - 使用 JavaScript 为元素分配 ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27914671/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com