0

下面的工作代码从 head 中获取所有元标记，并在网页的 div 中显示文本。在 keyup 上，我想复制输入文本 val 并替换 head 元描述并更新 div 以便我可以看到文本已从前端正确输入。

http://jsfiddle.net/michelm/JCWgA/

我有两件事有问题：

  1. 复制输入文本框的新值并替换元名称的“内容”=“描述”内容=“添加的新文本”（在div内）
  2. 复制输入文本框的 val 并替换头部元描述的“内容”

下面的一些代码：

 <h2>Meta Description</h2>
    <!-- I have head meta tags inside the below div to read the tags on the web page -->
    <div class="all">some text</div>

<!-- input text on keyup to 1. update head meta description, 2 update meta description inside the div (<div class="all">some text</div>) -->

<input type="text" name="metadescription" id="metadescription" />

<!-- this part of jquery is working -->
<script type="text/javascript">

var foo = '';

$("head meta").each(function () {
    foo += $(this).clone().wrap('<div>').parent().html();
});

//alert(foo); 
var b = $('.all').text(foo);


// the below is part is not quite working
$description = $('.all').find('meta[name=description]').attr('content');

$('#metadescription').keyup(function(){
  //  $('.all').find($description).text($(this).val());
    //the below just replace all the text, but I want it to replace the 'content'
    $('.all').text($(this).val());
    //alert(foo); 



});

</script>

我得到了这个工作，很大一部分要感谢softsdev的大部分代码:)）

*下面是完整的工作代码！！！！**

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="This is the meta description of some sort" >
<meta name="keywords" content="some, content, added" >
<title>change meta content</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $( document ).ready(function(){
        $('.content').keyup(function(){
            $('meta[name=description]').attr('content', $(this).val());
        });


    });

</script>
</head>

<body>



    <h2>Meta Description</h2>

<div class="all">some text</div>
    <h4>Update meta description</h4>
<input type="text" name="content"  class="content"/>

<script type="text/javascript">
$('.content').keyup(function(){

    $('.all').text('<meta name="description" content="'+$(this).val()+'">');

});


$('.all').append(($('meta[name=descritption]').attr('content')));
var tt = jQuery.metadata.get(name=descritption)
   $('.all').text(tt);
   $('meta[name=description]').attr('description').insertAfter('body');
</script>

<script language="JavaScript">
if (document.getElementsByName) {

  var metaArray = document.getElementsByName('description');
  for (var i=0; i<metaArray.length; i++) {
   // document.write(metaArray[i].content + '<br>');
            $('.all').text('<meta name="description" content="'+ metaArray[i].content +'">' );

  }

}
</script>

</body>
</html>
4

1 回答 1

1

你可以做类似的例子

改变

$('.all').text($(this).val());

和

$('.all').text('<meta http-equiv="content-type" content="'+$(this).val()+'">');

更新的答案

如果您想在 html 中执行此操作，则可以尝试此操作并检查 firebug 内容将更改元标记

但它只会反映在客户端

<!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=iso-8859-1" />
<meta name="description" content="This is the meta description of some sort" >
<meta name="keywords" content="some, content, added" >
<title>change meta content</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $( document ).ready(function(){
        $('.content').keyup(function(){
            $('meta[name=description]').attr('content', $(this).val());
        });
    });

</script>
</head>

<body>
    <input type="text" name="content"  class="content"/>
</body>
</html>
于 2013-08-29T10:08:06.223 回答