如何动态设置HTML元素的标题属性？

Question

我有一组不同的HTML元素，例如“文本，单选，复选框和数字等”。 ＆我想为所有HTML字段动态设置title属性，是否可以在页面加载时进行设置。

以及从相应HTML字段ID复制的所有标题值。

谢谢

Answer 1

对的，这是可能的。 在页面加载时，只需将其设置为：

 document.getElementById('YOURID').setAttribute('title', 'NEW TITLE');

编辑：根据评论，我得到了您想要将所有元素的标题设置为它们的ID的信息。 假设您只想在body标签内执行此操作，那么您的代码将如下所示：

var children = document.getElementsByTagName("body").getElementsByTagName('*');
//Now children variable has all DOM elements inside `body`
 for (i = 0; i < children.length; ++i) {
 var ele = children[i];
 ele.setAttribute('title',ele.getAttribute("id"));
}

您可能想在分配任何值之前进行一些检查，或者防止控制台错误。

Answer 2

是的，您可以动态设置HTML元素的title属性。

例如，如果您的表单输入之一的ID为“ foo”，则可以使用以下示例进行设置。 由于您想在文档准备好后执行此操作，因此可以使用jQuery $（document）.ready（）。

$(document).ready(function() {
    var newTitle= document.getElementById("foo").type;
    document.getElementById("foo").title = newTitle;

    // Alternatively,
    var newTitle = document.getElementById("foo").type;
    document.getElementById("foo").setAttribute("title", newTitle);
});

Answer 3

您可以使用以下解决方案：

document.getElementsByTagName("H1")[0].setAttribute("class", "democlass"); //Using Tag
document.querySelector(".class").setAttribute("class", "democlass"); //Using Query Selector
 document.getElementById('YOURID').setAttribute('title', 'NEW TITLE');

使用jQuery

$("#id").attr("kin","kin");

setAttribute（）方法将指定的属性添加到元素并为其指定值。

如果指定的属性已经存在，则仅设置/更改该值。

注意：尽管可以使用此方法将带值的style属性添加到元素，但是建议您使用Style对象的属性代替内联样式，因为这不会覆盖在CSS中可能指定的其他CSS属性。样式属性：