<!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. Pacman命令介绍

    用pacman很久了,一直没有深入去研究到底它包含多少神秘的力量,每次都是pacman -Syu就简单的把所有升级更新问题搞定实在是让笔者懒惰了很多.不过也正是因为pacman的简单让笔者爱不释手,同 ...

  2. JavaBasic_05

    方法 简述:实现特定功能的代码块 格式 修饰符: 返回值类型 方法名(参数类型 参数名1,参数类型 参数名2…){           函数体;           return 返回值;} 方法格式 ...

  3. golang 六宫格、九宫格头像生成

    图片示例就不传了,在原WordPress上. //Merge6Grid 6宫格 //rule NO1:至少3张图 最多6张图 // NO2:第一张大小 60*60 其他大小 28*28 间隔4px 合 ...

  4. 人工智能之KNN算法

    转载自:https://www.cnblogs.com/magic-girl/p/python-kNN.html 基于python实现的KNN算法 邻近算法(k-NearestNeighbor) 是机 ...

  5. 【杭电OJ3938】【离线+并查集】

    http://acm.hdu.edu.cn/showproblem.php?pid=3938 Portal Time Limit: 2000/1000 MS (Java/Others)    Memo ...

  6. Redux 学习笔记

    1:首先安装redux: npm install --save redux 2:引入redux : import { createStore } from 'redux'; //首先创建执行函数,Re ...

  7. 小D课堂【SpringBoot】接口Http协议开发实战

    ---恢复内容开始--- ====================2.SpringBoot接口Http协议开发实战 ============================= 1.SpringBoot ...

  8. 【点击项目属性】Target runtime Apache Tomcat v7.0 is not defined

    这个项目是去年用同一个eclipse做的,但是今年原封不动导入的时候,确发现这个东西 tomcat选成我们本地的tomcat8就可以了 泼菲解决.

  9. SQL相关语句

    1.分类 数据定义语言(DDL),用来定义数据库.表 列 ,用到的关键字:create.alter.drop. 数据操作语言(DML),数据库进行更行的操作, insert.delete.update ...

  10. SQLyog中创建数据表及相关查询方法

    USE du; /*1.创建账务表 id name mony*/ CREATE TABLE zhangwu(id INT PRIMARY KEY AUTO_INCREMENT, sname VARCH ...