如何使用javascript格式化html中的输入
使用JavaScript格式化HTML中的输入可以通过以下步骤实现：
- 获取输入的HTML内容：可以使用JavaScript的DOM操作方法，如getElementById()或querySelector()来获取HTML元素的值。
- 对输入内容进行格式化：可以使用JavaScript的字符串处理方法，如replace()、split()、trim()等来对输入内容进行格式化。具体的格式化方式取决于需求，例如去除多余的空格、换行符，添加缩进等。
- 更新HTML元素的值：将格式化后的内容更新到HTML元素中，可以使用innerHTML或innerText属性来设置HTML元素的值。
以下是一个示例代码，演示如何使用JavaScript格式化HTML中的输入：
<!DOCTYPE html>
<html>
<head>
<title>HTML输入格式化示例</title>
</head>
<body>
<textarea id="input" rows="5" cols="50"></textarea>
<button onclick="formatInput()">格式化</button>
<div id="output"></div>
<script>
function formatInput() {
// 获取输入的HTML内容
var inputElement = document.getElementById("input");
var input = inputElement.value;
// 对输入内容进行格式化
var formattedInput = input.replace(/\s+/g, " ").trim();
// 更新HTML元素的值
var outputElement = document.getElementById("output");
outputElement.innerHTML = formattedInput;
}
</script>
</body>
</html>在上述示例中，用户可以在文本框中输入HTML内容，点击"格式化"按钮后，JavaScript会将输入内容格式化后显示在页面上方的div元素中。
请注意，上述示例仅演示了一种简单的格式化方式，实际应用中可能需要根据具体需求进行更复杂的格式化操作。此外，为了防止XSS攻击，建议在将用户输入的HTML内容插入到页面中时进行适当的安全过滤和转义处理。
相关·内容
2回答
使用Javascript编写调用Javascript函数的HTML输入
javascript、jquery、html
在Javascript中：问题是，正在编写的html有两层引号，我不知道如何格式化这里的第二层引号：
webInput('a'
浏览 0提问于2017-07-10得票数 0
3回答
如何使用javascript格式化html中的输入
javascript、html
如何格式化html上的输入文本，示例输入: Hi hello 我喜欢像这样显示输入 “嗨”，“你好”， 当我点击enter时，将自动显示带有逗号的单引号。 有什么建议吗？谢谢。
浏览 38提问于2021-11-01得票数 0
回答已采纳
1回答
创建带有格式按钮的html字段并将结果存储在mySQL中
javascript、php、html、mysql
我对编码很陌生，我正在设法在网页上创建一个输入字段，其中包含格式化按钮，以启用例如项目符号列表、粗体和下划线文本等，就像我刚才用来发布这个问题的文本框一样。我已经搜索了这个网站并搜索了，但我发现的只是如何定制提交按钮或如何格式化输入字段(比如背景颜色或一般文本外观)，但这不是我想要的。我希望能够创建一个自定义格式化的输入，就像一个带有粗体或下划线的单词的<
浏览 1提问于2016-12-22得票数 0
回答已采纳
2回答
Eclipse:格式化嵌入在JSP中的JavaScript片段
javascript、eclipse、jsp、eclipse-plugin、format
在eclipse编辑器上按Ctrl+Shift+F只格式化html标记和JSP标记中的代码。但是我的JSP文件中有很多使用JavaScript嵌入的<script> </script> (未格式化的)。因此，很难阅读JavaScript代码。我的问题是：
是否有任何插件或其他方式来格式化那些嵌入的Java
浏览 2提问于2011-02-08得票数 0
回答已采纳
3回答
如何在JavaScript文件中重新格式化PhpStorm代码
javascript、html、phpstorm、reformatting
我正在使用PhpStorm 2016.2并使用VueJS开发一个web应用程序。如何重新格式化JavaScript和HTML？
浏览 8提问于2017-06-18得票数 3
回答已采纳
1回答
使用RemoteValidation纠正客户端的输入
asp.net-mvc-3、remote-validation
是否有可能使用远程验证在客户端纠正输入？例如，用户将输入日期为010101，这意味着01-1月-2001，远程验证能在/向客户端反映/传递校正值(010101到01-1月-2001)吗？我有一个场景，让JS将输入格式化为正确的日期格式。后来，我不得不使用RemoteValidation。已删除：2-我有一个日期字段的JavaScript，该字段在焦点丢失时格式化日期。它很好用。当我与JS一起<em
浏览 3提问于2012-04-06得票数 0
回答已采纳
3回答
如何用javascript在浏览器html输出中漂亮地打印常用语言的源代码？
programming-languages、javascript、pretty-print
如何用javascript在浏览器html输出中漂亮地打印常用语言的源代码？示例:用户输入一些代码。那么->有没有一个通用的代码格式化工具来格式化代码呢？最好的javascript
我非常感谢您的帮助。
浏览 3提问于2011-02-27得票数 7
回答已采纳
2回答
如何通过Javascript或Jquery将本地文件读入网页？
javascript、jquery、html、file
我希望用户能够选择一个文本文件从HTML“文件输入”(在他们的本地设备)，并点击上传按钮。我不希望文件直接上传，我希望javascript进行一些验证、格式化，然后将格式化后的结果显示给用户。其中用户根据验证和格式化的结果具有关于他们想要做什么的几个选项。(是的，它也在服务器端进行了验证。)这不是一个AJAX请求，这是要求用户选择一个文件，然后上传，在此过程中javascript会
浏览 0提问于2012-03-27得票数 3
回答已采纳
2回答
是否在输入字段中以不同方式显示值而不更改值？
javascript、html
我有一个带有输入字段的应用程序，它接受美元值。我需要更改此美元值的显示方式，以便使用$和逗号格式化数字，例如，如果用户只输入5550，则为$5,550.00。我找到了这样做的方法，但这样做会导致使用这个字段的值的代码完全崩溃--它会做一堆事情，包括如果给定5,550.00美元而不是5550美元，数据库更新就会崩溃。
有一大堆底层代码，我没有权力去修复它们。
浏览 2提问于2013-04-16得票数 3
回答已采纳
1回答
为什么GWT wrap()方法不必要地迭代整个DOM？
java、html、dom、gwt
我正在使用一个定制的GWT组件，它包装了我的HTML页面中现有的文本框。这不是不必要的吗？有没有办法让它只迭代到我的组件，然后停止？
浏览 2提问于2009-07-18得票数 2
回答已采纳
1回答
将NSString中的值设置为html webview中的变量
javascript、html、ios、objective-c、uiwebview
我有一个有很多输入域的html表单。我想在Objective C代码中的html中将这个字段设置为NSString值。我知道我们可以这样设置一个值：但是如何格式化</
浏览 1提问于2016-07-22得票数 0
2回答
我可以将格式化的HTML代码作为Javascript alert()输入参数吗？
javascript、html、xhtml
我有这个simpe Javascript脚本，当点击一个链接时会显示一个弹出框： function myExample() { }我想知道是否可以在alert()函数中格式化文本。
特别是，我想知道是否(以及如何)可以将一些格式化的HTML文本作为alert()输入参数。
浏览 4提问于2013-10-06得票数 2
1回答
Oracle APEX根据用户输入格式化单元格
javascript、css、oracle-apex
我目前正在协助创建一个Oracle APEX应用程序，我的任务是能够‘使’表格中的单元格根据用户输入的内容自动更新单元格背景。例如:如果用户输入AL (年假)，则会将背景格式化为Yello，如果用户输入X，则会将单元格背景格式化为灰色。如果用户进入C(培训课程)，它会将其格式化为'peach‘
我已经在这里找到了一些指南，但没有一个是专门针对这个的，这就是为什么我决定问一个新的</
浏览 1提问于2013-07-22得票数 1
回答已采纳
2回答
xml布局的颜色字符串资源
android、android-layout、textview、android-resources
我需要调用xml TextView中的字符串。我怎么才能让它工作？不，我不想使用带有一堆TextViews的水平LinearLayout。
浏览 1提问于2014-03-02得票数 0
1回答
寻找一个好的在线所见即所得编辑器与RTF下载能力
wysiwyg、nicedit
有没有人知道有JavaScript/CSS脚本提供了一个好的所见即所得编辑器，以及将输入的信息下载到RTF文件的能力？到目前为止，我找到的唯一一个是，但我还不知道如何将格式化的文本(这是HTML格式)转换为RTF并提供下载。我已经能够将格式化的超文本标记语言存储在JavaScript变量中，但不知道如何继续。你们当中有
浏览 0提问于2013-01-11得票数 0
回答已采纳
4回答
PHP MySQL自定义博客，格式化帖子
php、mysql、formatting、blogs
我正在用PHP创建我自己的博客，我想知道你对我应该如何格式化我的帖子内容的意见。
目前，我只是将post内容存储为纯文本，必要时调用它，然后用P标记包装每一行。我这样做是为了以防将来我想改变我的文本格式的方式，这将省去我不得不从DB的帖子中删除所有P标签的两难境地。现在我的问题是这个方法是，如果我想添加额外的格式，例如列表等，这些也会被P标签包装，这是不正确的。您
浏览 3提问于2010-11-01得票数 0
回答已采纳
3回答
从超文本标记语言表单、文本区、值和帖子中制定JavaScript中的JSON？
javascript、html、json
我想有一个HTML表单，张贴以下内容在一个Http-request主体。{ “info” : { “text1” : <comes from html text-box>所以，我想要的是将上面的内容格式化为一个JavaScript对象，然后在提交时发布这个JavaScript对象。“text1”的值将来自用户输入，这将是一个html格式的文本区域
浏览 2提问于2013-02-15得票数 2
回答已采纳
2回答
如何使用Javascript来处理表单数据&显示单独的结果页面？
javascript、jquery、html
我正在重写一个大型的web表单，它使用Perl Dancer和Template Toolkit来处理提交的表单数据并显示结果页面。我想放弃模板工具包和舞者，转而采用Javascript专用的解决方案。我如何编写表单将所有数据传递给Javascript，并让它在一个良好的格式化结果页面上显示数据？
浏览 6提问于2015-10-04得票数 0
回答已采纳
8回答
VS代码中的EJS格式化
formatting、visual-studio-code、ejs
目前我不能自动格式化我的代码，当我在一个EJS文件，没有自动缩进工作。当我将右下角的文件类型更改为HTML时，它会认为标记无效并中断。有没有人有建议？
浏览 7提问于2017-07-13得票数 7
1回答
页面加载时Quill编辑器中的格式化文本
javascript、multiline、heredoc、quill
我有一个我认为应该非常简单的问题。如何在页面加载时将格式化的多行字符串放入quill编辑器？我想使用quill编辑器让用户输入json，但是当用户第一次访问页面时，我希望在quill字段中有特定的json。但是，我似乎不能以任何特定的方式格式化json。将json粘贴到HTML本身显然会占用所有空白，而且我在javascript中使用任何类型的多行字符串都没有成功
浏览 4提问于2017-08-17得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
