<input>의 속성 이름 값 가져 오기

jQuery를 사용하여 입력 태그의 속성 이름 값을 얻는 방법 도와주세요.

<input name='xxxxx' value=1>

입력 한 ID를 입력하고 attr방법을 사용하십시오 .

var name = $("#id").attr("name");

다음 attr과 같이 jQuery 의 메소드를 사용하십시오 .

alert($('input').attr('name'));

attr두 번째 인수를 지정하여 속성 값을 설정하는 데 사용할 수도 있습니다 .

$('input').attr('name', 'new_name')

var value_input = $("input[name*='xxxx']").val();

jQuery가 강력한 도구라는 것을 부정하지는 않지만 "요소의 속성 값 얻기"와 같은 사소한 작업에 사용하는 것은 좋지 않습니다.

현재 승인 된 답변으로 판단하면 요소에 ID 속성을 추가 하고이 속성을 사용하여 선택할 수 있다고 가정합니다.

이를 염두에두고 두 가지 코드가 있습니다. 먼저 수락 된 답변에 제공된 코드 :

$("#ID").attr("name");

둘째, 바닐라 JS 버전 :

document.getElementById('ID').getAttribute("name");

내 결과 :

• jQuery : 300k 작업 / 초
• 자바 스크립트 : 11,000k 작업 / 초

여기서 스스로 테스트 할 수 있습니다 . "일반 JavaScript" 버전은 jQuery 버전보다 35 배 이상 빠릅니다 .

이제는 한 번의 작업으로, 시간이 지남에 따라 코드에서 점점 더 많은 작업이 진행됩니다. 특히 고급 기능의 경우 최적의 "순수 JavaScript"솔루션을 실행하는 데 1 초가 걸립니다. jQuery 버전은 30 초에서 1 분이 소요될 수 있습니다! 대단하다! 사람들은 그것을 위해 앉아 있지 않을 것입니다. 브라우저조차 지루 해져 너무 오래 걸리는 웹 페이지를 죽일 수있는 옵션을 제공합니다!

내가 말했듯이 jQuery는 강력한 도구이지만 모든 것에 대한 대답 으로 간주 해서는 안됩니다 .

올바른 것을 <input>먼저 선택하는 선택기를 작성해야합니다 . 이상적으로는 요소의 ID를 사용하지만 $('#element_id')컨테이너의 ID $('#container_id input')또는 요소의 클래스는 실패합니다 $('input.class_name').

요소에는 이러한 요소와 컨텍스트가 없으므로 요소를 선택하는 방법을 말하기가 어렵습니다.

적절한 선택기를 알아 낸 후에는 attr 메소드를 사용하여 요소의 속성에 액세스합니다. 이름을 얻으려면 $(selector).attr('name')(예제에서)를 반환하는을 사용 합니다 'xxxxx'.

더 나은 방법은 'this'를 사용하는 것입니다 .'id '의 이름이 무엇이든간에 그것을 사용합니다. 'mytarget'이라는 클래스 이름을 추가하는 한.

대상이있는 필드가 변경 될 때마다 해당 필드의 이름이 포함 된 경고 상자가 표시됩니다. 전체 스크립트를 잘라내어 붙여 넣으십시오!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('.mytarget').change(function() {
var name1 = $(this).attr("name");
alert(name1);
 });
});
</script>

Name: <input type="text" name="myname" id="myname" class="mytarget"><br />
Age: <input type="text" name="myage" id="myage" class="mytarget"><br />

var theName;

theName = $("input selector goes here").attr("name");

값을 사용하여 입력 이름 얻기

 $('input[value="1"]').attr('name');

id get 입력 이름 사용

 $('input[class="id"]').attr('name');
   $('#id').attr('name');

클래스 get 입력 이름 사용

 $('input[value="classname"]').attr('name');
   $('.classname').attr('name');  //if classname have unique value

단일 요소를 다루는 경우 idGenericTypeTea 답변에 명시된 선택기를 사용 하고 이름을 가져와야합니다 $("#id").attr("name");.

그러나 원하는 경우이 질문을 찾은 것처럼 특정 클래스의 모든 입력 이름 이있는 목록 (예에서는 .selectable-checkbox클래스 가있는 모든 확인란의 이름이있는 목록 )을 다음과 같이 할 수 있습니다.

var listOfUnchecked = $('.selectable-checkbox:unchecked').toArray().map(x=>x.name);

또는

var listOfUnchecked = [];
$('.selectable-checkbox:unchecked').each(function () {
    listOfUnchecked.push($(this).attr('name'));
});

입력 태그에 클래스를 전달하고 클래스를 사용하여 이름 값에 액세스하십시오.

<input class="test-class" name='xxxxx' value=1>

<script>
    $('.test-class').attr('name');
</script>

또는 id를 사용하여 값에 액세스 할 수도 있습니다.

<input id="test-id" name='xxxxx' value=1>

<script>
    $('#test-id').attr('name');
</script>

아래 줄의 경우 'currnetRowAppName'값이 문자열로 공간을 차지하지 않는 단일 코드를 제공하지 못하는 문제가 처음에 발생했습니다. 따라서 단일 코드를 제공 한 후에도 '"+row.applicationName+"'공간을 차지합니다.

예:

<button class='btn btn-primary btn-xs appDelete' type='button' currnetRowAppName='"+row.applicationName+"' id="+row.id+ >

var viewAppNAME = $(this).attr("currnetRowAppName");
alert(viewAppNAME)

이것은 잘 작동합니다.