document.getElementById работает, но document.getElementsByTagName не работает

Чтобы выбрать все теги p внутри div - он работает с document.getElementById(), но не с document.getElementsByTagName(). Почему это?document.getElementById работает, но document.getElementsByTagName не работает

<div id="myDIV"> 
    <h2 class="example">A heading with class="example" in div</h2> 
    <p>Para 1 first</p> 
    <p>Para 2</p> 
    <p>Para 3</p> 
    <p>Para 4</p> 
</div> 

<button onclick="myFunction()">Submit</button>

Это работает

function myFunction() { 
    var x = document.getElementById("myDIV").querySelectorAll("p"); 
    var i; 
    for (i = 0; i < x.length; i++) { 
     x[i].style.backgroundColor = "red"; 
    } 
}

Это не

function myFunction() { 
    var x = document.getElementsByTagName("div").querySelectorAll("p"); 
    var i; 
    for (i = 0; i < x.length; i++) { 
     x[i].style.backgroundColor = "red"; 
    } 
}

источник

2017-02-06 Deepika Rao

'document.getElementsByTagName («ДИВ»)' возвращает коллекцию, но ни один узел, так что вы не можете использовать 'querySelector' на нем. –

Вы смешиваете решения, что делает несправедливое сравнение. 'document.getElementById (" myDiv "). getElementsByTagName (" p ");' должен работать. –

Это имеет смысл. Спасибо. function myFunction() { var x = document.getElementsByTagName ("div") [0] .querySelectorAll ("p"); var i; для (i = 0; i

Я предлагаю использование прямого выбора, как:

document.querySelectorAll("#myDIV p"); 
//Or 
document.querySelectorAll("div p");

Надеется, что это помогает.

var x = document.querySelectorAll("div p"); 
 
var i; 
 

 
for (i = 0; i < x.length; i++) { 
 
    x[i].style.backgroundColor = "red"; 
 
}

<div id="myDIV"> 
 
    <h2 class="example">A heading with class="example" in div</h2> 
 
    <p>Para 1 first</p> 
 
    <p>Para 2</p> 
 
    <p>Para 3</p> 
 
    <p>Para 4</p> 
 
</div>

источник

2017-02-06 10:32:14

Он говорит - не может установить backgroundColor undefined –

Где? вы попробовали мой фрагмент? –

Я имел в виду, если вы используете document.querySelectorAll («div p»); он даст неопределенную ошибку –

вы можете попробовать это.

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 



</head> 

<body> 
<div id="myDIV"> 
    <h2 class="example">A heading with class="example" in div</h2> 
    <p>Para 1 first</p> 
    <p>Para 2</p> 
    <p>Para 3</p> 
    <p>Para 4</p> 
</div> 

<button onclick="myFunction()">Submit</button> 


<script> 
function myFunction() { 
    var x = document.querySelectorAll("p"); 
    var i; 
    for (i = 0; i < x.length; i++) { 
     x[i].style.backgroundColor = "red"; 
} 
} 
</script> 
</body> 

</html>

источник

2017-02-06 11:15:03

document.getElementById работает, но document.getElementsByTagName не работает

ответ

Смежные вопросы