How to display text from one line in artist-song format using JS without bugs?

  • 0
    Comrades, welcome!

    I will say right away that I am not a guru in JS, however, I ask you to tell me how to move on. I did what I could on my own, but I screwed up somewhere ...

    So there is a php script that extracts information from an xml file in one line. We get something like Calvin Harris, Dua Lipa - One Kiss or David Guetta, Sia - Flames

    Then, using JS, this information is loaded into an html file, which has the structure:
    <div class="meta-info">
      <div class="label">Сейчас в эфире:</div>
        <div id="artist">&nbsp; </div>
        <div id="song">&nbsp; </div>

    The JS snippet looks like this:

    xmlhttp.onreadystatechange = function() {
    	4 === xmlhttp.readyState && 200 === xmlhttp.status && (artist_info.innerText = xmlhttp.responseText.split("-")[0], song_info.innerText = xmlhttp.responseText.split("-")[1], console.log(xmlhttp.responseText.split("-")))
    },"GET", "/pn2.php"), xmlhttp.send(), setInterval(function() {"GET", "/pn2.php"), xmlhttp.send()

    I noticed that when a song sounds like G-Easy, Halsey - Him & amp; I , the page is anarchy like this:

    Accordingly, the question arises as to how it is necessary to correct the code so that the song title G-Easy, Halsey - Him & amp; I was displayed correctly? I understand that the code sees - in the title and decides to break the title, but it turns out wrong for the user ...

    I would be extremely grateful!
    JavaScript Cole Charles, May 18, 2019

  • 2 Answers
  • 0
    You can use split ("-") instead of split ("-") , but in general it is better to use JSON so that the track title and artist are in separate fields. This will work more reliably because the input data can be unpredictable. For example, an artist's name will contain "-" with spaces and everything will break again.
    Everett Baxter

  • 0
    If you can get the required fields separately on the server, then send a normal object in JSON from the server and do not pervert with cutting lines.

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!