`
zengshaotao
  • 浏览: 787650 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

javascript 事件 插入行

 
阅读更多

页面代码：
<html>
<head>
<script type="text/javascript">
 function getpValue()
 {
    document.getElementById("span1").innerText=window.parent.document.getElementById

("username").value;
 }
</script>
</head>
<body>
<span>文本框值为：</span><span id="span1"></span><br />
<input type="button" value="获取父窗口内的文本框值" onclick="getpValue();">
</body>
</html>

该页面以iframe的形式嵌入到其父页面，通过如上语句可以获得父窗口的值

<HTML>
<HEAD>
<TITLE>showModelessDialogEX.htm</TITLE>
<SCRIPT>
var sUserName="";
 
function fnCallDialog(){
 showModelessDialog("myDialog.htm",window,"status:false;dialogWidth:300px;dialogHeight:300px");
}
 
function fnUpdate(){
    oName.innerText = sUserName;
}
</SCRIPT>
</HEAD><BODY>
<P>Enter your first name:
 <SPAN ID="oName" STYLE="color:red;font-size:24">Joan</SPAN></P>
 <INPUT TYPE="button" VALUE="Display Modeless Dialog" onclick="fnCallDialog()">
</BODY>
</HTML>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript">
 function searchDOM()
 {
  var li=document.getElementsByTagName("li");//获得了所有li标记，在数组里重复存储
  alert(li.length+" "+li[1].tagName+" "+li[2].tagName+" "+li[3].childNodes

[0].nodeValue);
  //将标记之间的文本内容也看成了一个节点，为了通用性，有些只有单个文件节点的标记也

需要用
  //childNodes[0].nodeValue来获得其单个文本节点的文本内容
  
  alert(li[1].childNodes[0].nodeValue);
  var ul = document.getElementsByTagName("ul");
  alert(ul[1].childNodes[1].tagName);
  alert(ul[1].childNodes[1].nodeValue);
  
  var li2=ul[1].getElementsByTagName("li");
  alert(li2.length+" "+li2[1].tagName+" "+li2[2].childNodes[0].nodeValue);
  alert("测试新的");
  var id = document.getElementById("css");
  alert(id.tagName+"  "+id.childNodes[0].nodeValue);
  alert("父子节点测试");
  var ml = document.getElementById("myList");
  var domString = "";
  if(ml.hasChildNodes())
  {
   var son = ml.childNodes;
   for(var i=0;i<son.length;i++)
   {
    domString +=son[i].nodeName+"\n";
   }
   alert(son[0].nodeValue);
  }
  alert(domString);
  alert("节点属性的测试");
  var img = document.getElementsByTagName("img")[0];//不能少了s，复数的形式
  alert(img);
  alert(img.getAttribute("title"));
  alert("创建新节点的测试");
  var op = document.createElement("p");
  var pText = document.createTextNode("这是一个新的开始");
  op.appendChild(pText);
  document.body.appendChild(op);
  alert("innerHTML的测试");
  var mt = document.getElementById("mytest");//得到容器标记
  alert(mt.innerHTML);
  mt.innerHTML = "<img src='三清山.jpg' title='魅力三清山' />";
 }
</script>
</head>
 
<body onload="searchDOM()">
 <ul>客户端语言
  <li>HTML</li>
  <li>JavaScript</li>
  <li id="css">CSS</li>
 </ul>
 <ul id="myList">服务器端语言
  <li>JSP</li>
  <li>PHP</li>
  <li>ASP</li>
 </ul>
 <img src="美丽上饶.jpg" title="美丽上饶" border="0" />
 <p>事先在这里写入一行文字，测试appendChild（）方法添加的文本位置</p>
 <div id="mytest">
  <span>魅力三清山</span>
  <p>我爱上饶</p>
 </div>
</body>
</html>


<script language="javascript">
var oo;
function fnclick()
{
 alert("我被点击了");
 oo.detachEvent("onclick",fnclick);
}
 
window.onload = function()//相当于定义了一个无名的函数
{
 oo = document.getElementById("myid");//这里不能重新定义oo，否则全局变量就不会被初始化
 
 oo.attachEvent("onclick",fnclick);
}
</script>
</head>
 
<body>
 <div id="myid">
  <p>测试事件</p>
 </div>


<script language="javascript">
 function c1()
 {
  alert("我是函数1");
 }
 function c2()
 {
  alert("我是函数2");
 }
 var oP;
 window.onload=function()
 {
  oP = document.getElementById("myP");
  //oP.onclick  = function(oEvent)
  //{
  //为了获得多个浏览器的兼容性
   //if(window.event)oEvent = window.event;
  //}
  oP.addEventListener("click",c1,false);
  oP.addEventListener("click",c2,false);
 }
</script>
</head>
 
<body>
 <div>
  <p id="myP">click me</p>
 </div>
</body>

<script language="javascript">
 function handle(oEvent)
 {
  var odiv = document.getElementById("display");
  
  if(window.event)oEvent= window.event;
  if(oEvent.type=="click")
   odiv.innerHTML+="你点击了我";
  else if(oEvent.type=="mouseover")
   odiv.innerHTML+="你移动到我的上方了";
 }
 window.onload = function()
 {
  var oimg = document.getElementsByTagName("img")[0];
  alert(oimg.onclick);
  oimg.onclick=handle;
  oimg.onmouseover=handle;
 }
</script>
</head>
 
<body>
 <img src="美丽上饶.jpg" border="0" />
 <div id="display"></div>
</body>


window.onload=function()
 {
  var otr = document.getElementById("member").insertRow(2);
  var text = new Array();
  text[0] = document.createTextNode("test");
  text[1] = document.createTextNode("test");
  text[2] = document.createTextNode("test");
  text[3] = document.createTextNode("test");
  text[4] = document.createTextNode("test");
  for(var i=0;i<text.length;i++)
  {
   var otd = otr.insertCell(i);
   otd.appendChild(text[i]);
  }
 }

function checkMyCard(card)
 {
  var ok,i=0,ch;
  ok = (card.charAt(4)=="-"&&card.charAt(9)=="-"&&card.charAt(14)=="-")
  if(!ok)
  {
   alert("卡号的输入格式不对");
   return false;
  }
  while(i<19)
  {
   ch = card.charAt(i);
   if(ch!="-"&&(ch<"0"||ch>"9"))
   {
    alert("卡号输入格式不对，格式应该是xxxx-xxxx-xxxx-xxxx，x是0到9其

中的一个数");
    return false;
   }
   i++;
  }
  return true;
 }

分享到：
| CSS
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    javascript动态插入行列

    javascript动态插入行列 javascript动态插入行列

    javascript插入表格空白行 示例源码

    在JavaScript编程中，插入表格空白行是一项常见的任务，特别是在网页动态数据展示时。这个示例源码可能展示了如何使用纯JavaScript来实现这一功能。在.NET环境中，JavaScript通常用于客户端交互，而服务器端语言如C#...

    深入理解javascript动态插入技术

    在深入理解JavaScript动态插入技术的探讨中，我们首先关注到的是动态插入技术的核心概念，即如何使用JavaScript将HTML内容动态地添加到网页中。这类技术允许开发者在不重新加载页面的情况下，修改页面的结构和内容。...

    javascript动态添加表格数据行

    在JavaScript编程中，动态添加表格数据行是一种常见的需求，特别是在构建交互式的Web应用程序时。这个功能允许用户在不刷新整个页面的情况下添加新的记录，提高了用户体验。在这个例子中，我们将探讨如何利用...

    JQuery实现插入行

    本文将深入探讨如何使用jQuery来实现表格中的行插入功能，这在许多网页应用中是非常常见的需求。 首先，让我们理解jQuery的核心概念。jQuery库通过一个选择器（如$("#example")）来选取DOM元素，然后可以对选取的...

    JavaScript splice 数组操作（删除，插入）

    插入）JavaScript splice 数组操作（删除，插入）JavaScript splice 数组操作（删除，插入）JavaScript splice 数组操作（删除，插入）JavaScript splice 数组操作（删除，插入）JavaScript splice 数组操作（删除，...

    表格动态插入行

    本知识点主要探讨如何使用JavaScript（简称JS）来实现表格动态插入行的功能。JavaScript是一种广泛使用的客户端脚本语言，它允许我们对网页进行实时更新和交互，而不需刷新整个页面。 首先，我们需要一个基本的HTML...

    javascript事件列表解说

    JavaScript事件是Web开发中不可或缺的一部分，它允许我们与用户进行交互，响应用户的操作，并控制页面的行为。本篇文章将深入解析JavaScript事件列表，帮助你更好地理解和应用这些事件。 首先，JavaScript事件分为...

    JavaScript sqlite3 大数据量插入

    Node.js结合sqlite3模块实现Sqlite数据库建表并实现大数据量的快速插入

    JSP中使用JavaScript动态插入删除输入框实现代码.docx

    JSP中使用JavaScript动态插入删除输入框实现代码 JSP（Java Server Pages）是一种基于Java技术的服务器端脚本语言，主要用于生成动态网页内容。JavaScript则是一种客户端脚本语言，主要用于实现网页的交互功能。在...

    给Javascript数组插入一条记录的代码.docx

    在JavaScript中，处理数组是日常编程工作中常见的任务之一，而向数组中插入记录是这些任务中的一个基本操作。在给定的文档中，我们看到了一个扩展了JavaScript数组原型的`insert()`方法，用于在数组的特定位置插入值...

    javascript table 增加删除行,巧妙实现

    // 在表格的末尾插入新行 for (var i = 0; i ; i++) { var newCell = newRow.insertCell(i); newCell.innerHTML = data[i]; } } // 使用方法 addRow('myTable', ['李四', '30']); ``` 删除行则需要获取到...

    javaScript事件课堂笔记+作业.pdf

    JavaScript事件是JavaScript编程中至关重要的概念，它允许我们响应用户在网页上的交互行为。当用户进行特定的操作，如点击按钮、填写表单或滚动页面，JavaScript事件机制会触发预先定义的函数来处理这些行为。 一、...

    JavaScript talbe表中指定位置插入一行的实现代码 脚本之家修正版

    在文件中，JavaScript利用DOM操作方法如`insertRow()`和`insertCell()`来实现插入行和单元格。 2. `insertRow()`方法 `insertRow()`是一个表格（table）元素的方法，用于在表格中插入新的行。该方法可以在指定的...

    通过javascript在光标处插入文本

    通过Javascript在光标处插入文本 在网页开发中，经常需要在文本框中插入文本，特别是在光标处插入文本。下面，我们将讨论如何使用Javascript在光标处插入文本。 光标位置获取 在获取光标位置之前，我们需要了解...

    如何让动态插入的javascript脚本代码跑起来

    在JavaScript编程中，动态插入脚本是一种常见的技术，用于在页面加载后或者根据某些条件按需加载外部的JavaScript文件。这种技术在处理大型应用、优化页面性能或实现异步加载时非常有用。本文将详细介绍如何让动态...

    javascript 在光标处插入指定内容

    在JavaScript中，向文本输入框或者富文本编辑器在光标位置插入特定内容是一项常见的需求。这涉及到对DOM（文档对象模型）的操作以及对文本选取的理解。以下将详细阐述实现这个功能所需的知识点。 首先，我们需要...

    JavaScript Editor

    有着丰富的代码编辑功能(JavaScript, HTML, CSS, VBScript, PHP ,ASP(Net)语法加亮)，内置预览功能，提供了完整的HTML 标记, HTML 属性, HTML 事件, JavaScript 事件和JavaScript 函数等完整的代码库，可轻松插入到...

    利用javascript动态添加行(原创)

    在JavaScript编程中，动态添加行是一项常见的任务，特别是在构建数据驱动的Web应用或者处理表格数据时。这个技术允许用户在运行时向HTML表格或其他结构化元素中插入新的内容，提高用户体验，无需页面刷新。以下是对...

    JavaScript 点击插入文字

    JavaScript 点击插入文字功能的实现依赖于JavaScript语言本身提供的事件处理和DOM操作的能力。具体来说，该功能利用了document对象的onclick事件，当用户在网页上的任意位置点击时触发，然后执行一个函数来插入指定...

Magicbox
Global site tag (gtag.js) - Google Analytics