Javascript 引用不带'；不存在？

今天，我一直在寻找在点击时切换按钮文本的最佳方式，例如从“阅读更多”切换到“阅读更少”

我看到了这篇关于交换文本的CSS技巧的文章，在解构了每个方法之后，我有一个关于JavaScript数据属性行为的简单问题

考虑以下代码：

$（“按钮”）。在（“单击”，函数（）{
var el=$（本）；
如果（el.text（）==el.data（“文本交换”））{
el.文本（el.数据（“文本原件”）；
}否则{
el.data（“文本原件”，el.text（））；
el.文本（el.数据（“文本交换”））；
}
});

隐藏
这是因为
数据文本交换
和
数据文本原始
是不同的东西，
数据文本交换
是HTML5数据-*属性，而
数据文本原始
存储一些与元素相关的数据

基本上，它将
数据文本交换
值与元素的实际文本值进行比较，最初它们将不同，当您单击文本值时，文本值将更改为
数据文本交换
，将另一个值保存在
数据文本原始
上，依此类推

您可以在这里看到更多信息：vs
通常，JS在直接访问不存在的属性时不会出错

具体来说，您使用的是jQuery的全局数据缓存，它集成了HTML5
data-
属性，并且在数据不存在时也不会抱怨

无论哪种方式，这种技术都是不必要的，因为您不需要单独的存储来实现这一点，而现代浏览器使通过
dataset
属性获取数据属性变得特别容易

这个演示使用了
数据集
和解构赋值，使代码非常简洁


$（“按钮”）。在（“单击”，函数（）{
[this.dataset.textSwap，this.textContent]=[this.textContent，this.dataset.textSwap]；
});

隐藏
为什么要抛出错误<代码>el.data（“文本原件”，el.text（））
在else中创建数据属性
text original
。谢谢，这正是我需要的。我必须深入研究一下“去结构化赋值”在代码中是如何工作的，因为它不是我以前见过的东西！但我现在明白了，我发布的原始代码使用的是JQuery方法。不客气。解构赋值非常漂亮，但使用临时变量也可以得到同样的结果<代码>变量温度=this.textContent；this.textContent=this.dataset.textSwap；this.dataset.textSwap=temp谢谢！这对我来说很清楚。