как сократить код

[leon2009sp]

Здравствуйте! как можно сократить код?
function first() {
document.getElementById("second_hide").setAttribute("style", "opacity:1; transition: 1s; height: 100%;");
document.getElementById("first").setAttribute("style","display: none");
document.getElementById("first_yelloy").setAttribute("style","display: block");
}
function first_yelloy() {
document.getElementById("second_hide").setAttribute("style","display: none");
document.getElementById("first_yelloy").setAttribute("style","display: none");
document.getElementById("first").setAttribute("style","display: block");
}
function first2() {
document.getElementById("second2_hide").setAttribute("style", "opacity:1; transition: 1s; height: 100%;");
document.getElementById("first2").setAttribute("style","display: none");
document.getElementById("first2_yelloy").setAttribute("style","display: block");
}
function first2_yelloy() {
document.getElementById("second2_hide").setAttribute("style","display: none");
document.getElementById("first2_yelloy").setAttribute("style","display: none");
document.getElementById("first2").setAttribute("style","display: block");
}
function first3() {
document.getElementById("second3_hide").setAttribute("style", "opacity:1; transition: 1s; height: 100%;");
document.getElementById("first3").setAttribute("style","display: none");
document.getElementById("first3_yelloy").setAttribute("style","display: block");
}
function first3_yelloy() {
document.getElementById("second3_hide").setAttribute("style","display: none");
document.getElementById("first3_yelloy").setAttribute("style","display: none");
document.getElementById("first3").setAttribute("style","display: block");
}
вывод на экран:
<div class="rigal">
<h id='first' onclick='first()' class='text15'>читать далее...</h>
<h id='first_yelloy'; style='display:none' onclick='first2_yelloy()' class='text15'>Скрыть блок</h>
</div>
<div id='second_hide' style='display:none'>111111111111111.</div>
<div class="rigal">
<h id='first2' onclick='first2()' class='text15'>читать далее...</h>
<h id='first2_yelloy'; style='display:none' onclick='first2_yelloy()' class='text15'>Скрыть блок</h>
</div>
<div id='second2_hide' style='display:none'>222222222222222.</div>
<div class="rigal">
<h id='first3' onclick='first3()' class='text15'>читать далее...</h>
<h id='first3_yelloy'; style='display:none' onclick='first3_yelloy()' class='text15'>Скрыть блок</h>
</div>
<div id='second3_hide' style='display:none'>333333333333333333.</div>

[leon2009sp]

ну <div class="rigal">
<h id='first' onclick='first()' class='text15'>читать далее...</h>
<h id='first_yelloy'; style='display:none' onclick='first2_yelloy()' class='text15'>Скрыть блок</h>
</div>
этот кусок лежит в разных файлах: 1.txt 2.txt 3.txt
может подсчитать файлы

[рони]

leon2009sp, форум поиск
открывашка зависимая

[leon2009sp]

может что нибудь придумкать можно :victory: лучше с пояснениями:
5 файлов txt, в каждом файле код:
<div class="rigal">
<h id='first' onclick='first()' class='text15'>читать далее...</h>
<h id='first_yelloy'; style='display:none' onclick='first_yelloy()' class='text15'>Скрыть блок</h>
</div>
<div id='second_hide' style='display:none'>1111111111111</div>
вывод текста.
весь этот текст выводим в один файл через php.
foreach ($filelist as $filename)
{
$path_info = pathinfo($filename);
$text_content = file_get_contents($texts_dir . $path_info['filename'] . '.txt');
echo "<tr><td>
<table class='table3'>
<tr>
<td class='td17'><img src='{$filename}' class='img2' alt='Новости Сибири'></td>
<td class='td18'>{$text_content}</td>
</tr>
</table>
и сам код скрыть или показать текст:::
function first() {
document.getElementById("second_hide"+i*filecount).setAttribute("style", "opacity:1; transition: 1s; height: 100%;");
document.getElementById("first"+i*filecount).setAttribute("style","display: none");
document.getElementById("first_yelloy"+i*filecount).setAttribute("style","display: block");
}
function first_yelloy() {
document.getElementById("second_hide"+i*filecount).setAttribute("style","display: none");
document.getElementById("first_yelloy"+i*filecount).setAttribute("style","display: none");
document.getElementById("first"+i*filecount).setAttribute("style","display: block");
}
воть=я не знаю как сократить JS код потому что получается:
1,2,3,4,5...
может по количеству файлов в папке прибавить по 1 i:=i+1;
потом нашел поиск файлов два скрипта:
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
document.getElementById("output").innerHTML=allText;

}
}
}
rawFile.send(null);
}
и

function givMeFiles (dir, files)
{
files = files || [];
var allFiles = fs.readdirSync(dir);
for (var i =0; i<allFiles.length; i++){
var name = dir + '/' + allFiles[i];
if (fs.statSync(name).isDirectory()){
givMeFiles (name, files);
} else {
files.push(name);
}
}
return files;
};
givMeFiles ("admin/ru")

или это я опять из фантастики Эйнштейна :-?

[leon2009sp]

идея была такой:
function readTextFile(file)
{
var rawFile = new XMLHttpRequest();
rawFile.open("GET", file, false);
rawFile.onreadystatechange = function ()
{
if(rawFile.readyState === 4)
{
if(rawFile.status === 200 || rawFile.status == 0)
{
var allText = rawFile.responseText;
document.getElementById("output").innerHTML=allText;

function first() {
document.getElementById("second_hide"+i*filecount).setAttribute("style", "opacity:1; transition: 1s; height: 100%;");
document.getElementById("first"+i*filecount).setAttribute("style","display: none");
document.getElementById("first_yelloy"+i*filecount).setAttribute("style","display: block");
}
function first_yelloy() {
document.getElementById("second_hide"+i*filecount).setAttribute("style","display: none");
document.getElementById("first_yelloy"+i*filecount).setAttribute("style","display: none");
document.getElementById("first"+i*filecount).setAttribute("style","display: block");
}


}
}
}
rawFile.send(null);
}

[рони]

ну не как это зависимая?
тогда просто открывашка)))

и стандартизируйте блоки, уберите все id, сделайте у всех блоков одинаковые классы.

[рони]

leon2009sp,
<!DOCTYPE html>

<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.rigal + .content{
display: none;
}
.rigal.open + .content{
display: block;
}
.rigal > h3:after{
content: attr(data-hide);
}
.rigal.open > h3:after{
content: attr(data-open);
}
</style>

<script>
document.addEventListener( "click" , function(event) {
let target = event.target.closest('.rigal')
if(target) target.classList.toggle('open')

});
</script>
</head>

<body>
<div class="rigal">
<h3 class='text15' data-open='Скрыть блок' data-hide='читать далее...'></h3>
</div>
<div class='content'>1111111111111</div>
<div class="rigal">
<h3 class='text15' data-open='Скрыть блок' data-hide='читать далее...'></h3>
</div>
<div class='content'>222222222222222</div>
<div class="rigal">
<h3 class='text15' data-open='Скрыть блок' data-hide='читать далее...'></h3>
</div>
<div class='content'>333333333333333333</div>
</body>
</html>