Вход

Просмотр полной версии : Открыть все спойлеры на странице


Capoeirista
09.04.2018, 01:59
Может ли кто-нибудь написать скрипт (или помочь это сделать) для открытия всех спойлеров на странице по горячей клавише/ам или по кнопке (создаваемой скриптом рядом с первым, к примеру)?

j0hnik
09.04.2018, 02:00
страницу угадать надо?

Nexus
09.04.2018, 10:07
var spoilers = [].slice.call(document.querySelectorAll('SPOILERS-SELECTOR'));
if (!spoilers.length)
return;

var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Button';
btn.addEventListener('click', function() {
spoilers.forEach(function(node) {
node.dispatchEvent(new Event('click'));
});
});

spoilers[0].parentNode.inserBefore(btn, spoilers[0]);

рони
09.04.2018, 10:13
Nexus,
строка 10 кавычка!!!

Nexus
09.04.2018, 10:34
рони, спасибо :)

Capoeirista
09.04.2018, 18:43
страницу угадать надо?
Не понял?
Если имелось ввиду для какого сайта, то NNM-Club

Nexus,
Я правильно понимаю, что вместо SPOILERS-SELECTOR нужно вставить нужный в моём случае css-класс, то бишь
https://i.imgur.com/MPIID0I.png

и я его задействовал посредством расширения для браузера - Tampermonkey таким образом

// ==UserScript==
// @name New Userscript
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match https://nnm-club.me
// @grant none
// ==/UserScript==

(function() {
'use strict';
var spoilers = [].slice.call(document.querySelectorAll('spoiler-wrap'));
if (!spoilers.length)
return;

var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Button';
btn.addEventListener('click', function() {
spoilers.forEach(function(node) {
node.dispatchEvent(new Event('click'));
});
});
spoilers[0].parentNode.inserBefore(btn, spoilers[0]);
})();


Если правильно, то ничего не получается. Создаваемой js-ом кнопки нет или по-крайней мере я её не вижу, а при нажатии на спойлер - открывается только один.

рони
09.04.2018, 18:49
Capoeirista,
13 строка, точка где?

Capoeirista
09.04.2018, 19:19
Capoeirista,
13 строка, точка где?

Ну да, чего это я ...
Добавил точку к классу, но результат нулевой.

Nexus
09.04.2018, 19:23
Capoeirista, строку 22 на это замените:
node.querySelector('.clickable').dispatchEvent(new Event('click'));

рони
09.04.2018, 19:23
Capoeirista,
кнопка появилась?

рони
09.04.2018, 19:25
Nexus,
может класс hide убрать, вместо клика?

j0hnik
09.04.2018, 19:29
Nexus,
может класс hide убрать, вместо клика? :Хлопаю в ладоши:

Nexus
09.04.2018, 19:29
рони, клик по ".clickable" открывает спойлер, проверил.

Nexus
09.04.2018, 19:30
И строку 7 нужно заменить на это:
// @match https://nnm-club.me*

Capoeirista
09.04.2018, 19:31
кнопка появилась?
Не знаю где она должна появится, но возле спойлеров нет и так пытался найти на странице, не нашёл.

Capoeirista
09.04.2018, 19:36
И строку 7 нужно заменить на это:
Поменял. В меню расширения данный скрипт значится, как задействованный на странице.

Nexus
09.04.2018, 19:42
В название метода "insertBefore" буковки "t" не хватало :)
// ==UserScript==
// @name New Userscript
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match https://nnm-club.me*
// @grant none
// ==/UserScript==

(function(){
var spoilers = [].slice.call(document.querySelectorAll('.spoiler-wrap'));
if (!spoilers.length)
return;

var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Button';
btn.addEventListener('click', function() {
spoilers.forEach(function(node) {
node.querySelector('.clickable').dispatchEvent(new Event('click'));
});
});

spoilers[0].parentNode.insertBefore(btn, spoilers[0]);
})();

