open pdf and draw c# : Add hyperlink to pdf online SDK software API .net winforms html sharepoint %5BO%60Reilly%5D%20-%20JavaScript.%20The%20Definitive%20Guide,%206th%20ed.%20-%20%5BFlanagan%5D39-part1569

firstElementChild
lastElementChild
Like 
firstChild
and 
lastChild
, but for Element children only.
nextElementSibling
previousElementSibling
Like 
nextSibling
and 
previousSibling
, but for Element siblings only.
childElementCount
The number of element children. Returns the same value as 
children.length
.
These child and sibling properties are standardized and are implemented in all current
browsers except IE.
4
Because the API for element-by-element document traversal is not yet completely uni-
versal, you might want to define portable traversal functions like those in Example 15-2.
Example 15-2. Portable document traversal functions
/**
* Return the nth ancestor of e, or null if there is no such ancestor
* or if that ancestor is not an Element (a Document or DocumentFragment e.g.).
* If n is 0 return e itself.  If n is 1 (or
* omitted) return the parent.  If n is 2, return the grandparent, etc.  
*/
function parent(e, n) {
if (n === undefined) n = 1;
while(n-- && e) e = e.parentNode;
if (!e || e.nodeType !== 1) return null;
return e;
}
/**
* Return the nth sibling element of Element e.
* If n is postive return the nth next sibling element.
* If n is negative, return the -nth previous sibling element.
* If n is zero, return e itself.
*/
function sibling(e,n) {
while(e && n !== 0) {  // If e is not defined we just return it
if (n > 0) {  // Find next element sibling
if (e.nextElementSibling) e = e.nextElementSibling;
else {
for(e=e.nextSibling; e && e.nodeType !== 1; e=e.nextSibling)
/* empty loop */ ;
}
n--;
}
else {        // Find the previous element sibling
if (e.previousElementSibing) e = e.previousElementSibling;
else {
for(e=e.previousSibling; e&&e.nodeType!==1; e=e.previousSibling)
/* empty loop */ ;
}
n++;
4.http://www.w3.org/TR/ElementTraversal.
15.3  Document Structure and Traversal | 373
Client-Side
JavaScript
Add hyperlink to pdf online - insert, remove PDF links in C#.net, ASP.NET, MVC, Ajax, WinForms, WPF
Free C# example code is offered for users to edit PDF document hyperlink (url), like inserting and deleting
add hyperlink to pdf in; add hyperlink in pdf
Add hyperlink to pdf online - VB.NET PDF url edit library: insert, remove PDF links in vb.net, ASP.NET, MVC, Ajax, WinForms, WPF
Help to Insert a Hyperlink to Specified PDF Document Page
adding hyperlinks to pdf documents; change link in pdf file
}
}
return e;
}
/**
* Return the nth element child of e, or null if it doesn't have one.
* Negative values of n count from the end. 0 means the first child, but
* -1 means the last child, -2 means the second to last, and so on.
*/
function child(e, n) {
if (e.children) {                      // If children array exists
if (n < 0) n += e.children.length; // Convert negative n to array index
if (n < 0) return null;            // If still negative, no child
return e.children[n];              // Return specified child
}
// If e does not have a children array, find the first child and count
// forward or find the last child and count backwards from there.
if (n >= 0) { // n is non-negative: count forward from the first child
// Find the first child element of e
if (e.firstElementChild) e = e.firstElementChild;
else {
for(e = e.firstChild; e && e.nodeType !== 1; e = e.nextSibling)
/* empty */;
}
return sibling(e, n); // Return the nth sibling of the first child
}
else { // n is negative, so count backwards from the end
if (e.lastElementChild) e = e.lastElementChild;
else {
for(e = e.lastChild; e && e.nodeType !== 1; e=e.previousSibling)
/* empty */;
}
return sibling(e, n+1); // +1 to convert child -1 to sib 0 of last
}
}
Defining Custom Element Methods
All current browsers (including IE8, but not IE7 and before) implement the DOM so
that types like Element and HTMLDocument
5
are classes like String and Array. They
are not constructors (we’ll see how to create new Element objects later in the chapter),
but they have prototype objects and you can extend them with custom methods:
Element.prototype.next = function() {
if (this.nextElementSibling) return this.nextElementSibling;
var sib = this.nextSibling;
while(sib && sib.nodeType !== 1) sib = sib.nextSibling;
return sib;
};
5.IE8 supports extendable prototypes for Element, HTMLDocument, and Text, but not for Node,
Document, HTMLElement, or any of the more specific HTMLElement subtypes.
374 | Chapter 15: Scripting Documents
VB.NET Create PDF from Word Library to convert docx, doc to PDF in
Change Word hyperlink to PDF hyperlink and bookmark. VB.NET Demo Code for Converting Word to PDF. Add necessary references: RasterEdge.Imaging.Basic.dll.
add url to pdf; pdf hyperlink
VB.NET Create PDF from Excel Library to convert xlsx, xls to PDF
Change Excel hyperlink to PDF hyperlink and bookmark. VB.NET Demo Code for Converting Excel to PDF. Add necessary references: RasterEdge.Imaging.Basic.dll.
pdf email link; pdf link to specific page
The functions of Example 15-2 are not defined as Element methods because this tech-
nique is not supported by IE7.
This ability to extend DOM types is still useful, however, if you want to implement IE-
specific features in browsers other than IE. As noted above, the nonstandard Element
property 
children
was introduced by IE and has been adopted by other browsers. You
can use code like this to simulate it in browsers like Firefox 3.0 that do not support it:
// Simulate the Element.children property in non-IE browsers that don't have it
// Note that this returns a static array rather than a live NodeList
if (!document.documentElement.children) {
Element.prototype.__defineGetter__("children", function() {
var kids = [];
for(var c = this.firstChild; c != null; c = c.nextSibling)
if (c.nodeType === 1) kids.push(c);
return kids;
});
}
The 
__defineGetter__
method (covered in §6.7.1) is completely nonstandard, but it is
perfect for portability code like this.
15.4  Attributes
HTML elements consist of a tag name and a set of name/value pairs known as attrib-
utes. The 
<a>
element that defines a hyperlink, for example, uses the value of its 
href
attribute as the destination of the link. The attribute values of HTML elements are
available as properties of the HTMLElement objects that represent those elements. The
DOM also defines other APIs for getting and setting the values of XML attributes and
nonstandard HTML attributes. The subsections that follow have details.
15.4.1  HTML Attributes As Element Properties
The HTMLElement objects that represent the elements of an HTML document define
read/write properties that mirror the HTML attributes of the elements. HTMLElement
defines properties for the universal HTTP attributes such as 
id
title
lang
, and 
dir
,
and event handler properties like 
onclick
. Element-specific subtypes define attributes
specific to those elements. To query the URL of an image, for example, you can use the
src
property of the HTMLElement that represents the 
<img>
element:
var image = document.getElementById("myimage"); 
var imgurl = image.src;   // The src attribute is the URL of the image
image.id === "myimage"    // Since we looked up the image by id
Similarly, you might set the form-submission attributes of a 
<form>
element with code
like this:
var f = document.forms[0];                      // First <form> in the document
f.action = "http://www.example.com/submit.php"; // Set URL to submit it to.
f.method = "POST";                              // HTTP request type
15.4  Attributes | 375
Client-Side
JavaScript
.NET PDF Document Viewing, Annotation, Conversion & Processing
Extract bookmark & outlines. Extract hyperlink inside PDF. PDF Write. Insert images into PDF. Edit, remove images from PDF. Add, edit, delete links. Form Process
add url pdf; clickable links in pdf files
VB.NET PDF: Basic SDK Concept of XDoc.PDF
You may add PDF document protection functionality into your VB.NET program. Hyperlink Edit. XDoc.PDF for .NET allows VB.NET developers to edit hyperlink of PDF
change link in pdf; clickable links in pdf
HTML attributes are not case sensitive, but JavaScript property names are. To convert
an attribute name to the JavaScript property, write it in lowercase. If the attribute is
more than one word long, however, put the first letter of each word after the first in
uppercase: 
defaultChecked
and 
tabIndex
, for example.
Some HTML attribute names are reserved words in JavaScript. For these, the general
rule is to prefix the property name with “html”. The HTML 
for
attribute (of the
<label>
element), for example, becomes the JavaScript 
htmlFor
property. “class” is a
reserved (but unused) word in JavaScript, and the very important HTML 
class
attribute
is an exception to the rule above: it becomes 
className
in JavaScript code. We’ll see
the 
className
property again in Chapter 16.
The properties that represent HTML attributes usually have string value. When the
attribute is a boolean or numeric value (the 
defaultChecked
and 
maxLength
attributes of
an 
<input>
element, for example), the properties values are booleans or numbers instead
of strings. Event handler attributes always have Function objects (or 
null
) as their val-
ues. The HTML5 specification defines a few attributes (such as the 
form
attribute of
<input>
and related elements) that convert element IDs to actual Element objects. Fi-
nally, the value of the 
style
property of any HTML element is a CSSStyleDeclaration
object rather than a string. We’ll see much more about this important property in
Chapter 16.
Note that this property-based API for getting and setting attribute values does not define
any way to remove an attribute from an element. In particular, the 
delete
operator
cannot be used for this purpose. The section that follows describes a method that you
can use to accomplish this.
15.4.2  Getting and Setting Non-HTML Attributes
As described above, HTMLElement and its subtypes define properties that correspond
to  the  standard  attributes  of  HTML elements.  The  Element  type  also  defines
getAttribute()
and 
setAttribute()
methods that you can use to query and set non-
standard HTML attributes and to query and set attributes on the elements of an XML
document:
var image = document.images[0];
var width = parseInt(image.getAttribute("WIDTH")); 
image.setAttribute("class", "thumbnail");
The code above highlights two important differences between these methods and the
property-based API described above. First, attribute values are all treated as strings.
getAttribute()
never returns a number, boolean, or object. Second, these methods use
standard attribute names, even when those names are reserved words in JavaScript. For
HTML elements, the attribute names are case insensitive.
Element also defines two related methods, 
hasAttribute()
and 
removeAttribute()
,
which check for the presence of a named attribute and remove an attribute entirely.
These methods are particularly useful with boolean attributes: these are attributes (such
376 | Chapter 15: Scripting Documents
VB.NET Create PDF from PowerPoint Library to convert pptx, ppt to
Export PowerPoint hyperlink to PDF. VB.NET Demo Code for Converting PowerPoint to PDF. Add necessary references: RasterEdge.Imaging.Basic.dll.
add links to pdf online; add link to pdf file
How to C#: Basic SDK Concept of XDoc.PDF for .NET
You may add PDF document protection functionality into your C# program. Hyperlink Edit. XDoc.PDF for .NET allows C# developers to edit hyperlink of PDF document
adding links to pdf document; add links to pdf
as the 
disabled
attribute of HTML form elements) whose presence or absence from an
element matters but whose value is not relevant.
If you are working with XML documents that include attributes from other namespa-
ces, you can use the namespaced variants of these four methods: 
getAttributeNS()
,
setAttributeNS()
hasAttributeNS()
, and 
removeAttributeNS()
. Instead of taking a sin-
gle attribute name string, these methods take two. The first is the URI that identifies
the namespace. The second is usually the unqualified local name of the attribute within
the namespace. For 
setAttributeNS()
only, however, the second argument is the
qualified name of the attribute and includes the namespace prefix. You can read more
about these namespace-aware attribute methods in Part IV.
15.4.3  Dataset Attributes
It is sometimes useful to attach additional information to HTML elements, typically
when JavaScript code will be selecting those elements and manipulating them in some
way. Sometimes this can be done by adding special identifiers to the 
class
attribute.
Other times, for more complex data, client-side programmers resort to the use of
nonstandard  attributes.  As  noted  above,  you  can  use  the 
getAttribute()
and
setAttribute()
methods to read and write the values of nonstandard attributes. The
price you pay, however, is that your document will not be valid HTML.
HTML5 provides a solution. In an HTML5 document, any attribute whose name is
lowercase and begins with the prefix “data-” is considered valid. These “dataset at-
tributes” will not affect the presentation of the elements on which they appear and they
define a standard way to attach additional data without compromising document
validity.
HTML5 also defines a 
dataset
property on Element objects. This property refers to an
object, which has properties that correspond to the 
data-
attributes with their prefix
removed. Thus 
dataset.x
would hold the value of the 
data-x
attribute. Hyphenated
attributes map to camel-case property names: the attribute 
data-jquery-test
becomes
the property 
dataset.jqueryTest
.
As a more concrete example, suppose that a document contains the following markup:
<span class="sparkline" data-ymin="0" data-ymax="10">
1 1 1 2 2 3 4 5 5 4 3 5 6 7 7 4 2 1
</span>
A sparkline is a small graphic—often a line plot—designed to be displayed within the
flow of text. In order to generate a sparkline, you might extract the value of the dataset
attributes above with code like this:
// Assumes the ES5 Array.map() method (or a work-alike) is defined
var sparklines = document.getElementsByClassName("sparkline");
for(var i = 0; i < sparklines.length; i++) {
var dataset = sparklines[i].dataset;
var ymin = parseFloat(dataset.ymin);
var ymax = parseFloat(dataset.ymax);
var data = sparklines[i].textContent.split(" ").map(parseFloat);
15.4  Attributes | 377
Client-Side
JavaScript
C# Create PDF from Word Library to convert docx, doc to PDF in C#.
Change Word hyperlink to PDF hyperlink and bookmark. C#.NET Sample Code: Convert Word to PDF in C#.NET Project. Add necessary references:
adding links to pdf; convert excel to pdf with hyperlinks
C# Create PDF from PowerPoint Library to convert pptx, ppt to PDF
Export PowerPoint hyperlink to PDF in .NET console application. C#.NET Demo Code: Convert PowerPoint to PDF in C#.NET Application. Add necessary references:
add hyperlink pdf file; add links to pdf acrobat
drawSparkline(sparklines[i], ymin, ymax, data);  // Not yet implemented
}
At the time of this writing, the 
dataset
property is not implemented in current browsers,
and the code above would have to be written like this:
var sparklines = document.getElementsByClassName("sparkline");
for(var i = 0; i < sparklines.length; i++) {
var elt = sparklines[i];
var ymin = parseFloat(elt.getAttribute("data-ymin"));
var ymin = parseFloat(elt.getAttribute("data-ymax"));
var points = elt.getAttribute("data-points");
var data = elt.textContent.split(" ").map(parseFloat);
drawSparkline(elt, ymin, ymax, data);  // Not yet implemented
}
Note that the 
dataset
property is (or will be, when implemented) a live, two-way in-
terface to the 
data-
attributes of an element. Setting or deleting a property of 
dataset
sets or removes the corresponding 
data-
attribute of the element.
The 
drawSparkline()
function in the above examples is fictitious, but Example 21-13
draws sparklines marked up like this using the 
<canvas>
element.
15.4.4  Attributes As Attr Nodes
There is one more way to work with the attributes of an Element. The Node type defines
an 
attributes
property. This property is 
null
for any nodes that are not Element ob-
jects. For Element objects, 
attributes
is a read-only array-like object that represents
all the attributes of the element. The attributes object is live in the way that NodeLists
are. It can be indexed numerically, which means that you can enumerate all the attrib-
utes of an element. And it can also be indexed by attribute name:
document.body.attributes[0]        // The first attribute of the <body> elt
document.body.attributes.bgcolor   // The bgcolor attribute of the <body> elt
document.body.attributes["ONLOAD"] // The onload attribute of the <body> elt
The values obtained when you index the 
attributes
object are Attr objects. Attr objects
are a specialized kind of Node but are never really used like one. The 
name
and 
value
properties of an Attr return the name and value of the attribute.
15.5  Element Content
Take a look again at Figure 15-1, and ask yourself what the “content” of the 
<p>
element
is. There are three ways we might answer this question:
• The content is the HTML string “This is a <i>simple</i> document.”
• The content is the plain-text string “This is a simple document.”
• The content is a Text node, an Element node that has a Text node child, and
another Text node.
378 | Chapter 15: Scripting Documents
Each of these are valid answers, and each answer is useful in its own way. The sections
that follow explain how to work with the HTML representation, the plain-text repre-
sentation, and the tree representation of element content.
15.5.1  Element Content As HTML
Reading the 
innerHTML
property of an Element returns the content of that element as a
string of markup. Setting this property on an element invokes the web browser’s parser
and replaces the element’s current content with a parsed representation of the new
string. (Despite its name, 
innerHTML
can be used with XML elements as well as HTML
elements.)
Web browsers are very good at parsing HTML and setting 
innerHTML
is usually fairly
efficient, even though the value you specify must be parsed. Note, however, that re-
peatedly appending bits of text to the 
innerHTML
property with the 
+=
operator is usually
not efficient because it requires both a serialization step and a parsing step.
innerHTML
was introduced in IE4. Although it has long been supported by all browsers,
it has only become standardized with the advent of HTML5. HTML5 says that
innerHTML
should work on Document nodes as well as Element nodes, but this is not
universally supported yet.
HTML5 also standardizes a property named 
outerHTML
. When you query 
outerHTML
,
the string of HTML or XML markup that is returned includes the opening and closing
tags of the element on which you queried it. When you set 
outerHTML
on an element,
the new content replaces the element itself. 
outerHTML
is defined only for Element nodes,
not Documents. At the time of this writing, 
outerHTML
is supported by all current
browsers except Firefox. (See Example 15-5, later in this chapter, for an 
outerHTML
implementation based on 
innerHTML
.)
Another  feature  introduced  by  IE  and  standardized  by  HTML5  is  the
insertAdjacentHTML()
method, which allows you to insert a string of arbitrary HTML
markup “adjacent” to the specified element. The markup is passed as the second ar-
gument to this method, and the precise meaning of “adjacent” depends on the value
of the first argument. This first argument should be a string with one of the values
“beforebegin”, “afterbegin”, “beforeend” or “afterend”. These values correspond to
insertion points that are illustrated in Figure 15-3.
Figure 15-3. Insertion points for insertAdjacentHTML()
insertAdjacentHTML()
is not supported by current versions of Firefox. Later in this
chapter, Example 15-6 shows how to implement 
insertAdjacentHTML()
using the
15.5  Element Content | 379
Client-Side
JavaScript
Download from Wow! eBook <www.wowebook.com>
innerHTML
property and also demonstrates how to write HTML insertion methods that
do not require the insertion position to be specified with a string argument.
15.5.2  Element Content As Plain Text
Sometimes you want to query the content of an element as plain text, or to insert plain-
text into a document (without having to escape the angle brackets and ampersands
used in HTML markup). The standard way to do this is with the 
textContent
property
of Node:
var para = document.getElementsByTagName("p")[0];  // First <p> in the document
var text = para.textContent;        // Text is "This is a simple document."
para.textContent = "Hello World!";  // Alter paragraph content
The 
textContent
property is supported by all current browsers except IE. In IE, you can
use the Element property 
innerText
instead. Microsoft introduced 
innerText
in IE4,
and it is supported by all current browsers except Firefox.
The 
textContent
and 
innerText
properties are similar enough that you can usually use
them interchangeably. Be careful though to distinguish empty elements (the string “”
is falsy in JavaScript) from undefined properties:
/**
* With one argument, return the textContent or innerText of the element.
* With two arguments, set the textContent or innerText of element to value.
*/
function textContent(element, value) {
var content = element.textContent;  // Check if textContent is defined
if (value === undefined) { // No value passed, so return current text
if (content !== undefined) return content;
else return element.innerText;
}
else {                     // A value was passed, so set text
if (content !== undefined) element.textContent = value;
else element.innerText = value;
}
}
The 
textContent
property is a straightforward concatenation of all Text node descend-
ants of the specified element. 
innerText
does not have a clearly specified behavior, but
differs from 
textContent
in a few ways. 
innerText
does not return the content of
<script>
elements. It omits extraneous whitespace and attempts to preserve table for-
matting. Also, 
innerText
is treated as a read-only property for certain table elements
such as 
<table>
<tbody>
, and 
<tr>
.
Text in <script> elements
Inline 
<script>
elements (i.e., those that do not have a 
src
attribute) have a 
text
prop-
erty that you can use to retrieve their text. The content of a 
<script>
element is never
displayed by the browser, and the HTML parser ignores angle brackets and ampersands
within a script. This makes a 
<script>
element an ideal place to embed arbitrary textual
data for use by your application. Simply set the 
type
attribute of the element to some
380 | Chapter 15: Scripting Documents
value (such as “text/x-custom-data”) that makes it clear that the script is not executable
JavaScript code. If you do this, the JavaScript interpreter will ignore the script, but the
element will exist in the document tree and its 
text
property will return the data to you.
15.5.3  Element Content As Text Nodes
Another way to work with the content of an element is as a list of child nodes, each of
which may have its own set of children. When thinking about element content, it is
usually the Text nodes that are of interest. In XML documents, you must also be pre-
pared to handle CDATASection nodes—they are a subtype of Text and represent the
content of CDATA sections.
Example 15-3 shows a 
textContent()
function that recursively traverses the children
of an element and concatenates the text of all the Text node descendants. In order to
understand the code, recall that the 
nodeValue
property (defined by the Node type)
holds the content of a Text node.
Example 15-3. Finding all Text node descendants of an element
// Return the plain-text content of element e, recursing into child elements.
// This method works like the textContent property
function textContent(e) {
var child, type, s = "";  // s holds the text of all children
for(child = e.firstChild; child != null; child = child.nextSibling) {
type = child.nodeType;
if (type === 3 || type === 4)  // Text and CDATASection nodes
s += child.nodeValue;
else if (type === 1)           // Recurse for Element nodes
s += textContent(child);
}
return s;
}
The 
nodeValue
property is read/write and you can set it to change the content displayed
by a Text or CDATASection node. Both Text and CDATASection are subtypes of
CharacterData, which you can look up in Part IV. CharacterData defines a 
data
prop-
erty, which is the same text as 
nodeValue
. The following function converts the content
of Text nodes to uppercase by setting the 
data
property:
// Recursively convert all Text node descendants of n to uppercase.
function upcase(n) {
if (n.nodeType == 3 || n.nodeTyep == 4) // If n is Text or CDATA
n.data = n.data.toUpperCase();      // ...convert content to uppercase.
else                                    // Otherwise, recurse on child nodes
for(var i = 0; i < n.childNodes.length; i++)
upcase(n.childNodes[i]);
}
CharacterData also defines infrequently used methods for appending, deleting, insert-
ing, and replacing text within a Text or CDATASection node. Instead of altering the
content of existing Text nodes, it is also possible to insert brand-new Text nodes into
15.5  Element Content | 381
Client-Side
JavaScript
an Element or to replace existing nodes with new Text nodes. Creating, inserting, and
deleting nodes is the topic of the next section.
15.6  Creating, Inserting, and Deleting Nodes
We’ve seen how to query and alter document content using strings of HTML and of
plain text. And we’ve also seen that we can traverse a Document to examine the indi-
vidual Element and Text nodes that it is made of. It is also possible to alter a document
at the level of individual nodes. The Document type defines methods for creating Ele-
ment and Text objects, and the Node type defines methods for inserting, deleting, and
replacing nodes in the tree. Example 13-4 demonstrated both node creation and node
insertion, and that short example is duplicated here:
// Asynchronously load and execute a script from a specified URL
function loadasync(url) { 
var head = document.getElementsByTagName("head")[0]; // Find document <head>
var s = document.createElement("script");  // Create a <script> element
s.src = url;                               // Set its src attribute 
head.appendChild(s);                       // Insert the <script> into head
}
The subsections that follow include more details and examples of node creation, of the
insertion and deletion of nodes, and also of the use of DocumentFragment as a shortcut
when working with multiple nodes.
15.6.1  Creating Nodes
As  shown  in  the  code  above,  you  can  create  new  Element  nodes  with  the
createElement()
method of the Document object. Pass the tag name of the element as
the method argument: this name is case-insensitive for HTML documents and case-
sensitive for XML documents.
Text nodes are created with a similar method:
var newnode = document.createTextNode("text node content");
Document  defines  other  factory  methods,  such  as  the  infrequently  used
createComment()
, as well. We’ll use the 
createDocumentFragment()
method in §15.6.4.
When  working  with  documents  that  use  XML  namespaces,  you  can  use
createElementNS()
to specify both the namespace URI and the tag name of the Element
to be created.
Another way to create new document nodes is to make copies of existing ones. Every
node has a 
cloneNode()
method that returns a new copy of the node. Pass 
true
to
recursively copy all descendants as well, or 
false
to only make a shallow copy. In
browsers other than IE, the Document object also defines a similar method named
importNode()
. If you pass it a node from another document, it returns a copy suitable
for insertion into this document. Pass 
true
as the second argument to recursively import
all descendants.
382 | Chapter 15: Scripting Documents
Documents you may be interested
Documents you may be interested