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. ExtJs特点、优缺点及注意事项

    摘自:ExtJs特点.优缺点及注意事项 1.什么是ExtJs?ExtJS可以用来开发RIA也即富客户端的AJAX应用,是一个用javascript写的,主要用于创建前端用户界面,是一个与后台技术无关的 ...

  2. 查询自己电脑的IP

    1.怎样查询电脑的IP 1)运用dos命令 在运行窗体上输入cmd,进入dos命令窗体,输出ipconfig/all命令,找到自己的IP地址 上面所圈出的就是本机IP地址 2) 进入“网络和共享中心” ...

  3. 不可或缺 Windows Native (8) - C 语言: 结构体,共用体,枚举,类型定义符

    [源码下载] 不可或缺 Windows Native (8) - C 语言: 结构体,共用体,枚举,类型定义符 作者:webabcd 介绍不可或缺 Windows Native 之 C 语言 结构体 ...

  4. .net多线程的发展

    APM和EAP是在async/await之前的两种不同的异步编程模式. APM如果不阻塞主线程,那么完成通知(回调)就会执行在另外一个线程中,从而给我们更新UI带来一定的问题. EAP的通知事件是在主 ...

  5. Discuz!X3解读之类引入机制及目录结构

    实例: - /source/class/table/table_forum_faq.php - /source/class/model/model_forum_post.php - /source/p ...

  6. java事务理解

    还在学Hibernate,后续一大堆概念刚接触需要理解.觉得-——事务——这个概念不是很好理解,所以发上来记录一下. 首先说点千篇一律的东西.概念和特性都是随处可见的,无论哪里都很容易找到,关键是你如 ...

  7. 如何利用ArcGIS Engine接口实现打开Raster Catalog中的某一幅指定的影像?

    将IRasterCatalog转化为ITable,然后通过ITable.GetRow返回指定索引的IRow,将IRow转为IRasterCatalogItem,进而获取IRasterCatalogIt ...

  8. Engine中执行gp工具返回的要素图层如何获取?

    来自:http://zhihu.esrichina.com.cn/?/question/12087 Engine中执行gp工具返回的[解决办法]:需要用gpUtils.DecodeFeatureLay ...

  9. CSS标签选择器(二)

    一.CSS选择器概述 1.1.CSS功能 CSS语言具有两个基本功能:匹配和渲染 当浏览器在解析CSS样式时,首先应该确定哪些元素需要渲染,即匹配哪些HTML元素,这个操作由CSS样式中的选择器负责标 ...

  10. Mac搭建本地svn服务器,并用Cornerstone连接服务器

    Mac默认已经安装了svn,我们只需要进行配置并开启就可以了 首先我们可以验证一下是否安装了svn,打开终端,输入命令 svnserve --version 这里可以看到目前svn的版本号,说明已经安 ...