Object htmlparagraphelement js как исправить - Сайт, где вы сможете решить свои вопросы

Я новичок, создаю простой калькулятор.

Есть кнопка =, при нажатии на которую срабатывает функция rez().

<button onclick="rez()">=</button>

Сама функция выглядит так:

function rez(){
  var num1, num2, znak, result;

    num1 = document.getElementById("out");
    num2 = document.getElementById("out2");
    znak = document.getElementById("out1");
    result = num1 + num2;
    stroka = document.getElementById("out3");

    stroka.innerHTML += result;

}

И когда я нажимаю знак =, вместо того, чтобы писать ответ, появляется вот такая строка:

[object HTMLParagraphElement][object HTMLParagraphElement]

Пожалуйста, помогите решить!!! Уже 2 часа не могу решение найти!

Напишите ответ простым языком, если это возможно, а то я не сильно в этом разбираюсь))

Источник

I am a newbie. Here is my code:

<html>
  <head>
    <script type="text/javascript">
      function replyOne () {
        document.getElementById("comment_content").value = document.getElementById("username")
      }
    </script>
  </head>
  <body>
    <p id="username">Jack</p>
    <textarea id="comment_content" ></textarea>
    <button onclick="replyOne()">Copy Text</button>
  </body>
</html>

I expect that when I click the button, it will copy ‘Jack’ to the textarea.
But instead it just writes ‘[object HTMLParagraphElement]’.

asked Apr 22, 2013 at 12:47

It should be:

document.getElementById("comment_content").value =
    document.getElementById("username").innerHTML

Without the .innerHTML, it will try to copy in the actual element, not its content.

answered Apr 22, 2013 at 12:47

tckmntckmn

57.4k27 gold badges114 silver badges155 bronze badges

You can use textContent,innertext,innerHTML.But two of them are browser specific and innerHTML can work on three major browser.

Also you can parse the dom by parent children combination and will get required value.

 function replyOne () {
    document.getElementById("comment_content").value=document.getElementById("username").innerHTML;

    //OR 
    document.getElementById("comment_content").value=document.getElementById("username").textContent;

    }

answered Apr 22, 2013 at 13:07

RujuRuju

9611 gold badge12 silver badges24 bronze badges

You need to extract what you are looking for using the obj.innerText attribute and you will solve the problem-:

var t= document.getElementById("comment_content");
var text=t.innerText;
alert(t);

answered Dec 30, 2022 at 15:23

This is solution of [objectHTMLParagraphElement] with example

var sel = document.getElementById('ex').innerHTML; // without innerHTML this will 
comes [objectHTMLParagraphElement]
var txt = sel + "Hello";    
document.write(txt); // output Hello

answered Mar 9, 2021 at 7:27

Источник

Есть выбор типа доставки в <input type="radio"> с обработкой JS; выводится выбранный тип вот таким образом: <output id="product-price"></output>, но почему то, когда ещё не сделал выбор, щёлкнув на какую-нибудь пустую строчку формы заказа, на месте этого вывода появляется это сообщение [object HTMLParagraphElement].

Что это такое и как с этим бороться?

Вот фрагменты кода JS:

window.onload = function(){ totalPrice = "<?=$_SESSION['total_price']?>"; }

window.onclick = function onclickRadio() {
  var nameRadio = document.getElementsByName('nameRadio');
  for (var i = 0; i < nameRadio.length; i++) {
    if (nameRadio[i].type === 'radio' && nameRadio[i].checked) {
        rezultatRadio = nameRadio[i].value;       

    }
  }
  document.getElementById('rezultatRadio').innerHTML =  rezultatRadio;
  document.getElementById('product-price').innerHTML =  new Number (+rezultatRadio) + new Number (+totalPrice);
}

<input type="radio" name="nameRadio" value="300" > Наш курьер (Стоимость доставки 300 руб)
    <input type="radio" name="nameRadio" value="0">Самовывоз

Вот html вывод, где появляется это предупреждение:

