问题：关于坛友一个获取text内容并改变样式的实现

小咪咪 2022-08-12 00:24 92阅读 0赞

需求：点击button获得input框中选中的内容，让选中的内容变红，

实现：代码如下

1: <!DOCTYPE HTML>

2: <html>

3:     <head>

4:         <meta http-equiv="content-type" content="text/html;charset=utf-8">

5:         <title>Test</title>

6:     <style type="text/css">

7:         div{

8:           display: none;

9:         }

10:     </style>

11:     </head>

12:     <body>

13:     <input type="text" id="txt" value="" />

14:     <input type="button" value="获取文本框内的值" id="btn" οnclick="getText();"/>

15:     <div id="showText">

16:

17:     </div>

18:     <script type="text/javascript">

19:       function getText () {

20:         var showText = document.getElementById("showText");

21:         showText.style.display = "block";

22:         showText.style.color = "red";

23:         showText.innerHTML=document.getElementById("txt").value;

24:       }

25:     </script>

26:     </body>

27: </html>

效果：

![SouthEast][]

若你有更好的方法，欢迎交流。不足之处，敬请谅解。

来源：[http://www.ido321.com/539.html][http_www.ido321.com_539.html]

[SouthEast]: /images/20220810/367e72b440e24338b254b0c116e094d3.png
[http_www.ido321.com_539.html]: http://www.ido321.com/539.html

发表评论取消回复

表情：

评论列表（有 0 条评论，92人围观）

还没有评论，来说两句吧...

相关阅读

相关关于深度改变组件样式不生效问题

在使用antd或element-ui需要改变组件样式时，一般情况下，会采用深度改变组件样式的写法。如果是css,一般采用>>>的写法，示例如下：前面的类一般是后面

浅浅的花香味﹌/ 2022年09月03日 07:26/ 0 赞/ 263 阅读

相关关于坛友的一个布局问题的解答

来源：[http://www.ido321.com/1147.html][http_www.ido321.com_1147.html] 需求：让select、ul、文字

太过爱你忘了你带给我的痛/ 2022年08月13日 15:59/ 0 赞/ 117 阅读

相关问题：关于一个坛友的html布局实现

来源：[http://www.ido321.com/888.html][http_www.ido321.com_888.html] 坛友的需求如图 ![SouthEa

骑猪看日落/ 2022年08月13日 00:35/ 0 赞/ 104 阅读

相关问题：关于贴友分类菜单的实现

来源：[http://www.ido321.com/868.html][http_www.ido321.com_868.html] 贴友需求，实现图示菜单的分类

Bertha 。/ 2022年08月12日 21:29/ 0 赞/ 66 阅读

相关问题：关于一个贴友的js留言板的实现

需求：用js做一个简单的留言板效果 html部分： 1: <!DOCTYPE> 2: <html lang="zh-en"> 3: <head>

末蓝、/ 2022年08月12日 01:17/ 0 赞/ 99 阅读

相关问题：关于坛友的一个定时重复显示和隐藏div的实现

需求：打开页面只看到DIV2，等完秒数之后在显示DIV3。手动关闭DIV3后在重新数秒我设置的间隔时间是3秒，代码如下： html+css: 1: <!DOCT

缺乏、安全感/ 2022年08月12日 01:08/ 0 赞/ 92 阅读

相关问题：关于坛友一个获取text内容并改变样式的实现

需求：点击button获得input框中选中的内容，让选中的内容变红，实现：代码如下 1: <!DOCTYPE HTML> 2: <html>

小咪咪/ 2022年08月12日 00:24/ 0 赞/ 93 阅读

相关问题：关于贴友的一个书本页面简单布局（html+css）的实现

贴友需求：以html+css仿照书本的页面实现布局效果（见图） ![SouthEast][] html代码： 1: <!-- 我的博客：http://www

ゝ一纸荒年。/ 2022年08月12日 00:22/ 0 赞/ 81 阅读

相关问题：关于坛友的一个js轮播效果的实现

![SouthEast][] 需求：点击向前按钮进行向前翻页，向后按钮进行向后翻页，点击中间蓝色小圆圈可以来回自由切换我的大概思路：先默认显示一个div 然后在原位置在

怼烎@/ 2022年08月12日 00:19/ 0 赞/ 91 阅读

相关问题：贴友关于CSS效果的实现

今日在百度贴吧中，一贴有提出如下问题： ![SouthEast][] 对于这个问题，咱们贴上代码看效果 1: <html> 2: <head>

叁歲伎倆/ 2022年08月12日 00:18/ 0 赞/ 77 阅读