function setShow(val_param,text){

    var ul = document.getElementById("copyhere");

    //<li><input name="ytname_cp" type="checkbox" value="bhsc"/> 百货商场</li>//我想要追加的代码效果

    var li         = document.createElement("li");

    var input     = document.createElement("input");

    　　input.setAttribute("type", "checkbox");

    　　input.setAttribute("name", "ytname_cp");

    　　input.setAttribute("value", "val_param");

　　
　　 li.insertAdjacentHTML("beforeend", text);

    li.insertAdjacentHTML("afterbegin", '<input name="Fruit" type="checkbox" >');

    //li.appendChild(input); //这句话能追加元素，但不能调整位置

    ul.appendChild(li); 

}

</script>

以下是两种追加代码的位置显示效果，

代码1：
li.appendChild(input); //这句话能追加元素，但不能调整位置
代码2：
li.insertAdjacentHTML("afterbegin", '<input name="Fruit" type="checkbox" >')

位置代码4个参数

 <html>

  <head>

  <title>24.htm insertAdjacentHTML插入新内容</title>

  <script language="jscript">

  function addsome()

  {

      document.all.paral.insertAdjacentHTML("afterBegin","<h1> 在文本 前容器内 插入内容2</h1>");

      document.all.paral.insertAdjacentHTML("beforeEnd","<h2> 在文本 后容器内 插入内容3</h2>");

      document.all.paral.insertAdjacentHTML("beforeBegin","<h4> 在文本 前容器外 插入内容1</h1>");

      document.all.paral.insertAdjacentHTML("afterEnd","<h5> 在文本 后容器外 插入内容4</h2>");

  }  

 </script>

  </head>

  <body onload="addsome()">

  <div id="paral" style="fontsize:6;color='#ff00ff'" mce_style="fontsize:6;color='#ff00ff'">原来的内容</div><hr>

  </body>

  </html>

js追加元素，以及元素位置的更多相关文章

  1. js追加子元素

    在页面加载完毕后,向div元素追加span子元素 <html><head><title>js</title><script type=" ...

  2. js追加元素

    直接运行 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  3. 找到你的位置（JS在页面中的位置）最常用的方式是在页面中head部分放置<script>元素，浏览器解析head部分就会执行这个代码，然后才解析页面的其余部分

    找到你的位置(JS在页面中的位置) 我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分. 放在<head>部分 最常用的方式是在页 ...

  4. 深入学习jQuery元素尺寸和位置操作

    × 目录 [1]尺寸设置 [2]位置设置 前面的话 对于javascript来说,元素尺寸有scroll.offset.client三大属性,以及一个强大的getBoundingClientRect( ...

  5. selenium自动化之js处理滚动条和元素聚焦

    selenium并不是万能的,有时候页面上操作无法实现的,这时候就需要借助JS来完成了. 当我们页面上的元素超过一屏后,想操作屏幕下方的元素,是不能直接操作的,会报元素不可见异常的.这时候需要借助滚动 ...

  6. JS数组去掉重复元素

    JS数组去掉重复元素,这里提供3中写法. var arr =[1,2,3,4,5,6,3,4,7,2,4,1,8]; 输出:[1,2,3,4,5,6,7,8]; 1.使用indexOf() arr.i ...

  7. JS动态生成的元素，其对应的方法不响应（比如单击事件，鼠标移动事件等）

    主要原因:在页面给元素注册点击事件的时候[ $(function () {  XXX }); ],JS动态生成的元素还尚未生成,所以click事件就没有生效 解决方法: 方案一:js动态生成元素后再给 ...

  8. js，jq新增元素 ，on绑定事件无效

    在jquery1.7之后,建议使用on来绑定事件. $('.upload a').on('click',function(){ $(this).remove(); }) 在DOM渲染的时候,也就是ht ...

  9. JS魔法堂：元素克隆、剪切技术研究

    一.前言 当需要新元素时我们可以通过 document.createElement 接口来创建一个全新的元素,也可以通过克隆已有元素的方式来获取一个新元素.而在部分浏览器中,通过复制来获取新元素的效率 ...

  10. 单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中

    单个未知大小图片在div里面垂直居中的方法...添加辅助元素挤一下位置达到居中   <div class="ServicesLiTopPic"> <i>&l ...

随机推荐

  1. Java的final关键字详解

    Java中的final关键字非常重要,它可以应用于类.方法以及变量.这篇文章中我将带你看看什么是final关键字?将变量,方法和类声明为final代表了什么?使用final的好处是什么?最后也有一些使 ...

  2. 基于FreeBSD 64位内核的kFreeBSD无法在Virtualbox下安装

    ArchBSD同上 感谢大A(豆瓣)的投稿 :)

  3. 才知道百度也提供了智能DNS服务 - 加速乐

    http://jiasule.baidu.com/ 智能DNS 依托百度多年积累的高精度DNS识别库,平均只需5秒全球DNS服务器全部生效,百度蜘蛛1秒生效.抗攻击.无限解析记录,免费支持电信.联通. ...

  4. PowerDesigner工具箱(palette)如何打开

    我使用的PowerDesigner是15.1版本的,其他版本的操作可能会有所不同 我们在使用PowerDesigner的时候,有时候可能会不小心把悬浮的工具箱隐藏掉,就是下面这个东西 怎么显示出来呢, ...

  5. [moka同学笔记]yii2.0表单的使用

    1.创建model   /biaodan.php <?php /** * Created by PhpStorm. * User: moka同学 * Date: 2016/08/05 * Tim ...

  6. bootstrap 学习片段

    1. 只要单击按钮添加了data-toggle="dropdown"属性, 在单击按钮的时候,默认隐藏的下拉列表就会显示出来 <div class="row&quo ...

  7. ahjesus fstab修改错误了如何修复

    fstab修改错误了如何修复   当你不小心把磁盘表输入错误以后,系统总是让你按ctrl+D重新启动或者输入密 码进入shell,你输入密码登陆后,   编辑文件是只读的,执行下面的命令后就可以编辑了 ...

  8. linux压缩和解压命令总结

    一.tar.gz tar -xzvf 二.tar.bz2 tar.bz2 解压命令 bzip2 -d  gcc-4.1.0.tar.bz2---上面解压完之后执行下面的命令.执行成功后,会解压生成一个 ...

  9. PHP json编码遇到的问题

    今天遇到了json编码解码之后中文消失的问题,一探究竟,写下这篇文章 PHP中提供了json_encode  和json_decode 这对函数 将PHP中 值转化成 字符串,但是遇到中文的时候,很容 ...

  10. Web网站数据”实时”更新设计

    请注意这个实时打上了双引号,没有绝对的实时,只是时间的颗粒不一样罢了(1ms,1s,1m). 服务器数据有更新可以快速通知客户端.Web 基于取得模式,而服务器建立大量的和客户端连接来提供数据实时更新 ...