Capoeirista
09.04.2018, 19:55
В название метода "insertBefore" буковки "t" не хватало
А я тоже скрипт читал, думаю вроде по логике должно быть insert :)

ПС. В общем проблема была в match, кнопка появилась, но всё равно ни фига не работает. Нажимаю и ничего не происходит.
// ==UserScript==
// @name NNM Spoilers
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match *://*/*
// @grant none
// ==/UserScript==

(function() {
'use strict';
var spoilers = [].slice.call(document.querySelectorAll('.spoiler-wrap'));
if (!spoilers.length)
return;

var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Button';
btn.addEventListener('click', function() {
spoilers.forEach(function(node) {
node.dispatchEvent(new Event('click'));
});
});
spoilers[0].parentNode.insertBefore(btn, spoilers[0]);
})();

Nexus
09.04.2018, 20:11
Capoeirista, найдите отличия в своем коде и в том, что я в посте 17 выложил.

Capoeirista
09.04.2018, 20:26
найдите отличия в своем коде и в том, что я в посте 17 выложил
Неприметный спойлер (не заметил :) ).

ПС. В общем с совпадением по домену что-то не захотело, прописал общую маску и ...
БлагоДарю, Волшебник :)

Не против, если опубликую на OpenUserJS и Greasy Fork?

Как вставить перенос строки перед кнопкой? Это уже косметика, но всё же ...

Nexus
09.04.2018, 20:44
Capoeirista, не против, вряд ли он кому-то пригодится.

Capoeirista
10.04.2018, 00:06
не против, вряд ли он кому-то пригодится.
Пригодится. Только не большинству.

ПС. Как добавить новый абзац перед кнопкой?
JQuery ещё хоть немного учил, а JS как-то хотел, но некогда.
Хотел сам добавить, но что-то не получилось.

https://i.imgur.com/CC1rk6o.png
https://i.imgur.com/uaMNduL.png

j0hnik
10.04.2018, 00:15
spoilers[0].insertAdjacentHTML('beforebegin', '<br>');

Capoeirista
10.04.2018, 12:38
j0hnik,
БлагоДарю

Capoeirista
26.09.2018, 23:53
j0hnik,
можешь ещё помочь немного - не сильно напрягает, но ...
Если под спойлером находится картинка, то через твой скрипт если открывать, то она не отображается и место под неё тоже. просто слегка открылся и там пусто. Если вручную переоткрыть, то нормально.

И если не сильно сложно, то можно ли исключить два постоянных спойлера?
https://farm2.staticflickr.com/1902/44946921151_b8bb3d4094_t.jpg (https://farm2.staticflickr.com/1902/44946921151_3d824349b0_o.png)

Разметка у них такая
https://farm2.staticflickr.com/1980/44898071812_6136438627_t.jpg (https://farm2.staticflickr.com/1980/44898071812_8c2da729a4_o.png) https://farm2.staticflickr.com/1971/43134214330_8a8d8f9fbd_t.jpg (https://farm2.staticflickr.com/1971/43134214330_87948b6b55_o.png)

