Jquery常用的语法有哪些?

本文和大家分享的主要是jquery常用的一些语法,一起来看看吧,希望对大家学习jquery有所帮助。
1. 控制字体style
< style >
.fontcolor {
color:#FF0000;
font-size:15px;
font-weight:bold;
}
</style >
2. td中换行,以及for展示
<td>
   <ul>
     #foreach($model in $!data.list1)
       <li>$!model</li>
     #end
   </ul>
</td>
3. 一些简单语法
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
  jQuery(document).ready(function(){
           $("#searchSubmit").click(function() {
                 $("#searchForm").submit();
                 return false;
           });
     });
基础语法: $(selector).action()
· 美元符号定义 jQuery  $
· 选择符(selector)“查询”和“查找” HTML 元素
· jQuery 的 action() 执行对元素的操作
· 示例:
· $(this).hide() - 隐藏当前元素
· $("p").hide() - 隐藏所有段落
· $("p.test").hide() - 隐藏所有 的段落
· $("#test").hide() - 隐藏所有 id="test" 的元素
选择器-by tag:
· jQuery 使用 CSS 选择器来选取 HTML 元素。
· 示例:
· $("p") 选取
元素。
· $("p.intro") 选取所有 的
元素。
· $("p#demo") 选取 id="demo" 的第一个
元素。
选择器-by prop:
· jQuery 使用 XPath 表达式来选择带有给定属性的元素。
· 示例:
· $("[href]") 选取所有带有 href 属性的元素。
· $("[href=’#’]") 选取所有带有 href 值等于 "#" 的元素。
· $("[href!=’#’]") 选取所有带有 href 值不等于 "#" 的元素。
· ("[href("[href=’.jpg’]") 选取所有 href 值以 ".jpg" 结尾的元素。
选择器-css:
· jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。
· 示例:
· $("p").css("background-color","red");
来点事件:
· 基于事件,我们可以做许多事情。
· 示例:
· $(document).ready(function)
· $(selector).click(function)
· $(selector).focus(function)
jQuery与html:
· jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。
· 三个简单实用的用于 DOM 操作的 jQuery 方法,get -- set:
· $(selector). text()   -- text("")
· $(selector). html()  -- html("")
· $(selector). val()    -- html("")
· $(selector). attr("")   -- attr("", "")
· 等同于,获name来找,("input[name=′whichName′]").val(),对它重新赋值("input[name=′whichName′]").val(),对它重新赋值("input[name=’whichName’]").val(oldTopic);
jQuery-GET:
· $.get("yourUrl", function(data, status){}); 其中,data是controller里这样写回的response.write("")/modelMap带回
· 示例:
$("button").click(function(){
$.get("demo_test.asp",function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
jQuery-POST:
$.post(URL,data,callback);  其中,data是controller里这样写回的response.write("")/modelMap带回
· 示例:
$("button").click(function(){
$.post("demo_test_post.asp",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
jQuery-遍历:
$(selector).each(function(index,element))
· 示例:
· $("table").find("tr").each(function(){
$(this).find("td").each(function(){
alert($(this).text());
});
});
4. 常用方法
放在一个vm里太长了,可以单独建立自己的.js文件,.vm里引入即可。
<script>
/** elementName标识的页面元素的值,是否为空. */
function isNULL(elementname){
if($("input[name=" + elementname + "]").val() == ""){
return true;
}
return false;
}
/** elementName标识的页面元素的值,是否超时limitedLength. */
function exceedLimitedLength(elementname, limitedLength){
if($("input[name=" + elementname + "]").val().length > limitedLength){
return true;
}
return false;
}
/** elementName标识的页面元素的值,是否为数字. */
function isNum(elementname){
return isNaN($("input[name=" + elementname + "]").val());
}
/** 光标显示在elementname标识的元素内. */
function focus(elementname){
$("input[name=" + elementname + "]").focus();
}
/** elementname标识的页面元素是否为数字,如果不是,那么光标标在那里,并且提示用户. */
function isNumber(elementname){
if(isNum(elementname)){
focus(elementname);
alert(elementname + "必须为数字");
return false;
}
return true;
}
/** elementname标识的页面元素的值,是否包含了中文. */
function containsChinese(elementname){
var str = $("input[name=" + elementname + "]").val();
if(escape(str).indexOf("%u")>=0){
return true;
}
return false;
}
/** elementname标识的页面元素的值,是否只包括字母、数字、中划线和下划线. */
function containsOnlyLettersNumberAndTwoDash(elementname){
var str = $("input[name=" + elementname + "]").val();
var patten = new RegExp(/^[a-zA-Z0-9\_\-]+$/);
return patten.test(str);
}
/** elementname标识的页面元素的值,是否满足这些约束:不为空、 长度<limitedLength、不包含中文、只包含字母数字中划下划. */
function satisfyAllConstraints(elementname, limitedLength){
if(isNULL(elementname)){
focus(elementname);
alert(elementname + "不可为空");
return false;
}
if(exceedLimitedLength(elementname, limitedLength)){
focus(elementname);
alert(elementname + "超过长度限制" + limitedLength);
return false;
}
if(containsChinese(elementname)){
focus(elementname);
alert(elementname + "不支持中文");
return false;
}
// 注意!
if(!containsOnlyLettersNumberAndTwoDash(elementname)){
focus(elementname);
alert(elementname + "仅支持字母、数字、中划线-、下滑线_");
return false;
}
return true;
}
</script>
判断字符串开头、结尾,正则表达式:
var str = "xxx.xml.bak";
if (str.match("^xxx")) {
alert("xxx starts");
}
if (str.match("xml$")) {
alert("xml ends");
}
来源:csdn

时间: 2024-08-04 19:39:39

Jquery常用的语法有哪些?的相关文章

Jquery常用选择器

Jquery常用选择器<p id="test">这是段落中的<b>粗体</b>文本.</p>text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML 标记)$("#test").text():这是段落中的粗体文本.$("#test").html():这是段落中的<b>粗体</b>文本. append() - 在被选元素的结尾插入

Jquery常用的选择器有哪些?

jquery 选择器. css3 选择器各种各样的选择器,作为非常灵活的 jquery 选择器到底如何使用呢?本文和大家分享的就是jquery 常用选择器种类及其原理相关内容,希望对大家 学习jquery有所帮助. 一.对于jQuery 选择器基本用法 在CSS3 选择器标淮草案定义的选择器语法中, jQuery 支持相当完整的一套子集,同时还添加了一些非标准但很有用的伪类.注意 : 本节讲述的是  jQuery 选择器.其中有不少选择器 ( 但不是全部 ) 可以在 CSS 样式表中使用.选择器

JQuery常用技巧总结

1.关于页面元素的引用通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法.2.jQuery对象与dom对象的转换只有jquery对象才能使用jquery定义的方法.注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象.普通的dom对象一般可以通过$()转换成jquery对象.如:$(document.getElem

jquery常用事件(整理)

Jquery事件 (一).事件列表. 1.blur() 当失去焦点时触发.包括鼠标点击离开和TAB键离开. 2.change() 当元素获取焦点后,值改变失去焦点事触发. 3.click() 当鼠标单击时触发. 4.dblclick()  当鼠标双击时触发. 5.error() 当javascript出错或img的src属性无效时触发. 6.focus()   当元素获取焦点时触发.注意:某些对象不支持. 7.focusin()   当元素或其子元素获取焦点时触发,与focus()区别在于能够检

Vue常用模板语法

常用模板语法 本篇将在上一篇的基础上记录文本渲染.表达式.过滤器以及常用指令的简单用法. 一.文本渲染 Vue支持动态渲染文本,即在修改属性的同时,实时渲染文本内容.同时为了提高渲染效率,也支持只渲染一次,即第一次渲染出文本后,文本内容不再跟随属性值的变化而变化. 实时渲染 1 <div class="row"> 2 <h2>文本 - 实时渲染</h2> 3 <input type="text" v-model="

jQuery常用选择器总结

jQuery常用选择器总结: 我们都知道jQuery是JavaScript(JS)的框架,它的语法简单使用方便,被广大开发人员青睐.现在我就它常用的并且十分强大的选择器的方式,做一个总结.鉴于它的选择器方式众多,我就自己平时工作之中所遇到的常见的方式做一个总结. 一,元素查找方式: $("#myElement")    选择id为myElement的元素,因为id在使用中是唯一的,所以这样的选择也是指定的不变的. $("div")    选择所有的div标签元素,返

javaWeb常用技术语法总结

HTML: 1.html:超文本标记语言. 标记(标签.节点): <标记名>标记内容(标记体)</标记名称> 九成双标记 个别单标记 2.html文件写法和基本结构: 3.常用标记.p/div/span/ul/ol/center/b/i/sub/sup/a 4.表格:网页布局 table thead tbody th td tr 5.表单:手机客户信息. form:name/method/action 表单元素:input:type=text/password/readio/che

jQuery常用技巧-使用的总结

1.关于页面元素的引用 通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法. 2.jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法.注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象. 普通的dom对象一般可以通过$()转换成jquery对象. 如:$(document.ge

jQuery常用函数-思维导图

百度脑图jQuery常用函数 百度脑图jQuery常用函数