<td align="center"><p id="rezultatRadio"></p> руб </td>

Если выводить через , то появляется такое предупреждение: [object HTMLOutputElement]

Пробую теперь вот такой код, вообще ничего не выполняется….:

function(){ totalPrice = "<?=$_SESSION['total_price']?>"; }

function showResult() {
  var nameRadio = document.getElementsByName('nameRadio');
  for (var i = 0; i < nameRadio.length; i++) {
    if (nameRadio[i].type === 'radio' && nameRadio[i].checked) {
        rezultatRadio = nameRadio[i].getAttribute('data');       

    }
  }
  document.getElementById('rezultatRadio').innerHTML =  rezultatRadio;
  document.getElementById('product-price').innerHTML =  new Number (+rezultatRadio) + new Number (+totalPrice);

}

showResult();
window.onclick = showResult;

<input type="radio" name="nameRadio" data='300' value="300" checked="checked"> Наш курьер (Стоимость доставки 300 руб)
    <input type="radio" name="nameRadio" data='0' value="0">Самовывоз

Источник

Столкнулся с проблемой вывода вместо элемента массива строки ‘[object HTMLParagraphElement]’. В консоли выводит то, что должно – 3 html элемента, а при попытке вывода этих элементов на экран с помощью innerHTML выводит строку ‘[object HTMLParagraphElement]’.
Вот код js:

document.addEventListener('DOMContentLoaded', function() {
    //функция, перебирающая элементы
    let technologyHandler = (str) => {
        let techArr = str.split(' ');
        let techArrElem = techArr.map((el) => {
            let docElem = document.createElement('p');
            docElem.classList.add('project_technologies-item');
            docElem.innerHTML = el;
            return docElem;
        });
        return techArrElem;
    }
    let modal = document.getElementById('works-description'),
        closeModal = document.getElementById('close'),
        openElement = document.getElementsByClassName('openingFigure'),
        headline = document.getElementById('headline'),
        taskDescription = document.getElementById('task_description'),
        deadlinesDescription = document.getElementById('deadlines_description'),
        projectTechnologies = document.getElementById('project_technologies'),
        modalImg = document.getElementById('modal-img'),
        modalHref = document.getElementById('modal-href');
    for (let i = 0; i < openElement.length; i++) {
        openElement[i].addEventListener('click', function (e) {
            let handler = e.currentTarget;
            let modalTitle = handler.getAttribute('data-headline'),
                task = handler.getAttribute('data-task'),
                deadline = handler.getAttribute('data-deadline'),
                dataTechnologies = handler.getAttribute('data-technologies'),
                dataImg = handler.getAttribute('data-img'),
                dataHref = handler.getAttribute('data-href');

            modalImg.src = dataImg;
            headline.innerHTML = modalTitle;
            taskDescription.innerHTML = task;
            deadlinesDescription.innerHTML = deadline;
            projectTechnologies.innerHTML = technologyHandler(dataTechnologies).map((el) => el); //вывод элементов на экран
            modalHref.href = dataHref;
            modal.style.display = 'flex';
        });
    }
    closeModal.addEventListener('click', function() {
        modal.classList.remove('fade');
        modal.classList.add('fade-out');
        modal.addEventListener('transitionend', function () {
            modal.style.display = 'none';
            modal.classList.remove('fade-out');
            modal.classList.add('fade');
        });
    });
});

Вот html:

<div id="works-description" class="fade">
                <div class="works-description-block">
                    <a id="close">✖</a>
                    <div class="img-block">
                        <img src="img/" id="modal-img" alt="image">
                    </div>
                    <div class="works-description-text">
                        <h2 id="headline">Site name</h2>
                        <h3>Задача</h3>
                        <p id="task_description"></p>
                        <h3>Сроки</h3>
                        <p id="deadlines_description"></p>
                        <div id="project_technologies"></div> //сюда вывожу элементы
                        <a id="modal-href" href="https://obogrevatel-ua.com/" target="_blank">Перейти на сайт</a>
                    </div>
                </div>
            </div>

           <figure data-img="img/digitalCrafters-bg.png" data-headline="DigitalCrafters" data-task="Верстка посадочной страницы по PSD макету" data-deadline="3 дня"             data-technologies="css html js" <-- элементы              data-href="http://siteportfolio.h1n.ru/DigitalCrafters/" class="openingFigure wow fadeInUp digitalCrafters-figure">
                    <figcaption>
                        <h2>Digital Crafters</h2>
                        <p>Верстка</p>
                    </figcaption>
                </figure>

