如何解决如何使用javascript根据innerHTML设置元素ID
我想为动态内容中的所有标题标签添加 id。 id 应基于同一元素的内文(这是为特定部分创建链接)。
例如:
如果标题标签有<h1 class="title_tag">Key Programming Language</h1>
,
输出应该是 <h1 id="key-programming-language" class="title_tag">Key Programming Language</h1>
我不确定如何将innerHTML 值放入id。请使用任何 javascript(或)jquery(或)PHP 向我建议解决方案
解决方法
const convertToKebabCase = (string) => {
return string.replace(/\s+/g,'-').toLowerCase();
}
const h1 = document.querySelectorAll("h1");
h1.forEach(el=>{
const kebabCaseText = convertToKebabCase(el.innerText);
el.id = kebabCaseText;
})
<h1 class="title_tag">Key Programming Language</h1>
这就是你想要做的?
$("h1").each(function(){
var newId = $(this).text().replace(" ","-");
//console.log(newId);
$(this).attr('id',newId);
});
,
或纯 Javascript:
var elements = document.getElementsByTagName("1");
for (i = 0; i < elements.length; i++) {
elemelements[i].id = elements[i].innerHTML;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。