Как исправить ситуацию, когда при клике на параграф внутри элемента div не срабатывает событие onclick для самого div'а?
Для того, чтобы событие клика применялось только к элементу "div", вы можете использовать метод "stopPropagation" в обработчике события для элемента "p". Вот пример:
```javascript
document.querySelector('div').addEventListener('click', function() {
console.log('div clicked');
});
document.querySelector('p').addEventListener('click', function(event) {
event.stopPropagation();
});
```
Теперь, при клике на элемент "p", событие "click" для элемента "div" не будет срабатывать.
1. Чтобы сделать параграф невидимым для мышки, используйте следующий CSS-код:
```css
div p {
pointer-events: none;
}
```
2. Вы можете определить, по какому элементу был сделан клик, используя JavaScript:
```javascript
document.querySelector('div').addEventListener('click', e => {
console.log(e.currentTarget);
// Будет выведен div, даже если кликнули на внутренний элемент
});
document.querySelector('div').addEventListener('click', e => {
console.log(e.target.closest('div'));
// Будет найден div, внутри которого, или на нем самом кликнули
});
```
Получается так:
1. Чтобы сделать параграф невидимым для мышки, используйте следующий CSS-код: `div p { pointer-events: none; }`
2. Вы можете определить, по какому элементу был сделан клик, используя JavaScript:
- `console.log(e.currentTarget);` покажет div, даже если кликнули на внутренний элемент
- `console.log(e.target.closest('div'));` покажет найденный div, в котором или на котором был сделан клик