Как выбрать какие-то элементы?

Question

У меня есть два рода <textarea>:

1) Сообщения: id="textarea-post-{id}"

2) Комментарий: id="textarea-cmnt-{id}"

Например, здесь все textarea на странице:

<textarea id="textarea-post-1"></textarea> 
<textarea id="textarea-cmnt-1"></textarea> 
<textarea id="textarea-cmnt-2"></textarea> 
<textarea id="textarea-cmnt-3"></textarea> 
<textarea id="textarea-post-2"></textarea> 
<textarea id="textarea-cmnt-4"></textarea> 
<textarea id="textarea-cmnt-5"></textarea> 
<textarea id="textarea-post-3"></textarea> 
<textarea id="textarea-cmnt-6"></textarea> 

Ok ну, теперь я хочу знать, как я могу выбрать все post kind textarea? Это:

<textarea id="textarea-post-1"></textarea> 
<textarea id="textarea-post-2"></textarea> 
<textarea id="textarea-post-3"></textarea> 

Answer 1

Вы можете использовать селектор CSS с querySelectorAll как это:

document.querySelectorAll('[id^="textarea-post"]'); 

Оператор ^= будет выглядеть для каждого элемента с идентификатором, начиная с textarea-post.

JQuery версия:

$('[id^="textarea-post"]'); 

Answer 2

Это то, что вы ищете $('[id^="textarea-post-"]'). Начинается с селектора ^= - это правильный подход для вашего дела.

Answer 3

Его очень легко CSS с помощью [attribute $ = value] Selector будет делать трюк.

textarea[id$="post"]{ 
color:red 
} 
textarea[id$="cmnt"]{ 
color:blue 
} 

Answer 4

console.log($('textarea[id*=post]'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<textarea id="textarea-post-1"></textarea> 
 
<textarea id="textarea-cmnt-1"></textarea> 
 
<textarea id="textarea-cmnt-2"></textarea> 
 
<textarea id="textarea-cmnt-3"></textarea> 
 
<textarea id="textarea-post-2"></textarea> 
 
<textarea id="textarea-cmnt-4"></textarea> 
 
<textarea id="textarea-cmnt-5"></textarea> 
 
<textarea id="textarea-post-3"></textarea> 
 
<textarea id="textarea-cmnt-6"></textarea>

Answer 5

Это howw вы выбираете все текстовое поле с id значение, которое начинается с textarea-post-:

$("textarea[id^='textarea-post-']") 

Аналогично,

$("textarea[id^='textarea-cmnt-']") 

Рабочий пример:

console.log($("textarea[id^='textarea-post-']")); // outputs all textarea with `id` value starting with `textarea-post-`.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<textarea id="textarea-post-1"></textarea> 
 
<textarea id="textarea-cmnt-1"></textarea> 
 
<textarea id="textarea-cmnt-2"></textarea> 
 
<textarea id="textarea-cmnt-3"></textarea> 
 
<textarea id="textarea-post-2"></textarea> 
 
<textarea id="textarea-cmnt-4"></textarea> 
 
<textarea id="textarea-cmnt-5"></textarea> 
 
<textarea id="textarea-post-3"></textarea> 
 
<textarea id="textarea-cmnt-6"></textarea>

Answer 6

$('[id^="textarea-post-"]').each(function() { 
    $(this).val(); 
}); 

Это позволит получить все textarea-post- затем itterate через каждый из них и получить значение $(this).val();

Answer 7

Проверьте это.

$('textarea[id^="textarea-post"]').click(function(){ 
 
    $(this).css('background-color', 'green'); 
 
});

textarea[id^="textarea-post"]{ 
 
\t \t background-color:red; 
 
\t }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea id="textarea-post-1"></textarea> 
 
<textarea id="textarea-cmnt-1"></textarea> 
 
<textarea id="textarea-cmnt-2"></textarea> 
 
<textarea id="textarea-cmnt-3"></textarea> 
 
<textarea id="textarea-post-2"></textarea> 
 
<textarea id="textarea-cmnt-4"></textarea> 
 
<textarea id="textarea-cmnt-5"></textarea> 
 
<textarea id="textarea-post-3"></textarea> 
 
<textarea id="textarea-cmnt-6"></textarea>

Answer 8

вы можете использовать JQuery библиотеки, и использовать его функции Jquery library link here

$(‘p:nth-child(3)) \t gets the 3rd <p> element of the parent. n=even, odd too.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

Вместо р использования текстового поля