<!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=" 600px; height: 200px; background-color:lightgreen;"> <p> 请输入搜索字段: <span></span> </p> </div> </body> </html>