<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>无标题文档</title>
        <script>
        function addt(){
//获取文本输入框中的内容
var text1=document.getElementById("t").value;
//获取到Ul列表
var ul=document.getElementById("u");
//创建元素Li
var li=document.createElement("li");
//向li中添加内容
li.innerHTML=text1;
//向ul追加元素li
ul.appendChild(li);

}
        
        </script>
    </head>
    
    <body>
    <ul id="u">
        
        </ul>
        <input type="text" id="t"/><!--文本输入框-->
        <input type="button" value="添加" onClick="addt()"/><!--添加按钮-->
        
                                                                
</body>

</html>

如果你想让字体有颜色,在输入框内输入:<font color="#FF0000">这里写你想要内容</font>

ul或者ol中添加li元素的更多相关文章

  1. 在for、foreach循环体中添加数组元素

    在开发工作中遇到这样一种情形,需要在循环体中动态向遍历中的数组添加元素并在当前循环遍历中使用数组的全部元素. 首先使用foreach循环来遍历数组,将代码简化抽象如下: $arr = array(1, ...

  2. Java 向数组中添加一个元素

    方法 一般数组是不能添加元素的,因为他们在初始化时就已定好长度了,不能改变长度. 向数组中添加元素思路: 第一步:把 数组 转化为 集合 list = Arrays.asList(array); 第二 ...

  3. js在页面中添加一个元素 —— 添加弹幕

    参考地址 [往下拉 —— 使用HTML DOM appendChild() 方法实现元素的添加 ] 一.创建 HTML <div class="right_liuyan"&g ...

  4. 在NSMutableArray中添加空元素:NSNull类的使用

    有时需要将一些表示“空”的对象添加到array中.NSNull类正是基于这样的目的产生的.用NSNull表示一个占位符时,语句表达如下: [array addObject:[NSNull null]] ...

  5. 请把<ul><li>第1行</li><li>第2行</li>...</ul>(ul之间有10个li元素)插入body里面,注意:需要考虑到性能问题。

    var html = [],i;for(i = 0; i < 10; i++){ html.push('<ul><li>第' + (i+1) + '行</li> ...

  6. python 在列表中添加元组元素,按照元组第一个值进行排序

    >>> import bisect >>> scores = [(, , , , 'python')] >>> bisect.insort(sco ...

  7. JavaScript向select下拉框中添加和删除元素

    JavaScript向select下拉框中添加和删除元素 1.说明 a   利用append()方法向下拉框中添加元素 b   利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...

  8. h5中的结构元素header、nav、article、aside、section、footer介绍

    结构元素不具有任何样式,只是使页面元素的的语义更加明确. header元素 header元素是一种具有引导和导航作用的的结构元素,该元素可以包含所有通常放在页面头部的内容.header元素通常用来放置 ...

  9. 在web.config配置中添加xml内容

    在web.config 中添加需要的内容时, 就是在<configuration>节点内添加一个新的<configSections>元素, 在configSections元素中 ...

随机推荐

  1. 通过javascript的日期对象来得到当前的日期,并输出--内置对象---JS

    //通过javascript的日期对象来得到当前的日期,并输出. var mydate = new Date(); var week = ["星期日","星期一" ...

  2. Unity 3D-AR开发-Vuforia教程手册

    Unity 开发AR之 Vuforia 本文提供全流程,中文翻译. Chinar 坚持将简单的生活方式,带给世人!(拥有更好的阅读体验 -- 高分辨率用户请根据需求调整网页缩放比例) Chinar - ...

  3. 打开视图 :1449 - the user specified as a definer ('root'@'%')does not exist

    从一个数据库数据迁移到本地localhost   程序在调用到数据库的视图时报错,直接在数据库中打开视图时也报错,类似:   mysql 1449 : The user specified as a ...

  4. {"errcode":48001,"errmsg":"api unauthorized}

    微信公众号基础知识说明 网页授权获取微信用户信息:两种 scope 域 https://open.weixin.qq.com/connect/oauth2/authorize?appid={0}&am ...

  5. djangorestful framework (三)学习

    十.分页器 -简单分页: -from rest_framework.pagination import PageNumberPagination -生成一个对象 -调用对象的.page.paginat ...

  6. torchvision库简介(翻译)

    部分跟新于:4.24日    torchvision 0.2.2.post3 torchvision是独立于pytorch的关于图像操作的一些方便工具库. torchvision的详细介绍在:http ...

  7. get android or ios appname

    get app name from GP or itunes var superagent = require('superagent'); var cheerio = require('cheeri ...

  8. List接口的使用方法

    ★List接口特点: 1.元素存储有序的集合 2.带索引的集合 3.集合中可以有重复的元素 4.常用的子类有ArrayList ,  LinkedList ★List接口的方法:add   , rem ...

  9. Replicated Ship 本地 kubernetes 环境试用

    关于介绍可以参考 https://github.com/replicatedhq/ship 或者我写的一个比较简单的demo https://www.cnblogs.com/rongfengliang ...

  10. 在sorted range上的操作(includes,set_union,set_intersection,set_difference)

    includes //版本一:用operator <比较元素 template <class InputerIterator1,class InputerIterator2> boo ...