Um mit CSS arbeite kann , habe deine Zeile,
document.links[i].setAttribute("aria-current", "page");
gewechsel mit ,
document.links[i].classList.add("css_link");
jetz , wie der ganze Code siehst...
<?php
header("Content-Type: text/html; Charset=utf-8");
mb_internal_encoding('UTF-8');
date_default_timezone_set('UTC');
error_reporting(E_ALL);
?>
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>beispiel-2</title>
</head>
<style>
.link_wechsel ul {
list-style-type: none;
margin-left: 340px;
}
.link_wechsel li {
display: inline;
}
.link_wechsel a {
display: inline;
text-decoration: none;
border: 1px solid gray;
background-color: #FE2E64;
color: black;
padding: 8px;
opacity: 0.5;
font-family: Times New Roman;
}
.link_wechsel a:hover {
background-color: #9f9e9e;
}
.link_wechsel a.css_link {
background-color:green;
}
</style>
<body>
<h3>Page 2</h3>
<nav class="link_wechsel">
<h2 class="visually-hidden">Page navigation</h2>
<ul>
<li><a href="Beispiel-1.php">1</a></li>
<li><a href="Beispiel-2.php">2</a></li>
</ul>
</nav>
<script>
var currentURL = window.location.href;
for (let i=0;i<document.links.length;i++)
{
if (document.links[i].href === currentURL)
{
document.links[i].classList.add("css_link");
document.links[i].setAttribute("tabindex", "0");
document.links[i].removeAttribute("href");
}
}
</script>
</body>
</html>
ein Screeshot wie Beispiel-2.php siehst…