Nexus
19.01.2020, 16:38
Добрый день.
Наткнулся в интернете на форум, где Вы помогли написать скрипт на открытие всех спойлеров на странице.
Открыть все спойлеры на странице (https://javascript.ru/forum/css-html-firefox-mizilla/73352-otkryt-vse-spojjlery-na-stranice-3.html).
Скачал его NNM-Club Open Spoilers (https://greasyfork.org/ru/scripts/40473-nnm-club-open-spoilers) с Greasy Fork. Работает на большинстве сайтов, но открывает только самый первый спойлер, и не открывает, спойлеры внутри спойлера. Напрример с той страницы
пример с несколькими спойерами (https://rutracker.org/forum/viewtopic.php?t=3799279)
https://cdn1.radikalno.ru/uploads/2020/1/19/4e3148efc98cdf1214f2abdf5e42e3fe-full.jpg
Не могли бы Вы подсказать как надо модифицировать, чтобы открывалось все.
Спасибо.

Можно так попробовать:
// ==UserScript==
// @name NNM-Club Open Spoilers
// @description Создаёт кнопку над первым спойлером, при нажатии на которую открываются все спойлеры на странице NNM-Club. Можно (не проверял, но по логике должно) переделать для другого сайта. Для этого нужно вместо (или добавить через запятую) CSS-класса .spoiler-wrap вставить селектор спойлера с нужного сайта. Добавлено для USBTor.Ru Новое в 0.4: Исключены от открытия скриптом спойлеры - "Список файлов в торренте" и "Похожие темы"
// @license MIT
// @icon http://nnmclub.to/favicon.ico
// @namespace http://tampermonkey.net/
// @version 0.4
// @author Nexus с сайта JavaScript.Ru
// @match *://*/*
// @grant none
// ==/UserScript==

(function() {
var spoilers = document.querySelectorAll('div.postbody .spoiler-wrap, .sp-wrap');
if (!spoilers.length) {
return;
}

var CLOSED_SPOILER_LABEL = 'Открыть все спойлеры';
var OPENED_SPOILER_LABEL = 'Закрыть все спойлеры';

var button = document.createElement('button');
button.type = 'button';
button.innerHTML = CLOSED_SPOILER_LABEL;
button.dataset.isOpen = '0';
button.style.cssText = 'padding: 5px; border: solid 1px;';

button.addEventListener('click', function () {
var spoilerIsOpen = this.dataset.isOpen === '1';

this.dataset.isOpen = +!spoilerIsOpen;
this.textContent = spoilerIsOpen ? CLOSED_SPOILER_LABEL : OPENED_SPOILER_LABEL;

[].forEach.call(spoilers, function (spoilerWrapper) {
var clickTarget;

if (
spoilerWrapper.classList.contains('sp-wrap') &&
spoilerIsOpen === spoilerWrapper.classList.contains('sp-opened')
) {
clickTarget = spoilerWrapper.querySelector('.sp-head');
} else if (!spoilerWrapper.parentNode.classList.contains('ce nter')) {
clickTarget = spoilerWrapper.querySelector('.clickable');
}

clickTarget && clickTarget.dispatchEvent(
new Event('click', { bubbles: true })
);
});
});

var buttonContainer = document.createElement('div');
buttonContainer.style.margin = '8px auto';
buttonContainer.style.width = '98%';
buttonContainer.appendChild(button);

spoilers[0].parentNode.insertBefore(buttonContainer, spoilers[0]);
})();

Capoeirista
21.10.2023, 22:47
Может кто поправить для сайта 4PDA?
И чтобы также открывались спойлеры внутри спойлеров.

Например на странице
https://4pda.to/forum/index.php?showtopic=949619

(function () {
var spoilers = [].slice.call(document.querySelectorAll('div.postcol or .spoil'));
if (!spoilers.length) {
return;
}
var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Открыть все спойлеры';
btn.addEventListener('click', function () {
spoilers.forEach(function (node) {
if(node.parentNode.classList.contains('close')) return;
node.querySelector('.block-title').dispatchEvent(new Event('click'));
});
});
spoilers[0].insertAdjacentHTML('beforebegin', '<br>');
spoilers[0].parentNode.insertBefore(btn, spoilers[0]);
})();

voraa
22.10.2023, 10:36
Может кто поправить для сайта 4PDA?

(function () {
var spoilers = document.querySelectorAll('div.post-block.spoil');
if (!spoilers.length) {
return;
}
var btn = document.createElement('button');
btn.type = 'button';
btn.innerHTML = 'Открыть все спойлеры';
btn.addEventListener('click', function () {
spoilers.forEach(function (node) {
node.classList.replace('close', 'open');
const imgs = node.querySelectorAll('img[data-src]');
imgs.forEach (img => img.src = img.dataset.src)
});
});
spoilers[0].insertAdjacentHTML('beforebegin', '<br>');
spoilers[0].parentNode.insertBefore(btn, spoilers[0]);
})();




Но там вообщето Ctrl + click по спойлеру открывает все спойлеры.