如何改变一个元素's标题属性使用jQuery

在编写任何代码之前，让我们先讨论一下属性和属性之间的区别。属性是应用于HTML标记中的元素的设置;然后浏览器解析标记并创建各种类型的DOM对象，其中包含用属性值初始化的属性。在DOM对象上，例如简单的HTMLElement，你几乎总是想使用它的属性，而不是它的属性集合。

当前的最佳实践是避免使用属性，除非它们是自定义的，或者没有等效的属性来补充。由于title在许多__abc1上确实作为读/写财产存在，所以我们应该利用它。

你可以阅读更多关于属性和属性在这里或在这里之间的区别。

考虑到这一点，让我们来操作title…

获取或设置元素的title属性没有 jQuery

由于title是一个公共属性，你可以在任何支持它的DOM元素上设置它:

document.getElementById('yourElementId').title = 'your new title';

检索几乎是一样的;这里没什么特别的:

var elementTitle = document.getElementById('yourElementId').title;

这将是改变标题的最快方式，如果你是一个优化坚果，但因为你想要jQuery参与:

使用jQuery (v1.6+)获取或设置元素的title 财产

jQuery在v1.6中引入了一个新的方法来获取和设置属性。要在元素上设置title属性，使用:

$('#yourElementId').prop('title', 'your new title');

如果你想检索标题，省略第二个参数并捕获返回值:

var elementTitle = $('#yourElementId').prop('title');

查看jQuery的prop() API文档。

如果你真的不想使用属性，或者你正在使用v1.6之前的jQuery版本，那么你应该继续阅读:

使用jQuery获取或设置一个元素的title 属性

你可以用下面的代码改变title 属性:

$('#yourElementId').attr('title', 'your new title');

或者用:

var elementTitle = $('#yourElementId').attr('title');

查看jQuery的attr() API文档。

我相信

$("#myElement").attr("title", "new title value")

或

$("#myElement").prop("title", "new title value")

应该能行…

我认为你可以在jQuery文档中找到所有的核心函数，尽管我讨厌格式化。

另一种选择，如果你喜欢，将从jQuery对象中获取DOM元素，并使用标准DOM访问器:

$("#myElement")[0].title = "new title value";

正如其他人提到的，“jQuery方式”是使用attr()方法。请参阅attr() 在这里的API文档。

在jquery ui模态对话框中，你需要使用这个结构:

$( "#my_dialog" ).dialog( "option", "title", "my new title" );

jqueryTitle({
title: 'New Title'
});

第一个标题:

jqueryTitle('destroy');

https://github.com/ertaserdi/jQuery-Title

如果你正在创建一个div，并试图添加一个title到它。

试一试

var myDiv= document.createElement("div");
myDiv.setAttribute('title','mytitle');

作为@Cᴏʀʏanswer的补充，请确保工具提示的标题尚未在HTML元素中手动设置。在我的例子中，工具提示的span类已经有一个固定的标题文本，因此我的JQuery函数$('[data-toggle="tooltip"]').prop('title', 'your new title');不起作用。

当我在HTML span类中删除title属性时，jQuery正在工作。

所以:

<span class="showTooltip" data-target="#showTooltip" data-id="showTooltip">
<span id="MyTooltip" class="fas fa-info-circle" data-toggle="tooltip" data-placement="top" title="this is my pre-set title text"></span>
</span>

应该becode:

<span class="showTooltip" data-target="#showTooltip" data-id="showTooltip">
<span id="MyTooltip" class="fas fa-info-circle" data-toggle="tooltip" data-placement="top"></span>
</span>