我正在写一个测试脚本，我想在其中选择表单中的现有p标签并更新所使用的副本。我没有访问原始代码的权限，只能使用JavaScript进行更新，直到获得客户技术负责人和测试结果的批准。
我的原始代码是：
var p = document.querySelector(".form-bg form p").innerHTML;
p.innerHTML = 'By hitting Get Your Quote, I agree to receive autodialed calls, to include scheduling reminders, and texts from this company.';
但是，p标签的内容没有更新，碰到障碍说明代码未定义或不是函数。
因此，我尝试将.appendChild（）与创建新元素并在无法更新现有副本的情况下隐藏现有元素的思考过程一起使用。
我使用.appendChild（）更新的代码是：
let updatedCopy = document.createElement('p');
updatedCopy.id = 'testCopy';
updatedCopy.innerHTML = 'By hitting Get Your Quote, I agree to receive autodialed calls, to include scheduling reminders, and texts from this company';
document.getElementsByClassName('form-bg').appendChild(updatedCopy);
我已经尝试在浏览器中运行它，但是还没有成功。任何指导将不胜感激！:)
最后，这是需要修改的HTML代码段：
<div id="lightbox_shell">
<div class="test-w_contact-lightbox-individuals">
<div class="form-main-bg">
<div class="close-bg">
<button class="close" type="button">close</button>
</div>
<!-- Form Starts Here -->
<div class="form-bg">
<div class="legend">
Provide your information so an agent can reach you.
</div>
<form method="post">
<input name="offering" type="hidden" value="Individual"> <input name="language" type="hidden" value="English">
<div class="contact-fields">
<div class="flex_columns">
<div class="flex_2col">
<span class="input-text firstname" data-manual="1"><input class="required" id="firstname" maxlength="150" name="firstname" placeholder="First Name *" title="First Name" type="text"></span>
</div>
<div class="flex_2col">
<span class="input-text lastname" data-manual="1"><input class="required" id="lastname" maxlength="150" name="lastname" placeholder="Last Name *" title="Last Name" type="text"></span>
</div>
<div class="clearfloat"></div>
</div>
<div class="flex_columns">
<div class="flex_2col">
<span class="input-text phone" data-manual="1"><input class="required" id="phone" maxlength="12" name="phone" placeholder="Phone Number *" title="Phone Number" type="tel"></span>
</div>
<div class="flex_2col">
<span class="input-text zipcode" data-manual="1"><input class="required" id="zipcode" maxlength="5" name="zipcode" placeholder="Zip Code *" title="Zip Code" type="tel"></span>
</div>
<div class="clearfloat"></div>
</div>
<div class="flex_columns">
<div class="flex_2col">
<span class="input-text email" data-manual="1"><input class="required" id="email" maxlength="255" name="email" placeholder="Email *" title="Email" type="email"></span>
</div>
<div class="flex_2col">
<div class="requirement-info">
* fields are required
</div>
<ul class="misc">
<li>
<p>Would you like an agent to call asap?</p><label class="checkbox"><input name="yesmeet" type="checkbox"> Yes</label> <label class="checkbox"><input name="nomeet" type="checkbox"> No</label>
</li>
</ul>
</div>
<div class="clearfloat"></div>
</div>
</div>
<p style="font-size: 13px;line-height: 100%;margin: 15px 0 14px;">By hitting submit, I agree to receive autodialed calls, to include scheduling reminders, and texts from this company.</p>
</form>
</div>
<div class="raq-complete-panel">
<div class="thanks">
<div class="title">
Thank You!
</div>
<p>An agent will call you<br>
<span class="eta">within 15 minutes.</span></p>
</div>
<div class="info">
<p>Your confirmation number is <span class="number"></span>.</p>
<p>If you have any questions regarding your request, contact us at <a class="textlink" href="mailto:[email protected]">[email protected]</a></p>
<p>Please provide your confirmation number listed above for reference.</p>
</div>
</div>
<div class="clearfloat"></div>
</div>
</div>
</div>
您的第一次尝试是如此接近。您希望您的作业像这样：
var p = document.querySelector(".form-bg form > p");
然后您可以设置innerHTML。
p.innerHTML = "Your new text";
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句