<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>如何创建Search字段</title>

    <script>

    window.onload=function () {

        // 获取button元素

        document.getElementsByTagName("button")[0].onclick=function () {

            // 创建input元素赋值给x

            var x = document.createElement("INPUT");

            // 给input元素设置type属性

            x.setAttribute("type", "search");

            // 将x元素追加到元素span中

            document.getElementsByTagName('span')[0].appendChild(x);

        }

    }

    </script>

</head>

<body>

    <button>点击创建Search字段</button>

    <div style="width: 600px; height: 200px; background-color:lightgreen;">

        <p>

            请输入搜索字段:

            <span></span>

        </p>

    </div>

</body>

</html>

JavaScript 如何创建search字段的更多相关文章

  1. JavaScript演示如何访问Search字段

    <!DOCTYPE html> <html> <body> <h3>演示如何访问Search字段</h3> <input type=& ...

  2. SAP不同的产品是如何支持用户创建自定义字段的

    我们从SAP CRM,Cloud for Customer(简称C4C)和S/4HANA这三个产品分别来看看. SAP CRM 我们使用所谓的Application Enhancement Tool( ...

  3. JavaScript中创建类，赋值给ajax中的data参数

    缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) d ...

  4. JavaScript中创建字典对象（dictionary）实例

    这篇文章主要介绍了JavaScript中创建字典对象(dictionary)实例,本文直接给出了实现的源码,并给出了使用示例,需要的朋友可以参考下 对于JavaScript来说,其自身的Array对象 ...

  5. Hibernate 注解 没有加@Column一样会在数据库创建这些字段

    Hibernate 注解 没有加@Column一样会在数据库创建这些字段 如下一个注解类: package com.hyy.hibernate.one_to_many.domain; import j ...

  6. SharePoint Search之(一):创建Search服务应用程序

    计划写一个关于怎样使用SharePoint Search的系列,包括下面几个方面: (一)创建Search Service Application (二)持续爬网(continues crawl) ( ...

  7. 简单使用JSON,JavaScript中创建 JSON 对象(一)

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更易解析. ...

  8. Django之集合函数使用与mysql表的创建特殊字段分析

    1. 集合函数的使用场景: -- 单独使用: 不分组, 只查聚合结果 -- 分组使用: 按字段分组, 可查询分组字段与聚合结果 2. 导入聚合函数 from django.db.models impo ...

  9. JavaScript Cookies,创建,获取cookies value

    什么是cookie? cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScript 来创建和取回 cookie ...

随机推荐

  1. Visual Studio开启SSL的支持

    前提: 请确保已经安装了IIS Express 具体操作: 1.web项目->[右键]->[使用IIS Express]转换工程的Web服务器. 2.点击web项目,按[ctrl]+[w] ...

  2. 开启KindEditor代码高亮功能

    KindEditor4.0 开始支持插入代码功能!!!如何使用插入代码功能实现前段页面代码高亮显示和后台代码维护显示!!! 1. 需要高亮显示代码的前台页面需要引用相应的css样式和js文件 < ...

  3. CSS属性clip

    http://blog.sina.com.cn/s/blog_68a1582d0100kp59.html CSS属性中有个裁剪属性clip,其实我对这个属性一点都不感冒,因为我感觉它好像没啥用处,但是 ...

  4. Youtube深度学习推荐系统论文

    https://static.googleusercontent.com/media/research.google.com/en//pubs/archive/45530.pdf https://zh ...

  5. HTML5 Canvas 绘制新西兰国旗

    代码: <!DOCTYPE html> <html lang="utf-8"> <meta http-equiv="Content-Type ...

  6. vue sync

    1.使用vue cli建立工程 2.在APP.vue中: <template> <div class="details"> <myComponent ...

  7. 成都传智播客Java/PHP培训就业率高

    依据传智播客的数据统计,传智播客的学员有五分之中的一个的能在毕业前找到惬意的工作,一半的学员能在毕业后一个月之内找到惬意的工作,一般在毕业后两个月之内绝大多数同学都能找到惬意的工作.而且传智播客毕业学 ...

  8. json和jsonp以及ajax

    简单的说: JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后 ...

  9. IDEA------Error:java:无效的目标发行版:1/7

    © 版权声明:本文为博主原创文章,转载请注明出处 使用IDEA发布java web项目时,报错.报错信息如下: 解决方案: 方案一:File-->Settings-->Build,Exec ...

  10. 底部TabsFooter

    Demo简单描述:点击底部菜单可切换页面,并且底部为共用. 这个是在设置好导航Navigator之后进行的步骤,只是我个人进行Tab切换的一种思路方法,或许不是最好的,仅供参考一下. 首先我们需要一个 ...