如何使用Javascript更改的内容</h1> <div class="single_info">2020/11/17 15:22 · <a href="http://javascript.askforanswer.com/category/javascript" rel="category tag">javascript</a> · · <a href="http://javascript.askforanswer.com/ruheshiyongjavascriptgenggaideneirong.html#respond">0评论</a> </div> </header> <div class="entry-content"> <div class="single-content"> <div class='question-part'> <div id="question-outer"> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">如何</font></font><code class="prettyprint"><textarea></code><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">使用JavaScript</font><font style="vertical-align: inherit;">更改</font><font style="vertical-align: inherit;">元素</font><font style="vertical-align: inherit;">的内容</font><font style="vertical-align: inherit;">？</font></font></p> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">我想把它清空。</font></font></p> </p></div> </div> <div class='answer-divider'></div> <div class='answer-part'> <div id="answer-outer"> <div class="answer-text"> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">像这样：</font></font></p> <pre class><code class="prettyprint"><span class="hljs-built_in">document</span>.getElementById(<span class="hljs-string">'myTextarea'</span>).value = <span class="hljs-string">''</span>; </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">或在jQuery中这样：</font></font></p> <pre class><code class="prettyprint">$(<span class="hljs-string">'#myTextarea'</span>).val(<span class="hljs-string">''</span>); </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">你在哪里</font></font></p> <pre class><code class="prettyprint"><textarea id=<span class="hljs-string">"myTextarea"</span> name=<span class="hljs-string">"something"</span>>This text gets removed</textarea> </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">对于所有反对者和非信奉者：</font></font></p> <ul> <li> <p><a href="http://msdn.microsoft.com/en-us/library/ms535122(VS.85).aspx" rel="noreferrer"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">这是MSDN参考</font></font></a></p> <blockquote> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">value属性：在textArea元素的输入字段中检索或设置文本。</font></font></p> </blockquote> </li> <li> <p><a href="https://developer.mozilla.org/en-US/docs/DOM/HTMLTextAreaElement" rel="noreferrer"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">这是MDN参考</font></font></a></p> <blockquote> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">value DOMString控件中包含的原始值。</font></font></p> </blockquote> </li> </ul> <div> <div class="answer-text"> <p><b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">如果</font></font></b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">可以使用jQuery，我强烈建议您这样做，那么您只需</font></font></p> <pre class><code class="prettyprint">$(<span class="hljs-string">'#myTextArea'</span>).val(<span class="hljs-string">''</span>); </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">否则，它取决于浏览器。</font><font style="vertical-align: inherit;">假设你有</font></font></p> <pre class><code class="prettyprint"><span class="hljs-keyword">var</span> myTextArea = <span class="hljs-built_in">document</span>.getElementById(<span class="hljs-string">'myTextArea'</span>); </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">在大多数浏览器中</font></font></p> <pre class><code class="prettyprint">myTextArea.innerHTML = <span class="hljs-string">''</span>; </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">但是在Firefox中，</font></font></p> <pre class><code class="prettyprint">myTextArea.innerText = <span class="hljs-string">''</span>; </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">弄清楚用户正在使用哪种浏览器作为练习。</font><font style="vertical-align: inherit;">当然，除非您使用jQuery；）</font></font></p> <p><b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">编辑</font></font></b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">：我收回了。</font><font style="vertical-align: inherit;">看起来对textarea的.innerHTML的支持得到了改善。</font><font style="vertical-align: inherit;">我在Chrome，Firefox和Internet Explorer中进行了测试，所有这些都可以正确清除文本区域。</font></font></p> <p><b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">编辑2</font></font></b><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">：我刚刚检查过，如果您在jQuery中使用.val（''），它只是为textarea的.value属性设置。</font><font style="vertical-align: inherit;">所以.value应该很好。</font></font></p> <div> <div class="answer-text"> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">尽管已经给出了许多正确答案，但是经典的（读取非DOM）方法将是这样的：</font></font></p> <pre class><code class="prettyprint"><span class="hljs-built_in">document</span>.forms[<span class="hljs-string">'yourform'</span>][<span class="hljs-string">'yourtextarea'</span>].value = <span class="hljs-string">'yourvalue'</span>; </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">您的textarea在HTML中的嵌套位置如下所示：</font></font></p> <pre class><code class="prettyprint"><form name=<span class="hljs-string">"yourform"</span>> <span class="xml"><span class="hljs-tag"><<span class="hljs-name">textarea</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"yourtextarea"</span> <span class="hljs-attr">rows</span>=<span class="hljs-string">"10"</span> <span class="hljs-attr">cols</span>=<span class="hljs-string">"60"</span>></span><span class="hljs-tag"></<span class="hljs-name">textarea</span>></span></span><font></font> </form><font></font> </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">碰巧的是，它也可以与</font></font><a href="http://en.wikipedia.org/wiki/Netscape_Navigator" rel="noreferrer"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">Netscape Navigator</font></font></a><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"> 4和Internet Explorer 3一起使用。</font><font style="vertical-align: inherit;">而且，并非不重要的是，移动设备上的Internet Explorer。</font></font></p> <div> <div class="answer-text"> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">如果它的jQuery .. </font></font></p> <pre class><code class="prettyprint">$(<span class="hljs-string">"#myText"</span>).val(<span class="hljs-string">''</span>); </code></pre> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">要么</font></font></p> <pre class><code class="prettyprint"><span class="hljs-built_in">document</span>.getElementById(<span class="hljs-string">'myText'</span>).value = <span class="hljs-string">''</span>; </code></pre> <p><a href="http://www.hscripts.com/tutorials/javascript/dom/textarea-events.php" rel="noreferrer"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">http://www.hscripts.com/tutorials/javascript/dom/textarea-events.php</font></font></a></p> <div> <div class="answer-text"> <p><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">将textarea放在表单中，命名它们，然后只需轻松使用dom对象即可，如下所示：</font></font></p> <pre class><code class="prettyprint"><body onload=<span class="hljs-string">"form1.box.value = 'Welcome!'"</span>> <span class="xml"><span class="hljs-tag"><<span class="hljs-name">form</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"form1"</span>></span> <span class="hljs-tag"><<span class="hljs-name">textarea</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"box"</span>></span><span class="hljs-tag"></<span class="hljs-name">textarea</span>></span> <span class="hljs-tag"></<span class="hljs-name">form</span>></span></span><font></font> </body><font></font> </code></pre> <div></div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="clear"></div> <div class="single_banquan"> <strong>本文地址：</strong><a href="http://javascript.askforanswer.com/ruheshiyongjavascriptgenggaideneirong.html" title="如何使用Javascript更改<textarea>的内容" target="_blank">http://javascript.askforanswer.com/ruheshiyongjavascriptgenggaideneirong.html</a><br/> <strong>文章标签：</strong><a href="http://javascript.askforanswer.com/tag/javascript" rel="tag">javascript</a><br/> <strong>版权声明：</strong>本文为原创文章，版权归 <a href="http://javascript.askforanswer.com/ruheshiyongjavascriptgenggaideneirong.html" target="_blank">javascript</a> 所有，欢迎分享本文，转载请保留出处！ </div> <div id="button_box"> <div id="button_file"> <h3>文件下载</h3> <p class="file_ad abc-pc abc-site" align="center"><a href="https://boke112.com/page/laoxuezhuji/" target="_blank"><img src="http://javascript.askforanswer.com/wordpress/wp-content/themes/JianYue/images/abc/xiazai.png" alt="老薛主机终身7折优惠码boke112" /></a></p> <div class="buttons"> </div> <div class="clear"></div> </div> </div> <div class="clear"></div> <div id="post-navigation"> <div class="post-previous"><strong>上一篇：</strong> <a href="http://javascript.askforanswer.com/detecting-when-a-divs-height-changes-using-jquery.html" rel="prev">Detecting when a div’s height changes using jQuery</a></div> <div class="post-next"><strong>下一篇：</strong> <a href="http://javascript.askforanswer.com/zaijavascriptzhonghuoquhaomiaojishijiandegenghaofangfa.html" rel="next">在JavaScript中获取毫秒级时间的更好方法？</a></div> </div> </div> </article> <div id="comments" class="comments-area"> <p class="no-comments">评论已关闭！</p> </div>  </main> </div> <div id="sidebar" class="widget-area"> </div> <div class="clear"></div> </div> <footer> <div class="footerbox"> <p>Copyright © javascript问答 · Powered by <a href="http://wordpress.org/" title="优雅的个人发布平台" target="_blank" rel="nofollow noopener">WordPress</a> · Theme by <a title="免费响应式博客主题JianYue V1.2版本" href="http://yigujin.wang/post/102.html" target="_blank">JianYue</a></p></div> </footer> <a title="返回顶部" id="BackToTop" href="" style="display: none;"><span>^ 回到顶部</span></a> <script type="text/javascript" src="http://javascript.askforanswer.com/wordpress/wp-content/themes/JianYue/js/superfish.js"></script> <script type="text/javascript" src="http://javascript.askforanswer.com/wordpress/wp-content/themes/JianYue/js/prettify.js"></script> </body></html>