Javascript一个在页面内追加元素的小例子
如下:
<!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日补充)
Javascript一个在页面内追加元素的小例子的更多相关文章
- 使用HTML5的JavaScript选择器操作页面中的元素
<!doctype html><html lang="en"> <head> <meta charset="UTF-8& ...
- 【unity3d游戏开发之基础篇】unity3d射线的原理用法以及一个利用射线实现简单拾取的小例子
原地址:http://www.cnblogs.com/xuling/archive/2013/03/04/2943154.html 最近开始研究U3D,它的强大就不多说了, 今天研究了研究射线相关东西 ...
- jQuery基础学习5——JavaScript方法获取页面中的元素
给网页中的所有<p>元素添加onclick事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
- 获取iframe引入页面内的元素
在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素.或者在iframe框架中使用父窗口的元素.js在父窗口中获取iframe中的元素1. 格式:window ...
- javascript实例——文本特效篇(包含3个小例子)
1.标题跑马灯 常常能够在一些新闻网站,或者其他地方,看到文字在一个特定的区域内,来回滚动.一旦超出边界就消失了,那么这些效果是如何做到的呢,今天我们就来讲讲. 图示效果: 源代码: <!doc ...
- jquery实现页面交互的几个小例子
翻看了以前留下的笔记,发现自己竟然做过这么多的页面交互效果,没有使用原生js,全是通过jquery实现的,于是把他们整理下来,附上表现效果图及源代码 1 业务应用:授权商品组和删除商品组 本质:复选框 ...
- 一个基于tcp的socket简单对话小例子
首先我们需要写连个py文件,一个server,一个client. import socket sk = socket.socket() # sk.bind(('ip',port)) sk.bind(( ...
- html中的块元素(Block)和内联元素(Inline)(转)
我们首先要了解,所有的html元素,都要么是块元素(block).要么是内联元素(inline).下面了解一下块元素.内联元素各自的特点: 块元素(block)的特点: 1.总是在新行上开始:2.高度 ...
- 用canvas把页面中所有元素的轮廓绘制出来
function plot(){//绘制函数 // 创建一个canvas画布 const canvas=document.createElement("canvas"); canv ...
随机推荐
- Office - Outlook
将邮件存到本地 服务器容量有限,避免丢失和经常提示容量不足 步骤 在File->Account Settings->Account Settings下面 在Data Files标签页新建一 ...
- [.net]基元线程同步构造
/* 基元线程同步构造 用户模式构造: 易变构造(Volatile Construct) 互锁构造(Interlocked Construct):自旋锁(Spinlock) 乐观锁(Optimisti ...
- gridview获取选中行索引及当前行数据
gridview获取选中行索引及当前行数据 一.非直接绑定数据: <!--前台传值--> <asp:TemplateField HeaderText="操作"&g ...
- SSM文件上传
**自己对于SSM文件上传的一些心得** 刚开始的时候也是在网上寻找一些简单的案例,可能我的这篇文章不是最好的,但是这些都是我自己慢慢的摸索以及自己的尝试的一些心得,希望对各位有所帮助. 其实文件的上 ...
- Redis持久化————AOF与RDB模式
1. 官方说明: By default Redis asynchronously dumps the dataset on disk. This mode is good enou ...
- leetcode 123. 买卖股票的最佳时机 III JAVA
题目: 给定一个数组,它的第 i 个元素是一支给定的股票在第 i 天的价格. 设计一个算法来计算你所能获取的最大利润.你最多可以完成 两笔 交易. 注意: 你不能同时参与多笔交易(你必须在再次购买前出 ...
- Educational Codeforces Round 25 B. Five-In-a-Row
题目链接:http://codeforces.com/contest/825/problem/B B. Five-In-a-Row time limit per test 1 second memor ...
- Jmeter之Bean shell使用
转载地址:http://www.cnblogs.com/puresoul/p/4915350.html 一.什么是Bean Shell BeanShell是一种完全符合Java语法规范的脚本语言,并且 ...
- 【xsy1611】 数位dp 数位dp
这题是显然的数位$dp$,然而我居然写了一个下午!!! 我们不难想到差分,令$solve(x,y)$表示从第一个数字在区间$[0,x]$,第二个数字在区间$[0,y]$的答案. 不难发现题目中给了你一 ...
- SVN的安装和使用手册
下载`TortoiseSVN 官网下载址:https://www.visualsvn.com/visualsvn/download/tortoisesvn/ 下载完成后是这样的 安装TortoiseS ...