一个在页面内追加元素的小例子

如下:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<div id="Cnt-Main-Article-QQ" bosszone="content">
    <p class="titdd-Article">据统计,全国矮小残疾人超过600万人,长期生活在北京的袖珍人超过5000人。</p>

    <p style="TEXT-INDENT: 2em">(新京报)</p>
    <p style="TEXT-INDENT: 2em">(新京报)</p>
    <p style="TEXT-INDENT: 2em">(新京报)</p>
    <p style="TEXT-INDENT: 2em">(新京报)</p>
    <p style="TEXT-INDENT: 2em">(新京报)</p>
    <p style="TEXT-INDENT: 2em">(最后一行)</p>

</div>

<script type="text/javascript">
    var div = document.getElementById("Cnt-Main-Article-QQ");
    var nodes = div.getElementsByTagName("*");
    var firstChild = nodes[0];
    var lastChild = nodes[nodes.length - 1];
    document.write("最后 节点id:"+ lastChild.TEXT_NODE +"<br>");
    document.write("最后 节点name:"+ lastChild.nodeName +"<br>");
    document.write("最后 元素内代码:"+ lastChild.innerHTML +"<br>");
    var oP = lastChild.appendChild(document.createElement("a"));
    oP.setAttribute("href", "http://www.qq.com");
    oP.setAttribute("id", "link");
    var link = document.getElementById("link");
    link.innerHTML = "链接";
</script>
</body>
</html>

高级的办法请移步:dom的使用:

http://www.cnblogs.com/ahthw/p/4140368.html

11.在特定的节点之后插入新元素(2015年1月9日补充)

时间: 2024-10-11 07:40:34

一个在页面内追加元素的小例子的相关文章

一个Swing程序,用来判断一个URL页面内包含的好链接和坏链接数目

入口类 import java.awt.Dimension; import java.awt.Insets; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.io.IOException; import java.net.MalformedURLException; import java.net.URL; import java.net.URLConnection; imp

jquery实现页面交互的几个小例子

翻看了以前留下的笔记,发现自己竟然做过这么多的页面交互效果,没有使用原生js,全是通过jquery实现的,于是把他们整理下来,附上表现效果图及源代码 1 业务应用:授权商品组和删除商品组 本质:复选框及文字的左右移动 表现效果:点击确定时谈框提示哪些商品组已新授权或新删除,只是记录的并非商品组文字,而是商品组编码,各商品组之间以~号分隔 1 <html > 2 <head> 3 <meta http-equiv="Content-Type" content

单列模式下的数据库连接与Servlet之间页面访问用户登录的小例子

下面是我自己写的一个关于servlet的例子 首先是数据库配置,使用的是静态的单例模式 代码如下: / 数据库地址连接 // 使用静态单列模式 public class JdbcUtil { private static String driverName; private static String url; private static String username; private static String password; private static Properties pro

继承方法给页面加上Session判断的小例子

新建一个继承自System.Web.UI.Page的类,然后重写OnInit: using System; using System.Data; using System.Configuration; using System.Linq; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls; using System.Web.UI.WebControl

一个简单调用天气API接口的小例子

1 @{ 2 Layout = null; 3 } 4 <link href="~/Content/css/style.css" rel="stylesheet" /> 5 <script src="~/Scripts/jquery-3.3.1.js"></script> 6 <!DOCTYPE html> 7 8 <html> 9 <head> 10 <meta na

一个用Phaser控制多线程协作的小例子

package com.zl1030.Phaser; import java.util.concurrent.Phaser; public class Bot implements Runnable {     private Phaser phaser;     private int id;     public Bot(int id, Phaser phaser) {         super();         this.id = id;         this.phaser = 

一个用js实现拖拽的小例子

代码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 7 <style> 8 9 body { 10 margin: 0; 11 } 12 13 #rect { 14 width: 100px; 15 height: 100px; 16 b

一个与Linq延迟查询有关的小例子

提出问题 下面所给代码编译时正常,但是执行时会出错,请指出程序在执行时能够执行到编号为(1)(2)(3)的代码行中的哪一行. using System; using System.Collections.Generic; using System.Linq; namespace DeferredExecutionExp { class Program { static void Main(string[] args) { List<Student> studentList = new List

元素分类--内联元素(特点:同行, 宽高边距不可改)

在html中,<span>.<a>.<label>. <strong> 和<em>就是典型的内联元素(行内元素)(inline)元素.当然块状元素也可以通过代码display:inline将元素设置为内联元素. 如下代码就是将块状元素div转换为内联元素,从而使 div 元素具有内联元素特点. div{ display:inline; } ...... <div>我要变成内联元素</div> 内联元素特点: 1.和其他元素