<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>prototype</title> <script type="text/javascript"> window.onload = function (){
/*
var addNum = function (n1,n2){
this.num1 = n1;
this.num2 = n2;
this.add();
} addNum.prototype = {
add:function(){ //return this.num1 + this.num2;
alert(this.num1 + this.num2);
}
} var n = new addNum(3,4);
//alert(n.add());
*/ var createItems = function (){
this.oBtn = document.getElementById("btn");
this.oName = document.getElementById("tagName");
this.oValue = document.getElementById("tagValue");
this.tag = this.oName.value;
this.val = this.oValue.value;
var _this = this;
this.oBtn.onclick = function (){
//console.log(this.tag + " , " + this.val + " , " + this);
_this.create(_this);
}
}
createItems.prototype = {
create:function(_this){
alert(this.tag);
_this.nTag = document.createElement(_this.tag);
_this.nTag.innerHTML = _this.val;
document.body.appendChild(_this.nTag);
}
}
var c = new createItems();
}
</script> </head>
<body>
<input type="text" name="tagName" id="tagName" style="width:50px;" value="" />
<input type="text" name="tagValue" id="tagValue" value="" />
<input type="button" value="点击" name="btn" id="btn" /> </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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>prototype</title> <script type="text/javascript"> window.onload = function (){
/*
var addNum = function (n1,n2){
this.num1 = n1;
this.num2 = n2;
this.add();
} addNum.prototype = {
add:function(){ //return this.num1 + this.num2;
alert(this.num1 + this.num2);
}
} var n = new addNum(3,4);
//alert(n.add());
*/ var createItems = function (){
this.oBtn = document.getElementById("btn");
this.oName = document.getElementById("tagName");
this.oValue = document.getElementById("tagValue");
var _this = this;
this.oBtn.onclick = function (){
_this.create();
}
}
createItems.prototype = {
create:function(){
this.tag = this.oName.value;
this.val = this.oValue.value;
this.nTag = document.createElement(this.tag);
this.nTag.innerHTML = this.val;
document.body.appendChild(this.nTag);
}
}
var c = new createItems();
}
</script> </head>
<body>
<input type="text" name="tagName" id="tagName" style="width:50px;" value="" />
<input type="text" name="tagValue" id="tagValue" value="" />
<input type="button" value="点击" name="btn" id="btn" /> </body>
</html>

  • 对的

prototype入门----自定义创建元素的更多相关文章

  1. 无废话Android之listview入门,自定义的数据适配器、采用layoutInflater打气筒创建一个view对象、常用数据适配器ArrayAdapter、SimpleAdapter、使用ContentProvider(内容提供者)共享数据、短信的备份、插入一条记录到系统短信应用(3)

    1.listview入门,自定义的数据适配器 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/and ...

  2. Sandcastle入门:创建C#帮助文档

    Sandcastle入门:创建C#帮助文档 今天学到了一个东西:利用vs2005生成的dll/xml来生成帮助文档. 完成这个伟大任务的是Sandcastle,微软推出的类库文档编译工具. 在开始这篇 ...

  3. React.js入门笔记 创建hello world 的6种方式

    一.ReactJS简介 React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站. ...

  4. SpringMVC基础入门,创建一个HelloWorld程序

    ref:http://www.admin10000.com/document/6436.html 一.SpringMVC基础入门,创建一个HelloWorld程序 1.首先,导入SpringMVC需要 ...

  5. XamarinAndroid组件教程设置自定义子元素动画(一)

    XamarinAndroid组件教程设置自定义子元素动画(一) 如果在RecyclerViewAnimators.Animators中没有所需要的动画效果,就可以自定义一个.此时,需要让自定义的动画继 ...

  6. jQuery3动画+创建元素

    一.jQuery的动画 1.jQuery自带的动画 1>变化的是width height opacity display <!DOCTYPE html> <html lang= ...

  7. 【WPF学习】第六十八章 自定义绘图元素

    上一章分析了WPF元素的内部工作元素——允许每个元素插入到WPF布局系统的MeasureOverride()和ArrangeOverride()方法中.本章将进一步深入分析和研究元素如何渲染自身. 大 ...

  8. HashSet存储自定义类型元素和LinkedHashSet集合

    HashSet集合存储自定义类型元素 HashSet存储自定义类型元素 set集合报错元素唯一: ~存储的元素(String,Integer,-Student,Person-)必须重写hashCode ...

  9. [MISSAJJ原创]cell内 通过SDWebImage自定义创建动态菊花加载指示器

    最后更新已经放到了github上了 MISSAJJ自己写的一个基于SDWebImage自定义的管理网络图片加载的工具类(普通图片加载,渐现Alpha图片加载,菊花Indicator动画加载) 经常在项 ...

随机推荐

  1. 微信支付开发h5调用

    这两天做微信支付开发.碰到大坑.纠结死我了.好不容做完. 后台java:直接上代码:注意区分前后端的变量大小写... @RequestMapping(value = "/index" ...

  2. Java面向对象编程 -6.3

    foreach迭代输出 对于数组而言,一般都会使用for循环进行输出,但是在使用传统for循环的时候往往采用下标的形式进行数组元素的访问. 但是在jdk1.5之后为了减轻下标对数组的影响(如果数组下标 ...

  3. ARM相关概念(学习目标、分类、商业模式及半导体公司、嵌入式处理器)

    1.学习ARM的目标 (1)对比X86,8051汇编,从更底层的角度去理解相关知识 (2)为后续嵌入式课程做准备 (3)了解ARM的体系结构,能够看懂ARM汇编 2.ARM分类 (1)按照版本号分类: ...

  4. Python日期

    1. datatime from datetime import datetime, date now = datetime.now() print(now) # 2020-01-20 01:24:0 ...

  5. 【MySQL】安装及配置

    " 目录 #. 概述 1. 什么是数据(Data) 2. 什么是数据库(DataBase, 简称DB) 3. 什么是数据库管理系统(DataBase Management System) 4 ...

  6. VBS微信轰炸

    打开windows命令界面输入notepad将此vbs脚本复制粘贴到记事本,保存并设置后缀名为.vbs,进入微信或者QQ在聊天界面复制好要发送的文字,最后双击运行vbs脚本并把鼠标移入聊天框,最后按发 ...

  7. 兵贵神速!掌握这10个Python技巧,让你代码工作如鱼得水

    主题 Python 1000个读者心中有1000个哈姆雷特,要问1000个程序员“什么才是最好的语言”,Java.Python.PHP.C++ 也都有自己的位置.但要问编程语言流行指数之王非,那真的非 ...

  8. Springboot学习:SpringMVC自动配置

    Spring MVC auto-configuration Spring Boot 自动配置好了SpringMVC 以下是SpringBoot对SpringMVC的默认配置:==(WebMvcAuto ...

  9. 吴裕雄--天生自然Numpy库学习笔记:NumPy Ndarray 对象

    NumPy 最重要的一个特点是其 N 维数组对象 ndarray,它是一系列同类型数据的集合,以 0 下标为开始进行集合中元素的索引. ndarray 对象是用于存放同类型元素的多维数组. ndarr ...

  10. 吴裕雄 python 神经网络——TensorFlow 图像预处理完整样例

    import numpy as np import tensorflow as tf import matplotlib.pyplot as plt def distort_color(image, ...