javascript - 在v2中,我们如何改变p 标记的值

  显示原文与译文双语对照的内容
150 4

我们如何在 v2 div中改变p 标记的值


<div id="v1">


<div id="flow">


 <p id="content">Hello</p>


</div>


</div>


<div id="v2">


<div id="flow">


 <p id="content">Hello</p>


</div>


</div>



时间:

115 3
  • 首先,从代码中删除重复的id 。 没有两个元素withing页面应该具有相同的id 。 如果希望在同一组中包含多个元素,则可以使用 class 属性。 有关更详细的信息,请参见
  • 其次,使用 querySelector() 方法获取对所需元素的引用,并使用你想要添加的内容覆盖它的textContent 属性。

let para = document.querySelector('#v2 p.content');



para.textContent = 'World';

<div id="v1">


 <div class="flow">


 <p class="content">Hello</p>


 </div>


</div>


<div id="v2">


 <div class="flow">


 <p class="content">Hello</p>


 </div>


</div>

引用:

原作者:
119 3

对每个 p 使用唯一的id,并在 innerHTML 之间进行更改


var c1=document.getElementById("content1").innerHTML;


var c2=document.getElementById("content2").innerHTML;



document.getElementById("content1").innerHTML = c2;


document.getElementById("content2").innerHTML = c1;

<div id="v1">


<div class="flow">


 <p id="content1">Hello</p>


</div>


</div>


<div id="v2">


<div class="flow">


 <p id="content2">Hello of 2</p>


</div>


</div>
118 5

这里是的而且是唯一的。

document.querySelector('#v2 div p').innerHTML = 'changed';

<div id="v1">


<div id="flow">


 <p id="content">Hello</p>


</div>


</div>


<div id="v2">


<div id="flow">


 <p id="content">Hello</p>


</div>


</div>
51 1

它是无效语法,因此通常建议不要在页面上使用多个 ID,但这里是这样做的方法:


<div id="v1">


 <div id="flow">


 <p id="content">Hello</p>


 </div>


</div>


<div id="v2">


 <div id="flow">


 <p id="content">Hello</p>


 </div>


</div>




document.getElementById("v2").getElementById("content").innerText ="Some new text";



原作者:
...