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

时间:2018-07-17 05:32:10

标签: javascript html

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

,以及从相应的HTML归档ID复制的所有标题值。

谢谢

3 个答案:

答案 0 :(得分:3)

是的,有可能。 在页面加载时,只需将其设置为:

 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"));
}

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

答案 1 :(得分:0)

是的,您可以动态设置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);
});

答案 2 :(得分:0)

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

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属性。在样式属性中指定: