Как я могу добавить элементы класса, используя JavaScript

Question

Как я могу добавить элемент класса, используя JavaScript

<div class="col-md-4 col-xs-6 work-item web-design" id=SetCategory">
.
.
<script>
        document.getElementById("SetCategory").classList.add({{ $category->name }}' ');
</script>
.
.
</div> <!-- end work-item -->

На моем дисплее <script> не работают.

PS $category->name - это food, shop, travel, hotel, route, поскольку название категории вызывает различное отображение при нажатии кнопки

Answer 1

Это похоже на назначение колледжа / университета и не является целью переполнения стека, мы здесь не для того, чтобы помочь кому-либо обмануть, так как вы должны знать, что для получения помощи с этого сайта требуется Citation.

ваша проблема в этом,

document.getElementById("SetCategory").classList.add({{ $category->name }}' ')

Это недопустимый Javascript, даже недопустимый синтаксис C.

1) Пожалуйста, узнайте, как использовать инспектор веб-браузеров (вкладка «Консоль»), используя chrome, firefox, Edge и IE 11, нажмите F12, так как в выводе консоли вы увидите ошибку вдоль строк Uncaught SyntaxError: Unexpected token {.

2) Javascript в браузерах имеет удивительный ресурс документации, называемый MDN checkout: https://developer.mozilla.org/en-US/docs/Web/API/Element/classList особенно строка 9 первого примера кода на странице, этот пример кода для потомков:

const div = document.createElement('div');
div.className = 'foo';

// our starting state: <div class="foo"></div>
console.log(div.outerHTML);

// use the classList API to remove and add classes
div.classList.remove("foo");
div.classList.add("anotherclass");

// <div class="anotherclass"></div>
console.log(div.outerHTML);