получать первоклассный контент

Question

У меня есть несколько классов с именем, как можно получить контент первым классом.

like:
<div class="hi">
<div class="hey"><input name="hello1"></div> // this is 1
<div class="hey"><input name="hello2"></div> // this is 2
<div class="hey"><input name="hello3"></div> // this is 3
</div>

only getting: class number 1 // <input name="hello1">

как дела с jQuery?

Answer 1

Пример JSFiddle

// Pure JavaScript
var els = document.getElementsByClassName('hey');
els[0].innerHTML;

// jQuery
$(".hey:eq(0)").html();
$(".hey").eq(0).html();
$(".hey:first").html();
$(".hey").first().html();
$(".hey:first-child").html();

Примечание: В jQuery выбор по классу обычно является одним из самых медленных методов.Это быстрее выбирать по element.className (например, div.hey), но на самом деле, выбор по ID является самым быстрым (не "element # id", просто "#id").Надеюсь, это поможет

Answer 2

Если вы хотите html-содержимое первого div с классом 'hey', попробуйте это:

var firstChildContent = $('div.hey:first-child').html());

Answer 3

используйте селектор :first

$('.hey:first').html(); // this is shorter (but less performant)
$('.hey').filter(':first').html(); // this is more performant (based on jQuery documentation)

или используйте метод .first()

$('.hey').first().html();

или используйте .eq() для получения определенного индекса

$('.hey').eq(0).html(); // first element in the group using a 0-based index

Answer 4

Попробуйте это

$('div.hey:eq(0)').html();

Answer 5

Это довольно старый вопрос, но для тех, кто находит его в Google, как я: вы можете использовать document.querySelector , если вы не поддерживаете IE8 и ниже:

var el = document.querySelector('.hey');
el.innerHTML;

Или даже лучше, вы можете использовать его в родительском элементе:

// let's say that hi element has id instead of class
var parent = document.getElementById('hi'); 
var el = parent.querySelector('.hey');
el.innerHTML;

Это лучше, чем использование getElementsByClassName, потому что браузеру не нужно искать все классы в документе.Так должно быть и быстрее.

Answer 6

var hey = document.getElement('.hey');

Answer 7

$ ('. Hey: eq (0)'). Html ()

для доступа к привету 1

аналогично

$ ('. hey: eq (1)'). html ()

для доступа к приветам 2

и

$ ('.эй: eq (2) '). html ()

для доступа к привету 3