使用jquery添加属性

我正在尝试向元素添加属性。基本上，我希望jquery代码将其更改为：

<p class = "slider-price">X</a>

为此：

<p class = "slider-price" data-position = "[point-of-center-position(x)], [point-of-center-position(y)]">X</p>

下面是我尝试在标签上方添加的内容的演示：

---

我想说的是，通常我应该自己添加属性'data position=100100'，我使用的是FractionSlider，所以这会将元素定位在滑块内。但是我希望元素居中，因此我认为使用jquery获得位置会有所帮助。

$this.parent抛出一个错误：this.parent不是函数。您应该使用$this.parent作为jQuery选择器。

如何将代码分解成一些帮助程序

var ypos = function(el) {
   var $el = $(el)
   var h = ($el.parent().height() - $el.outerHeight())/2;
   var offset = $el.parent().scrollTop();
   return h + offset;
}
var xpos = function(el) {
   var $el = $(el)
   var w = ($el.parent().width() - $el.outerWidth())/2;
   var offset = $el.parent().scrollLeft();
   return w + offset;
}

var $slider = $('.slider-price');

console.log(xpos($slider));
console.log(ypos($slider));

var x = xpos($slider);
var y = ypos($slider);
$slider.data('position', {x:x, y:y});

// or
$slider.data('position', x + ', ' + y);

---

您的代码片段中存在一些问题

您没有加载jQuery库，因此无法选择DOM元素，例如p.slider-price，比如$p.slider-price。要解决这个问题，您应该在fiddle中加载jQuery库，您可以从frameworks&extensions菜单中选择它。 然后，使用jQuery可以更改属性，例如： $p.slider-price.attr'data-position'，2

您在尝试计算attrbt时遇到一些问题，主要是因为您应该首先了解这和parent的含义。 在您的例子中，假设parent是p元素的父DOM元素，但javascript或jQuery不理解这一点。 因此，首先选择和/或保存p元素，这样就可以得到它的父元素，也可以计算不同的值。 结合我解释的所有内容，您将得到这把小提琴，它能满足您的期望：

---

这些值来自何处；不要只是向我们展示你失败/损坏的代码，解释它应该做什么。当然，不要只是在JS Fiddle上隐藏坏代码，把它发布在这里；我们很乐意提供帮助，但让我们更难提供帮助并不能帮助你自己。我希望属性有两个值，如果放在屏幕中央，它们将指示元素的位置，比如数据位置=100100。对不起，如果我解释得不好，我是初学者！我试图基于以下代码编写代码：，但是我希望它向添加一个属性，而不是将其居中。这是什么？在问题中显示代码这两行是我试图制作的全部代码。脚本代码中没有删节。代码并不是完全从某个地方复制的，它只是我的一个尝试，我知道这是不好的。不过，我添加了我的尝试，以便您能够更好地理解我想要做什么。当然，使用了比neededSweet更多的$calls！值正确记录在控制台中，但保持不变。下面是它的样子：

$50000

@Radu不要将在live html中看到的内容与设置数据“位置”混淆，因为它在htmlOk中不可见，很抱歉，很高兴知道！我想说的是，通常我应该自己添加属性'data position=100100'，我使用的是FractionSlider，所以这会将元素定位在滑块内。但是我希望元素居中，所以我认为使用jquery获得中心位置会有所帮助。@charlietfl-我稍微整理了一下。我主要是想告诉大家，如果你把复杂的东西分解成助手，阅读起来会更容易，也更容易看出哪些东西不起作用。但你是对的，你可以更有效地打电话给$。。。。编辑后的代码应该更好一点。工作起来很有魅力。谢谢！

var ypos = function(el) {
   var $el = $(el)
   var h = ($el.parent().height() - $el.outerHeight())/2;
   var offset = $el.parent().scrollTop();
   return h + offset;
}
var xpos = function(el) {
   var $el = $(el)
   var w = ($el.parent().width() - $el.outerWidth())/2;
   var offset = $el.parent().scrollLeft();
   return w + offset;
}

var $slider = $('.slider-price');

console.log(xpos($slider));
console.log(ypos($slider));

var x = xpos($slider);
var y = ypos($slider);
$slider.data('position', {x:x, y:y});

// or
$slider.data('position', x + ', ' + y);