js对div取值与赋值

  • 因为JavaScript运行时，id="test1" 的那个div元素可能还没解析和加载，js加载是有顺序的。只需把 js 整个搬到 后面即可。

  • 还有一个特别容易犯的毛病，页面引入 jQuery ，如果其他 js 要使用，需要放在 jQuery 之后，否则不能使用。

  • 测试案例：

      <!DOCTYPE html>
    
  <html>
    
  <head>
    
  <meta charset="UTF-8">
    
  <script type="text/javascript" src="js/jquery.js"></script>
    
  <title>div 测试</title>
    
  </head>

  <body>
    
  <div id="id1">id1</div>
    
  <div id="id2"></div>
    
  <div id="id3"></div>
    
  <div id="id4"></div>
    
  <div id="id5" style="width: 100%;height: 500px;"></div>
    
  <div>
    
  	<!--iframe的样式是可以调整的，具体可以参考相关文档-->
    
  	<iframe src="http://www.baidu.com/" width="100%" height="500px"> </iframe>
    
  </div>

  <div class="content-wrap">
    
  	<div class="content-wrap-inner">

  	</div>
    
  </div>

  	<script>
    
  	//假设你的html中有以下的div
    
  	//如果是要获取id是id1的div的数据， 获取div里面的内容有两种方式
    
  	//1， 纯js获取数据
    
  	var a = document.getElementById("id1").innerText;
    
  	alert(a);
    
  	//2， jqeury获取数据
    
  	var a = $("#id1").html();
    
  	var b = $("#id1").text();
    
  	alert(a + "1234");
    
  	alert(b + "5678");
    
  	//3， 纯js写入数据
    
  	document.getElementById("id2").innerHTML = "id2";
    
  	//4，jqeury写入数据
    
  	$('#id3').html("id3");
    
  	$("#id4").text("id4");

  	//div 引入其他页面
    
  	//load只能引入自己内部页面
    
  	$('.content-wrap-inner').html('');
    
  	$('.content-wrap-inner').load("test.html");

  	//网址引入不进去
    
  	//$('#id5').load("http://www.baidu.com/");
    
  	$('#id5').load("test.html");
    
  	</script>
    
  	</body>
    
  </html>

  • 更多精彩内容，请关注微信关注公众号 明叶师兄的学堂

