Scribd Logo
Upload

Welcome to Scribd!

  • NGUYỄN DUY HƯNG 20212306

    Uploaded by

    Bùi Ngọc Hải
    5 views3 pages
    The document contains HTML code defining an interface with inputs and buttons to perform calculations and string manipulations. It also contains JavaScript code adding event listeners to the buttons to handle clicks and perform the following tasks: 1) Multiply or divide two numbers input by the user. 2) Extract the link, name and type from a string formatted like a file path. 3) Sort and join the characters of a string input by the user. 4) Reverse the characters of a string input by the user.

    Original Description:

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document contains HTML code defining an interface with inputs and buttons to perform calculations and string manipulations. It also contains JavaScript code adding event listeners to the buttons to handle clicks and perform the following tasks: 1) Multiply or divide two numbers input by the user. 2) Extract the link, name and type from a string formatted like a file path. 3) Sort and join the characters of a string input by the user. 4) Reverse the characters of a string input by the user.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    5 views3 pages

    NGUYỄN DUY HƯNG 20212306

    Uploaded by

    Bùi Ngọc Hải
    The document contains HTML code defining an interface with inputs and buttons to perform calculations and string manipulations. It also contains JavaScript code adding event listeners to the buttons to handle clicks and perform the following tasks: 1) Multiply or divide two numbers input by the user. 2) Extract the link, name and type from a string formatted like a file path. 3) Sort and join the characters of a string input by the user. 4) Reverse the characters of a string input by the user.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 3

    Nguyễn Duy Hưng – 20212306

    HTML

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <P><H1>
            BÀI TẬP CHƯƠNG 3
        </H1></P>
      </head>
      <body>
        <div>
          <h2>BÀI 1</h2>
          <div>
            <label>1st Number</label>
            <input id="1st" type="number" min="0" />
          </div>
          <div>
            <label>2nd Number</label>
            <input id="2nd" type="number" min="0" />
          </div>
     
          <div>
            <button id="multiply">Multiply</button>
            <button id="divide">Divide</button>
          </div>
          <h3>The result is : <span id="calc-result"></span></h3>
        </body>
        </div>
        <div>
            <h2>BÀI 2</h2>
            <input id="input" type="text" value=""> <button onclick="act()"
           <P>
            <p>Link<p id="l"
            </p><p>
                Name<o id="n"
            </p><p>
                type<p id="t"
            </p> </P>
        </div>

        <div>
          <h2>BÀI 3</h2>
          <input type="text" id="string">
          <button id="sort">Sort</button>
          <p id="sort-result"></p>
        </div>

        <div>
          <h2>BÀI 4</h2>
          <input type="text" id="str">
          <button id="reverse">Reverse</button>
          <p id="reverse-result"></p>
        </div>
       
      <script src="./index.js"></script>
    </html>

    JS

    const firstNum = document.getElementById("1st");


    const secondNum = document.getElementById("2nd");
    const multiplyButton = document.getElementById("multiply");
    const divideButton = document.getElementById("divide");
    const calcResult = document.getElementById("calc-result");
    const sortResult = document.getElementById("sort-result");
    const string = document.getElementById("string");
    const sortButton = document.getElementById("sort");
    const str = document.getElementById("str");
    const reverseButton = document.getElementById("reverse");
    const reverseResult = document.getElementById("reverse-result");

    ///Bài 1

    multiplyButton.addEventListener("click", () => {
      let firstNumberValue = +firstNum.value;
      let secondNumberValue = +secondNum.value;

      let res = firstNumberValue * secondNumberValue;

      calcResult.textContent = res;
    });

    divideButton.addEventListener("click", () => {
      let firstNumberValue = +firstNum.value;
      let secondNumberValue = +secondNum.value;

      let res = firstNumberValue / secondNumberValue;

      calcResult.textContent = res;
    });
    ////Bài 2
    function act(){
    var a=document.getElementById("input").value;
    var i=a.lastIndexOf('.');
    var j=a.lastIndexOf('\\');
    var l=a.substring(0,j);
    var n=a.substring(j+1,j);
    var t=a.substring(i+1,a.alength);
    document.getElementById("l").innerHTML=l;
    document.getElementById("n").innerHTML=n;
    document.getElementById("t").innerHTML=t.toUpperCase()+" File";
    }
    //Bài 3
    sortButton.addEventListener("click", () => {
      let stringValue = string.value;
      let res = stringValue.split("").sort().join("b");
      sortResult.textContent = res;
    });

    //Bài 4
    reverseButton.addEventListener("click", () => {
      let strValue = str.value;
      let res = strValue.split("").reverse().join("");
      reverseResult.textContent = res;
    });

    You might also like