Код Javascript, который функционировал как * (или оператор LIKE в MYSQL) в функции onclick

Есть ли какой-либо код в Javascript, похожий на оператор * или LIKE в MYSQL для следующей цели.

onclick="toggle_visibility('row1*');"

Я пытаюсь создать древовидную таблицу с динамическими данными из базы данных.

В этом случае мне нужно одновременно переключать любые строки с class=row11, class=row12, class=row13 и class=row14, щелкнув строку с class=row1.

Затем, когда я щелкаю любую строку из строки 11, снова одновременно переключаются строки с классом = строка 111, строка 112, строка 113 и т. д. Итак, для этого уровня это выглядит так:

onclick="toggle_visibility('row11*');"

Нужна ваша помощь, пожалуйста. Спасибо.


javascript treetable
person anesbbs    schedule 16.04.2015    source источник
comment
в идеале вы могли бы просто сделать это с классом.   -  person epascarello    schedule 16.04.2015
comment
Существуют селекторы атрибутов. В этом случае селектор будет выглядеть как [class^=row1] или [class^=row11]. Конечно, это усложняется тем фактом, что у вас может быть более одного класса, который может работать, например, с [class*=row1], если только у вас нет чего-то вроде class='row11 striped-row1', где вы также будете соответствовать последнему, возможно, там, где вы этого не хотите.   -  person Jared Farrish    schedule 16.04.2015
comment
@ Джаред, будет ли это работать, если дерево будет динамически зависеть от данных? Теперь только до class=row14, в будущем будет class=row15 по мере добавления дополнительных данных. Это также происходит для следующих уровней, где будет добавлено больше данных, class=row114, class=row115 и т. д.   -  person anesbbs    schedule 16.04.2015
comment
Если вы запрашиваете DOM (используя document.querySelector() или document.querySelectorAll(), в данный момент вы переходите к элементам в DOM.   -  person Jared Farrish    schedule 16.04.2015

Ответы (1)


arrow_upward
2
arrow_downward

Вы можете либо установить общий класс для элементов и использовать getElementsByClassName, либо вы можете использовать querySelector и начать с селектора.

Начинается с селектора

var x = document.querySelectorAll('[id^="row1"]')
for(var i=0; i<x.length; i++) {
    x[i].classList.add("selected");  
}
.selected { color: #00CC00; }
<div id="row11">11</div>
<div id="row12">12</div>
<div id="row13">13</div>
<div id="row21">21</div>
<div id="row22">22</div>
<div id="row23">23</div>

person epascarello    schedule 16.04.2015
comment
Он уже использует классы. Я предполагаю, что это потому, что на странице может быть более одного дерева. - person Jared Farrish; 16.04.2015