How to construct a document from a string - javascript

How to construct a document from a string
I have got a string, which is html-like ,I want to extract the element in the html text, I know that I can use htmlparser with java, but how to do the same function with javascript?
How can I construct a document from the string, Does createHTMLDocument work?
Or any other way to extract the element in the html text?
for example:
I have got the html text as :
<!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=utf-8" />
<title>titleValue</title>
<meta name="description" content="It is a good way to learn science." />
<meta name="keywords" content="Symfony2,Redis,PHP" />
<meta name="author" content="CSDN.NET" />
<meta name="Copyright" content="CSDN.NET" />
</head>
<body>
..........................
</body>
</html>
how to get the value of "description"
Here is my code, but the output is 0, what's wrong?
var el = document.createElement("div");
el.innerHTML = ' <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>titleValue</title> <meta name="description" content="It is a good way to learn science." /> <meta name="keywords" content="Symfony2,Redis,PHP" /> <meta name="author" content="CSDN.NET" /> <meta name="Copyright" content="CSDN.NET" /> </head> <body> hello</body> </html>';
var descElements = el.getElementsByTagName("head");
document.getElementById("news_content").innerHTML = descElements.length;

The simplest way to do this kind of manipulation would be with a library like jQuery. This is one way you could accomplish this task with jQuery (see a demo):
var markup = '<!DOCTYPE ...';
var parsed = $(markup);
var description = parsed.filter("meta[name='description']").attr('content');
alert(description);
Note that you will not have access to all elements (the <head/> element is not represented, for example) because not all elements are legal in the context of another document. The <meta/> elements should be fine, though.

Related

Why isn't my evaluate function being called on click? [duplicate]

This question already has answers here:
JS function named `animate` doesn't work in Chrome, but works in IE
(3 answers)
Closed 1 year ago.
I am new to JS so please bear with me :)
below is the code but on clicking it does not trigger the function
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button type="submit" onclick="evaluate()">Submit</button>
</body>
<script type="text/javascript">
function evaluate(){
document.write("Working");
};
</script>
</html>
evaluate() is a reserved function in JavaScript. Name your function something else.
The fact that the console error mentioned the need for two arguments was a clue that the function was defined somewhere already, and that your definition wasn't being considered.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button type="submit" onclick="notEvaluate()">Submit</button>
</body>
<script type="text/javascript">
function notEvaluate() {
document.write("Working");
};
</script>
</html>
Regarding document.write, see Why is document.write considered a "bad practice"?.
Try using a function name different than "evaluate" - evaluate is a reserved function name

What is wrong with my JavaScript DOM code to print a simple text?

I have to print "Hello, Mars", but something is wrong. I've tried to add paragraph.appendChild(text) too but it not works.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
const body = document.getElementById("body")
const paragraph = document.createElement("p")
const text = document.createTextNode("Hello, Mars")
body.appendChild(paragraph)
</script>
</body>
</html>
Two things here:
Firstly, you never add text to the created paragraph, which would be done by adding this:
paragraph.appendChild(text);
Secondly, using getElementById() you are selecting an item that would have id="body", not the <body> element on your page. You can get the body using document.body as follows:
const body = document.body;

How to add a HTML page to another HTML page

i am failing to make the import function work, i am trying to import latestfeatures.html to Untitled Document.html here is my sample code can anyone check it and tell me what is wrong.
<!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=utf-8" />
<title>Untitled Document</title>
<link rel="import" href="/template/html/latestfeatures.html">
<script>
var link = document.querySelector('link[rel="import"]');
var content = link.import;
// Grab DOM from latestfeatures.html's document.
var el = content.querySelector('.latestfeatures');
document.body.appendChild(el.cloneNode(true));
</script>
</head>
<body>
<div id="includedContent"></div>
</body>
</html>
you can use html iframe as iframe. Here you can get details of iframe.
http://www.w3schools.com/html/html_iframe.asp

HTML Javascript displaying Japanese characters incorrectly?

My HTML
<head >
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<div id="Target">食べる</div>
This displays perfectly fine .
document.getElementById("Target").innerHTML = "会う";
But once I use javascript to change the value of "Target" I get ��.
I'm fairly inexperienced when it comes to both javascript and encodings, so I apologize in advance if this is an easy fix.

Weibo like button

I am setting Weibo like button from the guide. And receiving interesting result that code that i write in jsFiddle is working but in the browser not. So what is the problem?
<!DOCTYPE html>
<html xmlns:wb="http://open.weibo.com/wb">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--必填-->
<meta property="og:type" content="app" />
<meta property="og:url" content="应用的URL地址,请勿携带统计代码,分页网址请统一填写第一页链接" />
<meta property="og:title" content="应用的显示名称标题,不建议携带网站名称等SEO信息" />
<meta property="og:description" content="应用的文字描述,将直接显示在微博里,建议完整填写,不要重复填 写标题" />
<!--选填-->
<meta property="og:image" content="应用的显示缩略图" />
<meta name="weibo:app:full_image" content="应用的原始大图" />
<meta name="weibo:app:create_at" content="应用的创建时间" />
<meta name="weibo:app:update_at" content="应用的更新时间" />
<script src="http://tjs.sjs.sinajs.cn/open/api/js/wb.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<wb:like appkey="4Q1NnV"></wb:like>
</body>
</html>
Code is OK, perhaps active content is blocked by the browser - you should check in console what is going on

Categories