js对div取值与赋值的更多相关文章

  1. JS表自动取值赋值

    /* * * V1.0.0 表单自动取值.赋值插件 * 表单类型:text radio select-one checkbox textarea * 注意项: * 1.表单必须设置name属性 * 调 ...

  2. jQuery对html元素的取值与赋值实例详解

    jQuery对html元素的取值与赋值实例详解 转载  2015-12-18   作者:欢欢   我要评论 这篇文章主要介绍了jQuery对html元素的取值与赋值,较为详细的分析了jQuery针对常 ...

  3. [前端 2]常用的JQuery和Dom页面取值与赋值

    导读:书到用时方恨少,需要基础知识的时候,才悔恨自己没有总结学习好.前段时间调了好长时间的页面,突然发现自己之前不怎么在意的取值和赋值,真的是自己一个很薄弱的地方,有时候查半天都找不到一个对的,现在用 ...

  4. html常用标签的取值和赋值操作

    我们在html页面当中,面对各种各样的标签,经常需要处理取值和赋值的问题,下面,就把常见的一些html标签元素的取值和赋值操作进行总结整理,以后备用. 1.button:改变button按钮上面的值, ...

  5. JQuery TextArea的取值与赋值问题---(textarea中回车清空问题)——个人转载整理

    JQuery TextArea的取值与赋值问题---(textarea中回车清空问题) JQuery TextArea的取值与赋值问题 首先,说明这不是一个简单的问题! 先说取值: $("# ...

  6. jQuery 表单元素取值与赋值方法总结

    一.普通文本框的赋值与取值 1.1.1赋值 <h2>jQuery 表单元素取值与赋值方法总结</h2> <input type="text" clas ...

  7. easyui radio 类型的取值和赋值方法

    1.HTML 文件 <tr id="client_check1"> <th>委托人证件类型:</th> <td><input ...

  8. Visual Studio 2017中使用正则修改部分内容 如何使用ILAsm与ILDasm修改.Net exe(dll)文件 C#学习-图解教程(1)：格式化数字字符串 小程序开发之图片转Base64（C#、.Net） jquery遍历table为每一个单元格取值及赋值 。net加密解密相关方法 .net关于坐标之间一些简单操作

    Visual Studio 2017中使用正则修改部分内容   最近在项目中想实现一个小工具,需要根据类的属性<summary>的内容加上相应的[Description]特性,需要实现的效 ...

  9. select2多选设置select多选，select2取值和赋值

    select2设置select多选,select2取值和赋值,作为筛选条件的时候,取值相对简单,把选中的id值转为字符串传给后端查询,查询之后会刷新页面,为了在下拉框中显示刚刚选中的值,就需要给sel ...

随机推荐

  1. 12. I2C-EEPROM

    12.1. I2C 协议简介 I 2 C ( Inter-Integrated Circuit )协议是由 Phiilps 公司开发的,由于它具引脚少,硬件实现简单,可扩展性强,不需要如 USART. ...

  2. USB入门开发的八个问题&USB枚举『转』

    USB 基本知识 USB的重要关键字: 1.端点:位于USB设备或主机上的一个数据缓冲区,用来存放和发送USB的各种数据,每一个端点都有惟一的确定地址,有不同的传输特性(如输入端点.输出端点.配置端点 ...

  3. Chrome-逆向分析JS-2获取发送请求位置（以datatables获取表格数据为例）

    剧透:就是使用了一下 Chrome Source 的 XHR/fetch Breakpoints 功能,在发送请求时在该行进入断点调试. # 一:不认识一下 XHR/fetch Breakpoints ...

  4. UVA1629_Cake slicing

    Cake slicing 给你一个矩形大小,和每个樱桃的坐标,现在让你去切使得切之后的小矩形包含一个樱桃,每次切的代价是切痕的长度,问你最小代价是多少 思路: 首先要明白一点,不能切除一个不含樱桃的矩 ...

  5. 浅析java设计模式(一)----异构容器,可以存储任何对象类型为其他类提供该对象

    最近在着手重构一个java UI桌面项目,发现这个项目在一开始的时候由于需求不明确,以及开发人员对swing框架不熟悉等问题造成了页面代码混乱的情况:为了能够在各个类里都可以拿到其他类的引用去进行相应 ...

  6. Python字符串前缀

    1,r/R表示raw string(原始字符串) #!/usr/bin/python str1 = 'hello \n world' str2 = r'hello \n world' print(st ...

  7. Codeforces 500C New Year Book Reading

    C. New Year Book Reading time limit per test 2 seconds memory limit per test 256 megabytes input sta ...

  8. HDU 6464 /// 权值线段树

    题目大意: 共Q次操作 操作有两种 操作一 在序列尾部加入f[i]个s[i] 操作二 查询序列第f[i]小到第s[i]小之间的总和 离线操作 把序列内的值离散化 然后利用离散化后的值 在线段树上对应权 ...

  9. 逃脱 (简单BFS）

    题目传送门 G逃脱  题目描述 这是mengxiang000和Tabris来到幼儿园的第四天,幼儿园老师在值班的时候突然发现幼儿园某处发生火灾,而且火势蔓延极快,老师在第一时间就发出了警报,位于幼儿园 ...

  10. Docker 清理容器 log 日志

    原文 Docker 清理容器 log 日志 docker logs <容器ID> 是常用命令,来查看容器运行日志,但时间长了之后,就会发现越来越慢,log 太多了,这时就需要清理一下. 先 ...