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. Learning OSG programing---osgShape

    本例示范了osg中Shape ---- 基本几何元素的绘制过程.参照osg官方文档,Shape 类包含以下子类: 在示例程序中,函数createShapes函数用于生成需要绘制的几何形状. osg:: ...

  2. Interface-接口的实现与注意事项

    package cn.learn.Interface; public interface MyInterfaceA { public abstract void methodA(); public a ...

  3. 32.Group Anagrams（相同元素的不同组合）

    Level:   Medium 题目描述: Given an array of strings, group anagrams together. Example: Input: ["eat ...

  4. gulp run 报错 gulp[3192]: src\node_contextify.cc:628: Assertion `args[1]->IsString()' failed.

    由于把node升级到了10以上的版本 执行gulp rjs打包文件报错,错误如下: gulp[3192]: src\node_contextify.cc:628: Assertion `args[1] ...

  5. NGUI的拖拽和放下功能的制作，简易背包系统功能（drag and drop item）

    一我们添加sprite,给sprite添加背景图片和添加box collider,但是drag and drop item在attach中是找不到的只能在add component中查找添加,如下图: ...

  6. Solr的学习使用之（三）IKAnalyzer中文分词器的配置

    1.为什么要配置? 1.我们知道要使用Solr进行搜索,肯定要对词语进行分词,但是由于Solr的analysis包并没有带支持中文的包或者对中文的分词效果不好,需要自己添加中文分词器:目前呼声较高的是 ...

  7. 微信小程序（15）--上传图片公用组件(2)

    接下来开始写写上传图片的公用组件,可以自定义上传几张图片. chooseImage文件夹里面的index.wxml和index.js,涉及图片上传,删除,预览. <view class=&quo ...

  8. 阿里云centos下搭建vsftpd，被动模式出现的问题

    最近计网课设要做一个ftp服务端,所以先在自己服务器搭一个来了解一下. 首先在默认情况下连接,227 Entering Passive Mode (192,168,*,*,227,175). 显示连接 ...

  9. C# List和DataTable的相互转换

    1.List转DataTable /// <summary> /// list to datatable /// </summary> /// <typeparam na ...

  10. count(1)、count(*)、count(字段)的区别

    count(1)和count(*): 都为统计所有记录数,包括null 执行效率上:当数据量1W+时count(*)用时较少,1w以内count(1)用时较少 count(字段): 统计字段列的行数, ...