<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> </head> <body> <div> </div> <input type="text"/> <input type="button" value="添加" /> </div> <div> <ul> <li>红烧肉</li> <li>红烧肘子</li> <li>红烧鱼</li> </ul> </div> <script> var inp_aa = document.getElementsByClassName('aa'); inp_aa[0].value = '红烧带鱼';//相当于在输入框输入内容 </script> </body> </html>
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> </head> <body> <div> </div> <input type="text"/> <input type="button" value="添加" /> </div> <div> <ul> <li>红烧肉</li> <li>红烧肘子</li> <li>红烧鱼</li> </ul> </div> <script> var c = document.querySelector('.aa');//查询选择器 .是区别id，标签的语法 c.value = '红烧茄子'; </script> </body> </html>
方法二：查询
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> </head> <body> <div> </div> <input type="text"/> <input type="button" value="添加" /> </div> <div> <ul> <li>红烧肉</li> <li>红烧肘子</li> <li>红烧鱼</li> </ul> </div> <script> var c = document.getElementById('aa'); c.value = '红烧茄子'; </script> </body> </html>
方法三：id
案例六：
//'beforeBegin'、'afterBegin'\ 'beforeEnd'\'afterEnd'