`
yin_jw
  • 浏览: 49112 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

jQuery 实现节点的创建

阅读更多
<%@ page language="java" import="java.util.*" pageEncoding="GB18030"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>My JSP 'Jquery007.jsp' starting page</title>

		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		
		<script type="text/javascript" src="js/jquery-1.6.1.js"></script>
		<!-- jQuery实现节点的创建 -->
		<script type="text/javascript">
			$(document).ready(function() {
				//获得button对象
				var btn1 = $("#btn1");
				btn1.click(function() {
					var div1 = $("#div1");
					//将div中的html源码清空
					div1.html("");
					var num = Number($("#text1").val());
					var str = "";
					for ( var i = 0; i < num; i++) {
						str += '<input type="text"/></br>';
					}
					div1.append(str);
				});
			});
		</script>
	</head>

	<body>
		<input type="text" id="text1" />
		<input type="button" id="btn1" value="click">
		<div id="div1"></div>
	</body>
</html>
 
分享到:
评论

相关推荐

    jQuery步骤节点进度条代码

    "jQuery步骤节点进度条代码"是一个基于jQuery实现的动态展示步骤流程的示例,常用于诸如注册、购物车结账或募捐等多步骤过程的用户界面。这个例子使用了jQuery 1.10.2版本,一个稳定且广泛使用的jQuery库。 首先,...

    jQuery与JavaScript节点创建方法的对比.docx

    总的来说,jQuery 的节点创建方法适合快速开发和简化代码,而 JavaScript 的原生方法在性能上有优势,适用于对效率有较高要求的场景。在实际开发中,开发者可以根据项目需求和团队习惯选择合适的方法。 此外,了解...

    jquery包裹节点

    这将会为每个匹配的元素创建一个新的`&lt;div&gt;`,并将其作为这些元素的父节点。 **.wrapAll()** ```javascript $('selector').wrapAll('&lt;div class="container"&gt;&lt;/div&gt;'); ``` 这里,所有匹配的元素会被同一个`...

    jQuery带节点步骤进度条插件.zip

    jQuery带节点步骤进度条插件是一款专为网页设计者打造的高效工具,它主要用于呈现具有节点的步骤...一旦熟悉了这些,你就可以轻松地在自己的项目中实现具有节点步骤进度条的交互式界面,提升用户在多步骤过程中的体验。

    jquery实现递归tr子节点

    在前端开发中,jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理、动画效果等任务。在处理 HTML 表格时,有时...通过熟练掌握这些技能,你可以轻松地实现类似“jquery实现递归tr子节点”的功能。

    jQuery动态添加节点循环流程图表代码.zip

    本资源“jQuery动态添加节点循环流程图表代码”提供了利用jQuery实现动态添加节点并创建循环流程图表的方法。这样的功能在数据可视化、交互式用户界面以及流程展示等方面非常实用。 首先,我们要理解jQuery动态添加...

    jQuery 1.5 遍历xml节点属性

    在jQuery 1.5中,遍历XML节点属性主要通过以下方法实现: 1. **jQuery.parseXML()**:这是jQuery提供的一个静态方法,用于将XML字符串解析为DOM对象。例如: ```javascript var xmlString = "&lt;root&gt;&lt;node attr1='...

    jQuery步骤节点进度条代码.zip

    在给定的“jQuery步骤节点进度条代码.zip”压缩包中,我们可以期待找到一个实现步骤节点进度条效果的jQuery代码示例。这个效果通常用于展示多步骤过程的进度,如注册、购物结账或填写表单等,用户可以清晰地看到自己...

    Jquery实现问卷调查

    编辑和删除功能同样可以通过jQuery实现。对于编辑,我们可以在问卷项上放置一个编辑按钮,点击后显示一个模态框或者使用Bootstrap的`collapse`插件展开隐藏的编辑区域。删除功能则可以通过在每个问题旁边添加一个...

    jquery替换节点

    这个方法接受一个参数,可以是HTML字符串、DOM元素、jQuery对象,或者是创建新元素的函数。例如,如果我们有一个ID为"oldElement"的元素需要被新的HTML内容替换,我们可以这样做: ```javascript $("#oldElement")....

    jQuery实现公司组织结构图

    总之,利用jQuery实现公司组织结构图是一个综合性的任务,涉及到HTML结构、CSS样式、jQuery选择器、事件处理、Ajax通信等多个方面。通过实践和学习,你可以创建出既美观又实用的组织结构图,提升项目的用户体验。

    JQuery实现流程图效果

    三、jQuery实现动画与交互 1. 连接线绘制:可以使用jQuery的`append()`方法动态创建SVG元素,如`&lt;line&gt;`,用于表示流程图中的连接线。根据节点的位置计算线的起点和终点。 ```javascript var line = $('&lt;line&gt;')....

    jquery实现上下移动

    本教程将详细讲解如何利用jQuery实现表格内容的上下移动功能,以及随之变动的序号更新。 一、jQuery基础 jQuery通过提供简洁的API,使得JavaScript代码更易于编写和理解。其核心概念包括选择器(用于选取DOM元素)...

    jQuery纵向排列树形图菜单代码.zip

    本项目“jQuery纵向排列树形图菜单代码”是利用jQuery结合第三方插件jquery.ztree.js实现的一种特殊的菜单导航效果,旨在创建一个能够垂直展示的树形结构图,提供更清晰的层次感和用户交互体验。 首先,我们来深入...

    jquery实现的一个treeview效果

    而jQuery的TreeView插件则是用于创建可交互的树形视图,这在展示层级结构数据或者构建导航菜单时十分实用。下面我们将深入探讨jQuery Treeview的基本概念、实现原理以及使用方法。 首先,jQuery Treeview是一个插件...

    jQuery动态添加节点循环流程图表代码

    本文将深入探讨如何使用jQuery实现动态添加节点的循环流程图表代码。 首先,"jQuery动态添加节点"指的是在网页运行时,通过jQuery API创建新的HTML元素并将其插入到DOM(Document Object Model)树中。这在构建动态...

    14jQueryDOM节点操作.docx

    在Visual Studio环境下,我们可以利用jQuery进行DOM节点的创建、插入等操作。下面我们将详细探讨这些知识点: 1. **创建DOM节点** - 使用`document.createElement()`函数可以创建新的DOM元素。例如,创建一个带有...

    用JQUERY模仿Angularjs的todoList(mvc)

    本教程将聚焦于如何使用jQuery来模仿AngularJS的TodoList功能,这是一个经典的MVC(Model-View-Controller)模式应用实例,让我们深入了解这两个库的不同之处以及如何在jQuery中实现类似的功能。 首先,AngularJS是...

    jquery实现树的动态加载

    本文将详细探讨如何使用jQuery实现树形结构的动态加载,以适应不同用户需求,提高网页交互性。 一、jQuery基础 在理解jQuery实现树形结构动态加载之前,首先需要对jQuery的基本概念有所了解。jQuery通过简洁的语法...

    jQuery节点分布圆形循环信息展示代码.zip

    《jQuery实现节点分布圆形循环信息展示的代码解析》 在Web开发中,视觉效果的创新与用户体验的提升是至关重要的。jQuery作为一个强大的JavaScript库,以其简洁的API和丰富的插件库,为开发者提供了诸多便利。本篇...

Global site tag (gtag.js) - Google Analytics