JSP

el表达式入门

el表达式是替换JSP中java代码

${域名.键名} 从指定域中,获取键名对应的值,如果键不存在,显示空字符串

${键名}从最小域page中查找键的值,如果没找到扩大范围继续找,如果没找到显示空字符串

 

2,el获取不同类型的数据

如何获取基本类型的数据？
${域中的键名}
如何获取对象的属性值？
${域中对象的名称.属性名} //JavaBean中，属性指的是setter/getter方法；

如何获取数组中指定索引处的元素？
${域中数组的名称[索引]}
如何获取单列集合中指定索引处的元素？
${域中单列集合的名称[索引]}
如何获取Map集合中指定key对应的值？
${域中map集合的名称.map集合中的键名}
${域中map集合的名称["map集合中的键名"]}

 

3,JSTL核心标签库

使用步骤：
1.导入jstl相关的jar包到lib目录中
2.在对应的jsp页面中，使用taglib属性引入jstl标签库
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
3.使用标签

3.1<c:if test="判断运算">

3.2<c:choose><c: when test=" 选择内容"></c:choose>

3.3

<%-- c:forEach 它是用来遍历集合的
属性：
items：要遍历的集合，它可以是EL表达式取出来的
var：把当前遍历的元素放入指定的page域中。 var的取值就是key,当前遍历的元素就是value
注意：它不能支持EL表达式，只能是字符串常量
begin:开始遍历的索引
end:结束遍历的索引
step：步长。i+=step
varStatus：它是一个计数器对象。里面有两个属性，一个是用于记录索引。一个是用于计数。
索引是从0开始。计数是从1开始
--%>

 

 

JavaScript

  • 注释：单行// 多行/**/

  • 输入输出语句：prompt()、alert()、console.log()、document.write()

  • 变量和常量：let、const

  • 数据类型：boolean、null、undefined、number、string、bigint

  • typeof 关键字：用于判断变量的数据类型

  • 运算符：算数、赋值、逻辑、比较、三元运算符

  • 流程控制和循环语句：if、switch、for、while

  • 数组：数据类型和长度没有限制，let 数组名 = [长度/元素]

  • 函数：类似方法，抽取代码，提高复用性

  • DOM(Document Object Model)：文档对象模型

    • Document：文档对象

  • Element：元素对象

    • Attribute：属性对象

  • Text：文本对象

  • 元素的操作

    • getElementById()

    • getElementsByTagName()

    • getElementsByName()

    • getElementsByClassName()

    • 子元素对象.parentElement属性

    • createElement()

    • appendChild()

    • removeChild()

    • replaceChild()

  • 属性的操作

    • setAtrribute()

    • getAtrribute()

    • removeAtrribute()

    • style属性

  • 文本的操作

    • innerText

    • innerHTML

4.2、事件操作

绑定事件

  • 方式一

    通过标签中的事件属性进行绑定。

    <button id="btn" onclick="执行的功能"></button>

  • 方式二

    通过 DOM 元素属性绑定。

    document.getElementById("btn").onclick = 执行的功能

4.3、事件小结

  • 事件指的就是当某些组件执行了某些操作后，会触发某些代码的执行。

  • 常用的事件 onload onsubmit onclick ondblclick onblur onfocus onchange

  • 绑定事件方式

    • 方式一：通过标签中的事件属性进行绑定。

    • 方式二：通过 DOM 元素属性绑定。

 

jqurey

  • jQuery 的核心语法 $();

  • JS 的 DOM 对象转换成 jQuery 对象   

  • let jsid= document.getElementbyId("id");

  • let jsid =${jqueryId}

  • jquery转换js

let jqueryId= ${#id};

let jsid=jqueryId[0];

 

  • 在 jQuery 中将事件封装成了对应的方法。去掉了 JS 中的 .on 语法。

  • $("#id").click.(function){

alert("事件");

  • }

  • JS 对象和 jQuery 对象相互转换

    • $(JS 的 DOM 对象)：将 JS 对象转为 jQuery 对象。

    • jQuery 对象[索引] jQuery

    • 对象.get(索引)：将 jQuery 对象转为 JS 对象。

  • 事件

    • 在 jQuery 中将事件封装成了对应的方法。去掉了 JS 中的 .on 语法。

    • on(事件名称,执行的功能)：绑定事件。

    • off(事件名称)：解绑事件。

  • 遍历

    • 传统方式。

    • 对象.each() 方法。

    • $.each() 方法。

    • for of 语句。

 

  • 选择器：类似于 CSS 的选择器，可以帮助我们获取元素。

  • jQuery 中选择器的语法：$();

  • 基本选择器

    • $("元素的名称");

    • $("#id的属性值");

    • $(".class的属性值");

  • 层级选择器

    • $("A B");

    • $("A > B");

  • 属性选择器

    • $("A[属性名]");

    • $("A[属性名=属性值]");

  • 过滤器选择器

    • $("A:even");

    • $("A:odd");

  • 表单属性选择器

    • $("A:disabled");

    • $("A:checked");

    • $("A:selected");

 

JQuery DOM

  • 操作文本

    • html() html(…)：获取或设置标签的文本，解析标签。

  • 操作对象

    • $(“元素”)：创建指定元素。

    • append(element)：添加成最后一个子元素，由添加者对象调用。

    • prepend(element)：添加成第一个子元素，由添加者对象调用。

    • before(element)：添加到当前元素的前面，两者之间是兄弟关系，由添加者对象调用。

    • after(element)：添加到当前元素的后面，两者之间是兄弟关系，由添加者对象调用。

    • remove()：删除指定元素(自己移除自己)。

  • 操作样式

    • addClass(value)：给指定的对象添加样式类名。

    • removeClass(value)：给指定的对象删除样式类名。

  • 操作属性

    • attr(name,[value])：获得/设置属性的值。

    • prop(name,[value])：获得/设置属性的值(checked，selected)。

posted @ 2021-10-24 21:12  党王  阅读(64)  评论(0)    收藏  举报