span
один раз при запуске скрипта и туда попадает первый span
первого div
.div.addEventListener('click', function(e) {
let span = this.querySelector('span');
set.add(this.textContent);
let arr = [...set];
el1.textContent = arr.join(', ');
sum += +span.textContent;
console.log(span.textContent);
el2.textContent = sum;
})
как сделать так что бы в одном html элементе был 2 класса например обычно className={isActive ? "page : ""page active"} можно добавить дополнительный класс а как сделать на .module ?
import styles from 'Button.module.css';
import cx from 'classnames';
<button className={cx(styles.button, styles.disabled)}>Button</button>
Function.prototype.bind = function bind(ctx, ...args) {
const originalFunction = this;
return function (...args2) {
return originalFunction.apply(ctx, args.concat(args2));
};
}
Как видите, возвращаемая функция уже никак не использует свой this.let a = 3;
let b = 15;
let one = {};
one.a = a;
one.b = b;
a = 42;
console.log(one.a, one.b); // 3, 15
console.log(a, b); // 42, 15
let a = 3;
let b = 15;
let two = new Map();
two.set('a', a);
two.set('b', b);
a = 42;
console.log(two.get('a'), two.get('b')); // 3, 15
console.log(a, b); // 42, 15
import autoAnimate from '@formkit/auto-animate'
white-space
со значениями pre
или pre-wrap
.<Route exact path='/contacts' Component={Contacts} />
// Component={Contacts} ???
import React from 'react';
import {BrowserRouter as Router, Routes, Route, Link} from 'react-router-dom';
import './App.scss';
import Header from './components/Header';
import Service from './pages/Service';
import Contacts from './pages/Contacts';
import Login from './pages/Login';
import Home from './pages/Home';
function App() {
return (
<Router>
<div className="App">
<Header />
<nav>
<Link to="/">Главная</Link>
<Link to="/service">Услуги</Link>
<Link to="/contacts">Контакты</Link>
<Link to="/login">Вход</Link>
</nav>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/service" element={<Service />} />
<Route path="/contacts" element={<Contacts />} />
<Route path="/login" element={<Login />} />
<Route path="*" element={<NotFoundRoute/>} />
</Routes>
</div>
</Router>
);
}
// not fount route handler
function NotFoundRoute() {
return <div>Page not found</div>;
}
export default App;
import {Link} from "react-router-dom";
function Header(props) {
return (
<>
<header>
// ...
<Link to="/service">Услуги</Link>
<Link to="/contacts">Контакты</Link>
// ...
</header>
</>
)
}
export default Header;
node_modules
, они устанавливаются на основе файла проекта package.json (инициализация)..pic {
display: inline-block;
}
.pic img {
opacity: 1;
transition: opacity 1s linear;
}
.pic img.invisible {
opacity: 0;
}
button {
padding: 1em;
}
button.active {
background: tomato;
}
document.body.addEventListener('click', e => {
if (!e.target.matches('button')) return
const img = document.querySelector('.pic img')
img.classList.add('invisible')
img.ontransitionend = () => {
img.onload = () => img.classList.remove('invisible')
img.src = e.target.dataset.src
document.querySelectorAll('button').forEach(btn => btn.classList.remove('active'))
e.target.classList.add('active')
}
})
$(".box43z6r6QZ").click(function(){
var $el = $(this);
$el.addClass("hG8KlY3Q");
setTimeout(function(){
$el.removeClass("hG8KlY3Q");
}, 1000);
});
Пытаюсь через document.querySelectorAll но тоже выходит ошибка
<script>
// Получаем все карточки товаров
const cards = document.querySelectorAll('.cart');
cards.forEach((card) => {
const addToCartLink = card.querySelector('.buy_button');
const inputElement = card.querySelector('.kolvo input');
const plusButton = card.querySelector('.kolvo .plus');
const minusButton = card.querySelector('.kolvo .minus');
// Функция для обновления ссылки при изменении значения input
const updateLink = () => {
const inputValue = inputElement.value;
const newLink = addToCartLink.getAttribute('href').replace(/q=\d+/, 'q=' + inputValue);
addToCartLink.setAttribute('href', newLink);
};
// plus
plusButton.addEventListener('click', () => {
inputElement.stepUp();
updateLink();
});
// minus
minusButton.addEventListener('click', () => {
inputElement.stepDown();
updateLink();
});
// Обработчик события при изменении значения input
inputElement.addEventListener('input', () => {
updateLink();
});
});
</script>
<div class="cart">
<a class="buy_button" href="/addtocart.php?id=387&q=1" rel="nofollow">Добавить в корзину</a>
<div class="kolvo">
<span class="minus">-</span>
<input type="number" value="1" min="1">
<span class="plus">+</span>
</div></div>
(function() {
function func(arg) {
console.log(arg, this);
}
let arg = 1;
const f1 = () => func(arg);
const f2 = func.bind(this, arg);
arg = 2;
f1();
f2();
}).call('hello, world!!');