Javascript in php doesn't work

hello in a php site i have a section of articles taken from a database i have to change background color and font color of each articles.
i have a javascript code who worked in html css js code but in php it didn’t
my js:

let a = document.getElementsByTagName(“article”);
console.log(a);
for (i in a) {
a[i].onmouseover = function () {
this.style.backgroundColor = “black”;
this.style.color = “white”;
};
a[i].onmouseout = function () {
this.style.backgroundColor = “white”;
this.style.color = “black”;
};
}

wich modify these articles

<section>
<div id="mouseover">

    <?php
    foreach ($articles as $article):
    ?>

				<article id="art">

							<h4 class="title"><a href="post&id=<?= $article->id() ?>"><b><?= $article->title() ?></b></a></h4>

				</article>

    <?php endforeach ?>

Hi,
unless I have missed anything in PHP, this doesn’t look like a valid injection of php to me.

So I assume that your html output is broken. What does it look like in the browser devtools?

everything is fine ,only the script that won’t work

Ah ok, just saw that this is shorthand for <?php echo.
So how do you load your Javascript into the file?

<script type = "texte/javascript" src = "/public/js.js"></script>

And where? In the head or at the bottom of the body?

should be text/javascript

sorry

<section>

        <div id="mouseover">

        <?php

        foreach ($articles as $article):

        ?>

                    <article id="art">

                                <h4 class="title"><a href="post&id=<?= $article->id() ?>"><b><?= $article->title() ?></b></a></h4>

                    </article>

        <?php endforeach ?>

        </div>

        <aside>

        <ul>

            <li class="listaside">

                <a href="#article4">article</a>

            </li>

            <li class="listaside">

                <a href="#article5">article</a>

            </li>

            <li class="listaside">

                <a href="#article6">article</a>

            </li>

        </ul>

        <img class="gif" src="https://img.phonandroid.com/2015/11/taper-clavier-test.gif" alt="" />

        </aside>

    </section>

    <script type = "texte/javascript" src = "public/js.js"></script>

Is anything logged to the console?
If not, I assume that your relative path doesn’t work or the Javascript is loaded before the DOM is loaded.
Apart from correcting the type (text rather than texte) you could try to use an absolute path and add a defer attribute to the script tag.

i modified that thanks
now i have in console
localhost/:157 GET http://localhost/public/js.js net::ERR_ABORTED 404 (Not Found)
i think i have problems with urls

Then try the absolute path instead of the relative path.

Can you publish the project on github? So we can get a sense of the project structure

thanx you put me on a good way to figure it out

1 Like

it’s just an exercice from school nothing formal

True, but we are much better able to help you if we can see the project/code in full (including the directory structure)

if i’m stuck again i will!!