jqueryDOM操作

 1.  页面加载  函数

  $(

         function(){

           具体内容

          }

       );
 
     表示页面加载函数
 
2  dom 类操作
  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容（包括 HTML 标记）
  • val() - 设置或返回表单字段的值
  • ★★★★★设置参数变量等时候  var=" 内容"    内容如果换行书写
  • 需要写成var=" 内容很长"+
                                                                                                   "  拼接起来 "  ;                           --------否则无法编译
;$("#btn1").click(function(){

    $("#test1").text("Hello world!");

});          #选择test匹配的id元素  改变元素内的text 属性  元素本身不改变

$("#btn2").click(function(){

    $("#test2").html("<b>Hello world!</b>");

});       #选择test2匹配的id元素  改变元素内的整体 html 属性   元素本身不改变  类似插入  




$("#btn3").click(function(){ $("#test3").val("RUNOOB"); });


　　　　　　 #选择test3匹配的id元素  改变元素内的整体 value 属值 (如果有才生效)   元素本身不改变  类似改变值update 






设置属性




设置单个属性
----------------------------------------------------------->

<script>

$(document).ready(function(){

  $("button").click(function(){

    $("#runoob").attr("href","http://www.runoob.com/jquery");

  });

});

</script>

----------------------------------------------------------->

<body>

<p><a href="http://www.runoob.com" id="runoob">菜鸟教程</a></p>

<button>修改 href 值</button>

<p>点击按钮修改后，可以点击链接查看链接地址是否变化。</p>

</body>






设置多个属性   .attr  后面用大括号 ({ ,})  中间类似键值对  冒号:对应      用逗号,分割


$("button").click(function(){

    $("#runoob").attr({

        "href" : "http://www.runoob.com/jquery",

        "title" : "jQuery 教程"

    });

});




$("p").append("追加文本");




$("p").append("追加可以设置 'html值 '");    p标签内部元素后添加  追加内容




												


											
笔记  前端的$dom操作的更多相关文章
	

    
								
  1. HTML 学习笔记 JQuery（DOM 操作）
		
    一般来说,DOM操作分为三个方面,即:DOM Core(核心), HTML_DOM 和 CSS_DOM. 1.DOM Core DOM Core 并不专属于JavaScript,任何一种支持DOM的程 ...
    
		
    2. 
						
  2. 5月16日上课笔记-js中DOM操作
		
    一.DOM操作 DOM节点的操作 增加 删除 修改 节点的信息: nodeName 获取节点的标签名 parentNode 获取父节点 childNodes IE忽略回车换行,chrome回车换行是文 ...
    
		
    3. 
						
  3. 课堂笔记--------JavaScript 的DOM操作
		
    1.DOM的基本概念 DOM是文档对象模型,这种模型为树模型:文档是指标签文档:对象是指文档中每个元素:模型是指抽象化的东西. 2.Window对象操作 一.属性和方法: 属性(值或者子对象): op ...
    
		
    4. 
						
  4. 前端学习笔记之HTML DOM操作
		
    HTML DOM 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model).   DOM节点类型 文档节点 (document,唯一) 元素节点 (那些个标签div ...
    
		
    5. 
						
  5. 前端之DOM操作
		
    一.概念 javascript javascript是一种脚本语言,可以被浏览器解析,所以它可以称之为前端的三把利器之一. javascript跟java没有半毛钱关系. 声明局部变量:使用关键字va ...
    
		
    6. 
						
  6. HTML 学习笔记 JQuery（DOM 操作2）
		
    接着上一节的将,这一节从复制节点讲起 复制节点 继续使用之前的例子 如果单击<li>元素后 需要在复制一个<li>元素,可以使用clone()方法完成.全部代码如下 <h ...
    
		
    7. 
						
  7. JavaScript学习笔记系列2:Dom操作(一)
		
    一.什么是Dom? DOM------>Document Object Model 直接翻译就是文档对象模型. DOM------>定义了表示和修改文档所需的对象.这些对象的行为和属性以及 ...
    
		
    8. 
						
  8. HTML 学习笔记 JQuery（DOM 操作3）
		
    设置和获取HTML 文本 和 值 1.html()方法 类似于JavaScript中的innerHTML属性,可以用来读取或者设置某个元素中的HTML内容 例子 <html> <he ...
    
		
    9. 
						
  9. 【前端】DOM操作
		
    1 什么是DOM 全称 Document Object Model 文档对象模型. 一个web页面的展示,是由html标签组合成的一个页面,dom对象实际就是将html标签转换成了一个文档对象.可以通 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Hadoop集群安装压缩工具Snappy，用于Hbase
			
    最近项目中要用到Hadoop和Hbase,为了节省服务器的存储成本,并提高吞吐,安装并开启HBase的数据压缩为Snappy. 主流的HBase压缩方式有GZip | LZO | Snappy,Sna ...
    
			
    2. 
						
  2. linux硬件驱动
			
    今天被问到了一个新问题:linux需不需要安装驱动,就像windows装完系统之后需要安装最新驱动一样? 说实话以前真没想过,都是装完系统update一下就直接用了. 谷歌了一下,发现其实也是需要安装 ...
    
			
    3. 
						
  3. 阿里P8架构师谈：Restful、SOAP、RPC、SOA、微服务之间的区别（转载）
			
    转载来源:https://youzhixueyuan.com/the-difference-between-restful-soap-rpc-soa-and-micro-service.html 内容 ...
    
			
    4. 
						
  4. D3学习之坐标系绘制
			
    坐标轴的绘制我们需要搞清楚以下三个要点: 1).axis函数 2)..call()函数用于组合 3).坐标轴的平移旋转 关于第三点其实就是"transform","tra ...
    
			
    5. 
						
  5. 【Adobe Air程序开发】eclipse安装flash builder 4.7插件以及java、flex整合开发
			
    看了看网上不少文章,发现很多内容都是很老的,没法用.故把自己的安装过程记录下来,方便以后使用 1.在这里,eclipse使用最新版eclipse juno 3.7 2.在adobe官网https:// ...
    
			
    6. 
						
  6. 【并行计算-CUDA开发】CUDA bank conflict in shared memory
			
    http://hi.baidu.com/pengkuny/item/c8070b388d75d481b611db7a 以前以为 shared memory 是一个万能的 L1 cache,速度很快,只 ...
    
			
    7. 
						
  7. 【FFMPEG】使用ffmpeg类库打开流媒体
			
    版权声明:本文为博主原创文章,未经博主允许不得转载. 使用ffmpeg类库进行开发的时候,打开流媒体(或本地文件)的函数是avformat_open_input(). 其中打开网络流的话,前面要加上函 ...
    
			
    8. 
						
  8. RestTemplateBuilder类
			
    Spring Boot使用RestTemplate消费REST服务的几个问题记录 我们可以通过Spring Boot快速开发REST接口,同时也可能需要在实现接口的过程中,通过Spring Boot调 ...
    
			
    9. 
						
  9. 阅读《C Primer Plus》收获
			
    190927 知识内容: 1.了解到C语言混乱代码大赛.评选谁的程序最有创意但又让人难以理解 2.了解最初的c语言的规则,所有编译器依照规则而设计. 3.编程前先要确定好目标对象,并且在纸上大概写出流 ...
    
			
    10. 
						
  10. 20.采集项目流程篇之清洗数据绑定到hive表中
			
    先启动hive 在mydb2这个数据库中创建表: create external table mydb2.access(ip string,day string,url string,upflow s ...
    
			
    11.