如何获取ID和Name未定义的自定义属性的值? - JQuery

时间:2022-05-12 09:18:37

How to get value of Custom attribute of Markup element through JQuery, whose ID and Name is not defined.

如何通过JQuery获取Markup元素的Custom属性值,其ID和Name未定义。

<div questionId="Question_1.1"></div>

I tried following but getting undefined every time:

我试过跟随但每次都未定义:

$("input[questionId]").val();
$("#questionId").val();
$("input[questionId]").val();

On Page Load, i want to change opacity of this div.

在页面加载,我想改变这个div的不透明度。

2 个解决方案

#1


It isn't an <input>:

它不是:

$("div[questionId]").html();

If you want to get the attribute questionId's value, use attr:

如果要获取属性questionId的值,请使用attr:

$("div[questionId]").attr('questionId');

Just another thing to think about, but in HTML5, a custom attribute isn't valid unless it starts with data- such as data-questionid.

另外要考虑的是另一件事,但在HTML5中,自定义属性无效,除非它以数据开头,例如data-questionid。

The data attribute name must be at least one character long and must be prefixed with 'data-'. It should not contain any uppercase letters.

数据属性名称必须至少为一个字符长,并且必须以“data-”为前缀。它不应包含任何大写字母。

Source

JSFiddle Demo

EDIT: In response to your comment, use jQuery .each() if you have multiple divs:

编辑:在回复您的评论时,如果您有多个div,请使用jQuery .each():

$("div[questionId]").each(function(){
$(this).animate({'opacity':3},300);
});

JSFiddle Demo

#2


You can select the div using jQuery like this:

您可以使用jQuery选择div,如下所示:

var div = $('div[questionId="Question_1.1"]');

So, if the div questionId is being entered in a text input, you can grab the input value and select the appropriate div like this:

因此,如果在文本输入中输入div questionId,您可以获取输入值并选择适当的div,如下所示:

// get the input value:
var id = $('input').val();

var div = $('div[questionId="' + id + '"]');

// jQuery's "fade" function fadeTo()
div.fadeTo("slow", 0.5);
div{
    height: 100px;
    width: 100px;
    background-color: steelblue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" value="Question_1.1" />
<div questionId="Question_1.1">Question 1.1</div>

#1


It isn't an <input>:

它不是:

$("div[questionId]").html();

If you want to get the attribute questionId's value, use attr:

如果要获取属性questionId的值,请使用attr:

$("div[questionId]").attr('questionId');

Just another thing to think about, but in HTML5, a custom attribute isn't valid unless it starts with data- such as data-questionid.

另外要考虑的是另一件事,但在HTML5中,自定义属性无效,除非它以数据开头,例如data-questionid。

The data attribute name must be at least one character long and must be prefixed with 'data-'. It should not contain any uppercase letters.

数据属性名称必须至少为一个字符长,并且必须以“data-”为前缀。它不应包含任何大写字母。

Source

JSFiddle Demo

EDIT: In response to your comment, use jQuery .each() if you have multiple divs:

编辑:在回复您的评论时,如果您有多个div,请使用jQuery .each():

$("div[questionId]").each(function(){
$(this).animate({'opacity':3},300);
});

JSFiddle Demo

#2


You can select the div using jQuery like this:

您可以使用jQuery选择div,如下所示:

var div = $('div[questionId="Question_1.1"]');

So, if the div questionId is being entered in a text input, you can grab the input value and select the appropriate div like this:

因此,如果在文本输入中输入div questionId,您可以获取输入值并选择适当的div,如下所示:

// get the input value:
var id = $('input').val();

var div = $('div[questionId="' + id + '"]');

// jQuery's "fade" function fadeTo()
div.fadeTo("slow", 0.5);
div{
    height: 100px;
    width: 100px;
    background-color: steelblue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" value="Question_1.1" />
<div questionId="Question_1.1">Question 1.1</div>