jq与js获取值操作

	<!DOCTYPE html>

	<html>

	<head>

	<meta charset="UTF-8">

	<title>jq与js获取值操作</title>

	<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>

	<script>

		$(function() {

			//jquery通过id获取值

			console.log($("#nameText").val());

			//jquery通过name获取值

			console.log($("input[name=nameText]").val());

			//jquery通过class获取值

			console.log($(".nameText").val());

			//js通过id获取值

			console.log(document.getElementById("nameText").value);

			//js通过name获取值

			console.log(document.getElementsByName("nameText")[0].value);

			//js通过class获取值

			console.log(document.getElementsByClassName("nameText")[0].value);

			/*jq获取属性*/

			var temp1 = $("#divTest").css("width");

			//alert("开始修改背景颜色");

			/*jq修改属性*/

			$("#divTest").css("background", "red");

			/*js获取属性*/

			var temp2 = document.getElementById('divTest').style.width;

			//alert("开始修改宽度");

			/*js修改属性*/

			document.getElementById('divTest').style.width = "100%";

			console.log(temp1);

			console.log(temp2);

		})

		//	/**

		//	* 拓展资料：

		//	* var returna_date = $("input[name$='returna_date']");//匹配所有name结尾为returna_date的数组

		//    *		for(var x=0; x<returna_date.length;x++){

		//    *		   alert($(returna_date[x]).val());

		//    *	     }

		//	  *	$("input[name^='news']")         选择所有的name属性以'news'开头的input元素 

		//	  *	$("input[name$='news']")         选择所有的name属性以'news'结尾的input元素 

		//	  *	$("input[name*='man']")          选择所有的name属性包含'news'的input元素 

		//	  */

		</script>

	</head>

	<body>

	<div id="divTest" style="background: gold;width: 30%;">

		<input type="text" value="任秀兴" id="nameText" name="nameText" class="nameText" />

		<input type="text" value="JavaScript" id="nameText2" name="nameText" class="nameText" />

	</div>

	</body>

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

jq与js获取值操作的更多相关文章

  1. JQ和Js获取span标签的内容

    JQ和Js获取span标签的内容 html: 1 <span id="content">‘我是span标签的内容’</span> javascript获取: ...

  2. 6、前端--DOM操作（查找标签、节点操作、获取值操作、class操作、样式操作、绑定事件、内置参数this）

    DOM操作之查找标签 前缀关键字>>>:document # 基本查找(核心) document.getElementById 根据ID获取一个标签 document.getElem ...

  3. JQ和JS获取元素

    <ul>   <li>John</li> <li>Karl</li> <li>Brandon</li> </u ...

  4. 各种组件的js 获取值 / js动态赋值

    jQuery获取Select选择的Text和Value:语法解释:1. $("#select_id").change(function(){//code...});   //为Se ...

  5. JQ和JS获取span标签的内容(有的情况下JQ达不到预期的目的就用JS)

    https://www.cnblogs.com/anniey/p/6439021.html <span id="content">‘我是span标签的内容’</s ...

  6. JS中获取和操作iframe

    一.需求与遇到的问题 在网站的后台管理中使用了iframe框架布局,包括顶部菜单.左侧导航和主页面.需求是:点击主页面上的一个按钮,在顶部菜单栏的右侧显示“退出”链接,点击可退出系统. 我的思路是:在 ...

  7. JSP中request获取值

    获取项目名:request.getContextPath(); 获取IP:request.getServerName() 获取端口:request.getServerPort() pageContex ...

  8. jq选择器（jq 与 js 互相转换），jq操作css样式 / 文本内容， jq操作类名，jq操作全局属性,jq获取盒子信息,jq获取位置信息

    jq选择器(jq 与 js 互相转换) // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取 ...

  9. java：JQuery（声明，JQ和JS对象的区别，prop，attr，addClass，offset，trigger，dblclick和change事件，hide，show，toggle，slideUp，slideDown，slideToggle，三种选择器，标签的获取，三张图片的放大与缩小）

    1.JQuery: jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计 的宗旨是“ ...

随机推荐

  1. python中函数的嵌套和作用域链

    1.三元运算if条件成立的结果 if 条件 else 条件不成立的结果例如: a=20 b=10 c=a if a>b else b print(c) 2.命名空间 全局命名空间:创建的存储“变 ...

  2. docker hub 本地镜像登录

    docker的登录信息存放在home目录下的.docker文件夹下,查看 cat ~/.docker/config.json { "auths": { "gcyimgs. ...

  3. IDEA 光标显示注释

  4. Quartz-第二篇 使用quartz框架定时推送邮件

    1.定时推送邮件,也就是使用定时调度框架触发我们的发邮件动作,发邮件动作,请参考我的这篇随笔.

  5. kmp（多次无重叠匹配）

    http://acm.hdu.edu.cn/showproblem.php?pid=2087 剪花布条 Problem Description 一块花布条,里面有些图案,另有一块直接可用的小饰条,里面 ...

  6. Codeforces 1105D (BFS)

    题面 传送门 分析 考虑BFS while(棋盘没有满){ for 玩家 p{ 对p进行BFS,走s[p]步 } } 对于每个玩家p BFS的时候如果到了格子(x,y),就把\(vis[x][y]\) ...

  7. Codeforces - 1194D - 1-2-K Game - dp

    https://codeforc.es/contest/1194/problem/D 打个n=30的表好像看出了规律. 其实假设k==3,那么 sg[0]=0, sg[1]=mex{sg[0]}=1, ...

  8. Codeforces - 1191E - Tokitsukaze and Duel - 博弈论 - 尺取

    https://codeforc.es/contest/1191/problem/E 参考自:http://www.mamicode.com/info-detail-2726030.html 和官方题 ...

  9. vue图片预加载

    目的: 图片预加载能够使得用户在浏览后续页面的时候,不会出现图片加载一半导致浏览不流畅的情况. 一.方法一 项目打开的时候要对图片进行预加载,在App.vue里面的beforeCreate添加预加载程 ...

  10. 01.Linux-CentOS系统网卡名称变动问题

    方法一root登陆系统1.删除原来的配置信息[root@localhost ~]# rm -f /etc/sysconfig/network-scripts/ifcfg-eth0[root@local ...