Источник

I was trying to create a page that randomizes 3 numbers from 1-20. I encountered a problem when I was trying to use document.getElementById. I was trying to substitute the value of id=”large”, but for some unknown reason, I always got [object HTMLParagraphElement].

Here is the source code:

<html>
<body onload = "myFunction()">
<div class="intro"></div>
    <h1>The Egg Hunt</h1>
    <p>Three people, Antonio, Jonathan, and Willy, participated the egg hunt competition.</p>
    <p>These are the points gathered by the three participants: </p>
</div>
<div class="points">
    <div class="first">
        <p>Antonio</p>
        <p id="num1"></p>
    </div>
    <div class="second">
        <p>Jonathan</p>
        <p id="num2"></p>
    </div>
    <div class="third">
        <p>Willy</p>
        <p id="num3"></p>
    </div>
</div>
<div class="info">
    <p>The one who got the most points is: </p>
    <p id="large"></p>
</div>
    <script>
        function myFunction() {
            let x = Math.floor((Math.random() * 20) + 1 );
            document.getElementById("num1").innerHTML = x;
            let y = Math.floor((Math.random() * 20) + 1 );
            document.getElementById("num2").innerHTML = y;
            let z = Math.floor((Math.random() * 20) + 1 );
            document.getElementById("num3").innerHTML = z;
            let largest;
            
            if(num1 >= num2 && num1 >= num3){
            largest = num1;
            document.getElementById("large").innerHTML = largest;
            }
            else if (num2 >= num1 && num2 >= num3){
            largest = num2;
            document.getElementById("large").innerHTML = largest;
            }
            else{
            largest = num3;
            document.getElementById("large").innerHTML = largest;
            }
        }
    </script>
</body>

>Solution :

num1, num2, and num3 are not defined anywhere, so the fix can be modify x, y, and z to those num variables

<html>

  <body onload="myFunction()">
    <div class="intro">
      <h1>The Egg Hunt</h1>
      <p>Three people, Antonio, Jonathan, and Willy, participated the egg hunt competition.</p>
      <p>These are the points gathered by the three participants: </p>
    </div>
    <div class="points">
      <div class="first">
        <p>Antonio</p>
        <p id="num1"></p>
      </div>
      <div class="second">
        <p>Jonathan</p>
        <p id="num2"></p>
      </div>
      <div class="third">
        <p>Willy</p>
        <p id="num3"></p>
      </div>
    </div>
    <div class="info">
      <p>The one who got the most points is: </p>
      <p id="large"></p>
    </div>
    <script>
      function myFunction() {
        const num1 = Math.floor((Math.random() * 20) + 1);
        document.getElementById("num1").innerHTML = num1;
        const num2 = Math.floor((Math.random() * 20) + 1);
        document.getElementById("num2").innerHTML = num2;
        const num3 = Math.floor((Math.random() * 20) + 1);
        document.getElementById("num3").innerHTML = num3;
        let largest;

        if (num1 >= num2 && num1 >= num3) {
          largest = num1;
        } else if (num2 >= num1 && num2 >= num3) {
          largest = num2
        } else {
          largest = num3;
        }
        document.getElementById("large").innerHTML = largest;
      }

    </script>
  </body>

Источник

>Solution :

Вам также может понравиться

Как найти базу мобильных номеров

Пересолила мясной фарш как исправить

Как найти потерявшихся баранов

Добавить комментарий Отменить ответ