如何使用 Google Chrome DevTools 编辑 HTML 页面的一行

Question

我有一个经常用于工作的网站，页面中的某些内容确实困扰着我，我花了很多时间像普通用户一样做这件事，所以我通过更改 HTML 使用 chrome devtools，但问题是 HTML 非常大，手动更改一行需要花费很多时间。

这是代码的一部分：

<tr id="appl_tr" height="30">
    <td valign="middle" class="styleBlack" width="34%" style="padding-left:10px;">
     Birthdate : <span style="color:#F00">*</span> 
    </td>
    <td width="66%" align="left" valign="middle">
         <input type="text" name="dateOfBirth" class="form-control-input" id="dateOfBirth" value="" readonly="" >
    </td>
</tr>

我只想使用 chrome 控制台，只删除第六行的 readonly="" 东西，所以它会像这样：

<input type="text" name="dateOfBirth" class="form-control-input" id="dateOfBirth" value="" >

Answer 1

为什么不直接在控制台中使用 javascript？

document.querySelector('#dateOfBirth').removeAttribute('readonly')

如何使用 Google Chrome DevTools 编辑 HTML 页面的一行

How to edit a line of an HTML page using Google Chrome DevTools

google-chrome

developer-tools